diff --git a/audio.mp3 b/audio.mp3 new file mode 100644 index 00000000..1d2f75c0 Binary files /dev/null and b/audio.mp3 differ diff --git a/cardback.png b/cardback.png new file mode 100644 index 00000000..5f3a94c4 Binary files /dev/null and b/cardback.png differ diff --git a/click1.wav b/click1.wav new file mode 100644 index 00000000..bf38f0cd Binary files /dev/null and b/click1.wav differ diff --git a/club10.png b/club10.png new file mode 100644 index 00000000..4b1add24 Binary files /dev/null and b/club10.png differ diff --git a/club2.png b/club2.png new file mode 100644 index 00000000..3eee93a6 Binary files /dev/null and b/club2.png differ diff --git a/club3.png b/club3.png new file mode 100644 index 00000000..ee13fa13 Binary files /dev/null and b/club3.png differ diff --git a/club4.png b/club4.png new file mode 100644 index 00000000..bcd7a91f Binary files /dev/null and b/club4.png differ diff --git a/club5.png b/club5.png new file mode 100644 index 00000000..79caa147 Binary files /dev/null and b/club5.png differ diff --git a/club6.png b/club6.png new file mode 100644 index 00000000..5d95b869 Binary files /dev/null and b/club6.png differ diff --git a/club7.png b/club7.png new file mode 100644 index 00000000..10ecb693 Binary files /dev/null and b/club7.png differ diff --git a/club8.png b/club8.png new file mode 100644 index 00000000..a900a7c2 Binary files /dev/null and b/club8.png differ diff --git a/club9.png b/club9.png new file mode 100644 index 00000000..b24233c6 Binary files /dev/null and b/club9.png differ diff --git a/clubace.png b/clubace.png new file mode 100644 index 00000000..5f8ca177 Binary files /dev/null and b/clubace.png differ diff --git a/clubjack.png b/clubjack.png new file mode 100644 index 00000000..259e2955 Binary files /dev/null and b/clubjack.png differ diff --git a/clubking.png b/clubking.png new file mode 100644 index 00000000..4c87248c Binary files /dev/null and b/clubking.png differ diff --git a/clubqueen.png b/clubqueen.png new file mode 100644 index 00000000..b26e0596 Binary files /dev/null and b/clubqueen.png differ diff --git a/diamond10.png b/diamond10.png new file mode 100644 index 00000000..014288b5 Binary files /dev/null and b/diamond10.png differ diff --git a/diamond2.png b/diamond2.png new file mode 100644 index 00000000..2a5b3d4c Binary files /dev/null and b/diamond2.png differ diff --git a/diamond3.png b/diamond3.png new file mode 100644 index 00000000..30f5a043 Binary files /dev/null and b/diamond3.png differ diff --git a/diamond4.png b/diamond4.png new file mode 100644 index 00000000..f5fc63f3 Binary files /dev/null and b/diamond4.png differ diff --git a/diamond5.png b/diamond5.png new file mode 100644 index 00000000..e3210069 Binary files /dev/null and b/diamond5.png differ diff --git a/diamond6.png b/diamond6.png new file mode 100644 index 00000000..e5b6d6fb Binary files /dev/null and b/diamond6.png differ diff --git a/diamond7.png b/diamond7.png new file mode 100644 index 00000000..3451744c Binary files /dev/null and b/diamond7.png differ diff --git a/diamond8.png b/diamond8.png new file mode 100644 index 00000000..6dc2ad62 Binary files /dev/null and b/diamond8.png differ diff --git a/diamond9.png b/diamond9.png new file mode 100644 index 00000000..388f1c81 Binary files /dev/null and b/diamond9.png differ diff --git a/diamondace.png b/diamondace.png new file mode 100644 index 00000000..94dba554 Binary files /dev/null and b/diamondace.png differ diff --git a/diamondjack.png b/diamondjack.png new file mode 100644 index 00000000..41176ea9 Binary files /dev/null and b/diamondjack.png differ diff --git a/diamondking.png b/diamondking.png new file mode 100644 index 00000000..f8e06da1 Binary files /dev/null and b/diamondking.png differ diff --git a/diamondqueen.png b/diamondqueen.png new file mode 100644 index 00000000..7f67711d Binary files /dev/null and b/diamondqueen.png differ diff --git a/gg.mp4 b/gg.mp4 new file mode 100644 index 00000000..444a8752 Binary files /dev/null and b/gg.mp4 differ diff --git a/guard.png b/guard.png new file mode 100644 index 00000000..a22c8387 Binary files /dev/null and b/guard.png differ diff --git a/heart10.png b/heart10.png new file mode 100644 index 00000000..c0d32d0b Binary files /dev/null and b/heart10.png differ diff --git a/heart2.png b/heart2.png new file mode 100644 index 00000000..a1aab95d Binary files /dev/null and b/heart2.png differ diff --git a/heart3.png b/heart3.png new file mode 100644 index 00000000..fb42c3c1 Binary files /dev/null and b/heart3.png differ diff --git a/heart4.png b/heart4.png new file mode 100644 index 00000000..124f04c6 Binary files /dev/null and b/heart4.png differ diff --git a/heart5.png b/heart5.png new file mode 100644 index 00000000..d0fbbff8 Binary files /dev/null and b/heart5.png differ diff --git a/heart6.png b/heart6.png new file mode 100644 index 00000000..59f81ea7 Binary files /dev/null and b/heart6.png differ diff --git a/heart7.png b/heart7.png new file mode 100644 index 00000000..39f59151 Binary files /dev/null and b/heart7.png differ diff --git a/heart8.png b/heart8.png new file mode 100644 index 00000000..bd8584e7 Binary files /dev/null and b/heart8.png differ diff --git a/heart9.png b/heart9.png new file mode 100644 index 00000000..da903b53 Binary files /dev/null and b/heart9.png differ diff --git a/heartace.png b/heartace.png new file mode 100644 index 00000000..cc6a8f80 Binary files /dev/null and b/heartace.png differ diff --git a/heartjack.png b/heartjack.png new file mode 100644 index 00000000..9cbfe80a Binary files /dev/null and b/heartjack.png differ diff --git a/heartking.png b/heartking.png new file mode 100644 index 00000000..94180c2f Binary files /dev/null and b/heartking.png differ diff --git a/heartqueen.png b/heartqueen.png new file mode 100644 index 00000000..718463ac Binary files /dev/null and b/heartqueen.png differ diff --git a/index.html b/index.html new file mode 100644 index 00000000..eaa75e70 --- /dev/null +++ b/index.html @@ -0,0 +1,19 @@ + + + + Mysterious Invitation + + + + + + +
+ From different walks of life but each deeply in debt... A series of children's games for the chance to a prize... Deadly penalties if they lose... +
+ + + + diff --git a/index1.html b/index1.html new file mode 100644 index 00000000..e84955cf --- /dev/null +++ b/index1.html @@ -0,0 +1,59 @@ + + + + Squid Poker + + + + + + + + + +
+
+ + +
+
+ +
+ +
+
+ +

+ +
+ +
+
+ +
+ +
+ +
+ +
+ +
+
+
+ +
+ +
+
+ + diff --git a/invite0.png b/invite0.png new file mode 100644 index 00000000..98c64fe6 Binary files /dev/null and b/invite0.png differ diff --git a/invite1.png b/invite1.png new file mode 100644 index 00000000..55f1da1d Binary files /dev/null and b/invite1.png differ diff --git a/logo.png b/logo.png new file mode 100644 index 00000000..622de283 Binary files /dev/null and b/logo.png differ diff --git a/player.png b/player.png new file mode 100644 index 00000000..4d229e7b Binary files /dev/null and b/player.png differ diff --git a/script.js b/script.js new file mode 100644 index 00000000..eb5b0eb3 --- /dev/null +++ b/script.js @@ -0,0 +1,368 @@ +const makeDeck = () => { + const newDeck = []; + const suits = ['heart', 'diamond', 'club', 'spade']; + + for (let suitIndex = 0; suitIndex < suits.length; suitIndex += 1) { + const currentSuit = suits[suitIndex]; + + for (let rankCounter = 1; rankCounter <= 13; rankCounter += 1) { + + let cardName = `${rankCounter}`; + + if (cardName === '1') { + cardName = 'ace'; + } else if (cardName === '11') { + cardName = 'jack'; + } else if (cardName === '12') { + cardName = 'queen'; + } else if (cardName === '13') { + cardName = 'king'; + } + + let cardImg = currentSuit+cardName +".png" + + const card = { + name: cardName, + suit: currentSuit, + rank: rankCounter, + img: cardImg + }; + + console.log(card.img) + newDeck.push(card); + } + } + + return newDeck; +}; + +const getRandomIndex = (max) => Math.floor(Math.random() * max); + +const shuffleCards = (cards) => { + for (let currentIndex = 0; currentIndex < cards.length; currentIndex += 1) { + + const randomIndex = getRandomIndex(cards.length); + const randomCard = cards[randomIndex]; + const currentCard = cards[currentIndex]; + cards[currentIndex] = randomCard; + cards[randomIndex] = currentCard; + } + return cards; +}; + +let outputMessage = (message) => { + document.getElementById('container-message').innerHTML = message +}; + +const reset = () => { + gameMode = 'bet' + playerBet = 0; + playerHand.splice(0, playerHand.length) + double = 0; + triple = 0; + quadruple = 0; + straight = false; + flush = false; + royalStraight = false; + cardInHand1.src = ('cardback.png') + cardInHand2.src = ('cardback.png') + cardInHand3.src = ('cardback.png') + cardInHand4.src = ('cardback.png') + cardInHand5.src = ('cardback.png') + document.getElementById('display-points').innerHTML = playerPoints +} + +const drawPhase = () => { + + if (playerHand.length <1 && playerBet !== 0 && gameMode === 'draw') { + + const deck = shuffleCards(makeDeck()); + + outputMessage ("Click on any card to trade for a different one.

Your can only do this once per card, think carefully.

Click 'Confirm' when you are ready.") + + for (counter = 0; counter < 5; counter +=1){ + playerHand.push(deck.pop()) + } + + console.log(playerHand, "Cards Drawn") + + cardInHand1.src = playerHand[0].img + cardInHand1.addEventListener("click", ()=>{ + playerHand.splice(0,1,deck.pop()) + cardInHand1.src = playerHand[0].img + },{once : true}); + document.getElementById("display-card").appendChild(cardInHand1); + + + cardInHand2.src = playerHand[1].img + cardInHand2.addEventListener("click", ()=>{ + playerHand.splice(1,1,deck.pop()) + cardInHand2.src = playerHand[1].img + },{once : true}); + document.getElementById("display-card").appendChild(cardInHand2); + + cardInHand3.src = playerHand[2].img + cardInHand3.addEventListener("click", ()=>{ + playerHand.splice(2,1,deck.pop()) + cardInHand3.src = playerHand[2].img + },{once : true}); + document.getElementById("display-card").appendChild(cardInHand3); + + cardInHand4.src = playerHand[3].img + cardInHand4.addEventListener("click", ()=>{ + playerHand.splice(3,1,deck.pop()) + cardInHand4.src = playerHand[3].img + },{once : true}); + document.getElementById("display-card").appendChild(cardInHand4); + + cardInHand5.src = playerHand[4].img + cardInHand5.addEventListener("click", ()=>{ + playerHand.splice(4,1,deck.pop()) + cardInHand5.src = playerHand[4].img + },{once : true}); + document.getElementById("display-card").appendChild(cardInHand5); + + gameMode = 'check' + } +} + +const checkWin = () =>{ +if (gameMode === 'check'){ + var cardNameTally = {}; + + for (let i = 0; i < playerHand.length; i += 1) { + var cardName = playerHand[i].name; + + if (cardName in cardNameTally) { + cardNameTally[cardName] += 1; + } + else { + cardNameTally[cardName] = 1; + } + } + + var cardSuitTally = {}; + + for (let i = 0; i < playerHand.length; i += 1) { + var cardSuit = playerHand[i].suit; + + if (cardSuit in cardSuitTally) { + cardSuitTally[cardSuit] += 1; + } + else { + cardSuitTally[cardSuit] = 1; + } + } + + const nameTallyArrayKey = Object.keys(cardNameTally); + console.log(nameTallyArrayKey) + const nameTallyArrayValue = Object.values(cardNameTally); + console.log(nameTallyArrayValue) + + const suitTallyArrayKey = Object.keys(cardSuitTally); + console.log(suitTallyArrayKey) + const suitTallyArrayValue = Object.values(cardSuitTally); + console.log(suitTallyArrayValue) + +// Check hand for same card type +for (let i = 0; i < nameTallyArrayValue.length; i += 1) { + if (nameTallyArrayValue[i] === 2){ + double += 1 + } + if (nameTallyArrayValue[i] === 3){ + triple += 1 + } + if (nameTallyArrayValue[i] === 4){ + quadruple += 1 + } +} + +// Check hand for same suit +for (let i = 0; i < suitTallyArrayValue.length; i += 1) { + if (suitTallyArrayValue[i] === 5){ + flush = true; + } +} + + const newArray =[...nameTallyArrayKey] + console.log(newArray) + + for (let i = 0; i < newArray.length; i += 1) { + if (newArray[i] === 'jack'){ + newArray.splice(i, 1, "11") + } + if (newArray[i] === 'queen'){ + newArray.splice(i, 1, "12") + } + if (newArray[i] === 'king'){ + newArray.splice(i, 1, "13") + } + if (newArray[i] === 'ace'){ + newArray.splice(i, 1, "14") + } + + newArray.sort((a,b)=>{return a-b}) + } + + if (newArray.length === 5){ + if ((newArray[0] === newArray[1]-1) && (newArray[1] === newArray[2]-1) && (newArray[2] === newArray[3]-1) && (newArray[3] === newArray[4]-1)){ + straight = true; + } + + if ((newArray[0] === "10") && (newArray[0] === "11") && (newArray[0] === "12") && (newArray[0] === "13") && (newArray[0] === "14")){ + royalStraight = true; + } + console.log(newArray) + } + + if ((double === 0) && (triple === 0) && (quadruple === 0) && (straight === false) && (flush === false) && (royalStraight === false)){ + playerPoints = playerPoints; + reset() + outputMessage ("YOU LOST THIS ROUND...") + } + + if (double === 1 && triple === 0 && flush === false) { + playerPoints += playerBet * 2 + reset() + outputMessage ("PAIR !

BET PAYOUT ˣ 2") + } + + if (double === 2 && flush === false) { + playerPoints += playerBet * 4 + reset() + outputMessage ("TWO PAIRS !!

BET PAYOUT ˣ 4") + } + + if (triple === 1 && double === 0 && flush === false) { + playerPoints += playerBet * 3 + reset() + outputMessage ("THREE OF A KIND !!!

BET PAYOUT ˣ 3") + } + + if (double === 1 && triple === 1) { + playerPoints += playerBet * 9 + reset() + outputMessage ("FULL HOUSE !

BET PAYOUT ˣ 9") + } + + if (quadruple === 1) { + playerPoints += playerBet * 25 + reset() + outputMessage ("FOUR OF A KIND !!!!

BET PAYOUT ˣ 25") + } + + if (flush === true && straight === false && double !== 1 && triple !== 1) { + playerPoints += playerBet * 6 + reset() + outputMessage ("FLUSH !

BET PAYOUT ˣ 6") + } + + if (flush === false && straight === true) { + playerPoints += playerBet * 4 + reset() + outputMessage ( "STRAIGHT !

BET PAYOUT ˣ 4") + } + + if (flush === true && straight === true) { + playerPoints += playerBet * 50 + reset() + outputMessage ( "STRAIGHT FLUSH !

BET PAYOUT ˣ 50") + } + + if (flush === true && straight === false && royalStraight === true) { + playerPoints += playerBet * 250 + reset() + outputMessage ( "ROYAL FLUSH !!

BET PAYOUT ˣ 250") + } + } +} + +let gameMode = 'bet' +let playerPoints = 100; +let playerBet = 0; +const playerHand = []; + +let double = 0; +let triple = 0; +let quadruple = 0; +let straight = false; +let flush = false; +let royalStraight = false; + + document.getElementById('display-points').innerHTML = playerPoints + + const input = document.getElementById('bid') + + const enterBet = (input) => { + playerBet = input; + } + + const convertInputPoints = () => { + playerBet = Number(input.value) + if (gameMode === 'bet'){ + if (playerBet > playerPoints) { + playerBet = 0; + document.getElementById('display-points').innerHTML = playerPoints + outputMessage ("The guards are watching...

Please enter a bet within your limits.") + } + + if (isNaN(playerBet)) { + playerBet = 0; + document.getElementById('display-points').innerHTML = playerPoints + outputMessage ("The guards are watching...

Please enter a number as your bet.") + } + + if (playerBet > 0){ + playerPoints -= playerBet + gameMode = 'draw' + outputMessage ("You Bet " + playerBet + " Points.

Proceed to Deal Cards.") + document.getElementById('display-points').innerHTML = playerPoints + console.log(playerBet) + console.log(gameMode) + } + + if (gameMode==='bet' && playerPoints === 0){ + window.location.href="gg.mp4"; + } + + if (gameMode==='bet' && playerPoints === 10000){ + window.location.href="win.mp4"; + } + } + } + + outputMessage ("Help Sang-woo survive by winning in poker.

You start with 100 Points.

Place your bet, then deal cards.") + + const betButton = document.querySelector ('.button-bid') + betButton.addEventListener("click", convertInputPoints) + + const drawButton = document.querySelector ('.button-draw') + drawButton.addEventListener("click", drawPhase) + + const swapButton = document.querySelector ('.button-swap') + swapButton.addEventListener("click", checkWin) + + const cardInHand1 = document.createElement('img') + cardInHand1.classList.add('cardStyle') + cardInHand1.src = ('cardback.png') + document.getElementById("display-card").appendChild(cardInHand1); + + const cardInHand2 = document.createElement('img') + cardInHand2.classList.add('cardStyle') + cardInHand2.src = ('cardback.png') + document.getElementById("display-card").appendChild(cardInHand2); + + const cardInHand3 = document.createElement('img') + cardInHand3.classList.add('cardStyle') + cardInHand3.src = ('cardback.png') + document.getElementById("display-card").appendChild(cardInHand3); + + const cardInHand4 = document.createElement('img') + cardInHand4.classList.add('cardStyle') + cardInHand4.src = ('cardback.png') + document.getElementById("display-card").appendChild(cardInHand4); + + const cardInHand5 = document.createElement('img') + cardInHand5.classList.add('cardStyle') + cardInHand5.src = ('cardback.png') + document.getElementById("display-card").appendChild(cardInHand5); diff --git a/spade10.png b/spade10.png new file mode 100644 index 00000000..28b64a78 Binary files /dev/null and b/spade10.png differ diff --git a/spade2.png b/spade2.png new file mode 100644 index 00000000..b9e00a16 Binary files /dev/null and b/spade2.png differ diff --git a/spade3.png b/spade3.png new file mode 100644 index 00000000..858338fe Binary files /dev/null and b/spade3.png differ diff --git a/spade4.png b/spade4.png new file mode 100644 index 00000000..06d4fb03 Binary files /dev/null and b/spade4.png differ diff --git a/spade5.png b/spade5.png new file mode 100644 index 00000000..184ab581 Binary files /dev/null and b/spade5.png differ diff --git a/spade6.png b/spade6.png new file mode 100644 index 00000000..9c56cc9b Binary files /dev/null and b/spade6.png differ diff --git a/spade7.png b/spade7.png new file mode 100644 index 00000000..a3e37d8f Binary files /dev/null and b/spade7.png differ diff --git a/spade8.png b/spade8.png new file mode 100644 index 00000000..9f51c5c1 Binary files /dev/null and b/spade8.png differ diff --git a/spade9.png b/spade9.png new file mode 100644 index 00000000..6c8289e9 Binary files /dev/null and b/spade9.png differ diff --git a/spadeace.png b/spadeace.png new file mode 100644 index 00000000..5901d8fd Binary files /dev/null and b/spadeace.png differ diff --git a/spadejack.png b/spadejack.png new file mode 100644 index 00000000..e7b275a2 Binary files /dev/null and b/spadejack.png differ diff --git a/spadeking.png b/spadeking.png new file mode 100644 index 00000000..63724d6e Binary files /dev/null and b/spadeking.png differ diff --git a/spadequeen.png b/spadequeen.png new file mode 100644 index 00000000..78ea354f Binary files /dev/null and b/spadequeen.png differ diff --git a/styles.css b/styles.css new file mode 100644 index 00000000..dfa098ef --- /dev/null +++ b/styles.css @@ -0,0 +1,211 @@ +body { + background-image: url("test.png"); + background-size: cover; +} + +#main { + height: 99%; + width: 99%; + display: flex; + border: solid 8px black; + /* align-content: space-between; */ +} + +#left-side { + width: 80%; + display: flex; + /* justify-content: space-evenly; */ + flex-wrap: wrap; + margin-top: 20px; +} + +#container-message { + background-color: rgba(0, 0, 0, 0.87); + border: solid 3px rgb(247, 56, 167); + display: flex; + justify-content: center; + align-items: center; + height: 200px; + width: 480px; + margin-top: 20px; + margin-left: 100px; + font-family: "Rajdhani", sans-serif; + font-size: 20px; + font-weight: bold; + border-radius: 15px; + color: rgb(245, 80, 176); +} + +#container-message:hover { + background-color: rgba(255, 255, 255, 0.699); + border: solid 3px black; + display: flex; + justify-content: center; + align-items: center; + height: 200px; + width: 480px; + margin-top: 20px; + margin-left: 100px; + font-family: "Rajdhani", sans-serif; + font-size: 20px; + font-weight: bold; + border-radius: 15px; + color: black; +} + +#logo { + height: 0px; + width: auto; + margin-left: 50px; +} + +.player { + background-image: url("player.png"); + background-size: 205px; + background-repeat: no-repeat; + height: 200px; + width: 200px; + margin-top: 20px; + margin-left: 70px; + display: flex; + justify-content: center; + align-content: center; + align-items: flex-end; +} + +.header { + height: 240px; + width: auto; +} + +/* #audio { + margin-top: 500px; + height: 100px; + width: 100px; +} */ + +.guard { + display: flex; + align-items: center; + margin-top: 100px; + margin-right: 50px; + /* height: 350px; + width: auto; */ +} + +#right-side { + width: 20%; + display: flex; + flex-direction: column; + align-items: center; +} + +#display-card { + height: 500px; + width: 1400px; + background-color: rgba(0, 0, 0, 0); + display: flex; + justify-content: flex-end; + align-items: center; + margin-top: 15px; +} + +#buttons { + display: flex; + width: 1400px; + margin-right: 120px; + flex-wrap: wrap; + justify-content: center; + justify-content: space-around; +} + +#display-points { + height: 65px; + width: 100px; + font-family: "Rajdhani", sans-serif; + font-size: 35px; + display: flex; + justify-content: center; + align-items: center; +} + +#bidding-form { + height: 65px; + width: 100px; + margin-left: 50px; + display: flex; + background-color: rgba(0, 0, 0, 0); + color: inherit; + border: none; + padding: 0; + font: inherit; + cursor: pointer; + outline: inherit; + font-family: "Rajdhani", sans-serif; + font-size: 35px; +} + +button, +input[type="submit"], +input[type="reset"] { + background-color: rgba(250, 250, 250, 0.788); + height: 110px; + width: 250px; + margin-left: 45px; + margin-bottom: 30px; + color: inherit; + border: none; + padding: 0; + font: inherit; + cursor: pointer; + outline: 3px solid black; + font-family: "Rajdhani", sans-serif; + font-size: 32px; + display: flex; + justify-content: center; + align-items: center; + border-radius: 1px; +} + +button:hover, +input[type="submit"], +input[type="reset"] { + background-color: rgba(230, 24, 120, 0.658); + height: 110px; + width: 250px; + margin-left: 45px; + margin-bottom: 30px; + color: inherit; + border: none; + padding: 0; + font: inherit; + cursor: pointer; + outline: 3px solid black; + font-family: "Rajdhani", sans-serif; + font-size: 32px; + display: flex; + justify-content: center; + align-items: center; + font-weight: bold; + border-radius: 1px; +} + +.cardStyle { + height: 75%; + width: auto; + margin-right: 30px; + border-radius: 25px; +} + +.cardStyle:hover { + height: 75%; + width: auto; + margin-right: 30px; + border-radius: 25px; + outline: 5px solid rgba(230, 24, 120, 0.658); +} + +#login { + display: flex; + background-size: contain; +} diff --git a/styles1.css b/styles1.css new file mode 100644 index 00000000..c19e3765 --- /dev/null +++ b/styles1.css @@ -0,0 +1,38 @@ +body { + background-color: black; +} + +div { + background-image: url("invite0.png"); + background-repeat: no-repeat; + background-position: center; + position: absolute; + top: 10px; /* Header Height */ + bottom: 10px; + width: 95%; + display: flex; + justify-content: center; + align-items: center; + font-family: "Rajdhani", sans-serif; + font-size: 32px; + text-decoration: none; +} + +div:hover { + background-image: url("invite1.png"); + background-repeat: no-repeat; + background-position: center; + position: absolute; + top: 10px; /* Header Height */ + bottom: 10px; /* Footer Height */ + width: 95%; + display: flex; + justify-content: center; + font-family: "Rajdhani", sans-serif; + font-size: 32px; + text-decoration: none; +} + +.img { + height: 800px; +} diff --git a/test.png b/test.png new file mode 100644 index 00000000..e49a3095 Binary files /dev/null and b/test.png differ diff --git a/transparent.png b/transparent.png new file mode 100644 index 00000000..9a5393ab Binary files /dev/null and b/transparent.png differ diff --git a/win.mp4 b/win.mp4 new file mode 100644 index 00000000..8985afc1 Binary files /dev/null and b/win.mp4 differ