Amarao My Bbg ~ The Hoard

Valentine Cards

This was originally a thing for my Amarao shrine but then I remebered I didn't do nothing for v-day. So it's getting reused for that purpose. It's valentine cards for characters that I like. Feel free to do your own with the code below, just credit me somewhere :).

Amarao

Code for cards <3

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="http://fonts.cdnfonts.com/css/fortyseven-micro-nbp" rel="stylesheet"> <style> body{ background-color: #400101; background-image: url("https://files.catbox.moe/ab6aci.gif"); font-family: 'Arial'; background-attachment: fixed; } #container{ display: flex; justify-content: center; align-items: center; width: 800px; margin: 0 auto; margin-bottom: 10px; padding: 10px; /*border: 4px solid #9aa4b6;*/ background-color: #ad3131; border: 10px solid transparent; border-image: url(https://files.catbox.moe/mkl6oy.png) 10 round; background-clip: padding-box; } #box{ width: 800px; color: #000; height: 580px; } #side{ float: left; width: 145px; padding: 0px 0px 5px 0px; overflow: hidden; } #scroll_box{ float: right; width: 375px; height: 200px; padding: 6px 6px 10px 6px; margin: 6px 6px 10px 6px; overflow: auto; border: 2px solid #9aa4b6; /*border-radius: 4px;*/ } .mainboxes a{ /*text-decoration: none;*/ color: #e662dd; } .mainboxes a:visited{ color: #010066; } .mainboxes a:hover{ text-shadow: 0px 0px 2px #010066; } #main{ float: right; width: 780px; overflow: hidden; padding: 0px 10px 5px 0px; object-fit: contain; } .mainboxes{ border: 2px solid #9aa4b6; padding: 30px; margin: 0px 0px 5px 0px; background-image: url("https://files.catbox.moe/ooy8wb.png"); background-color: #f9d5d5; background-repeat: no-repeat; background-position: bottom; flex-warp: wrap; height: 500px; font-size: 17px; margin-top: 5px; a link: #6e5057; } .mainboxescontent{ /*padding: 0px 15px 0px 15px;*/ color: #6e5057; font-size: 17px; overflow: auto; } ::-webkit-scrollbar{ width: 8px; } ::-webkit-scrollbar-track{ background-color: #ece9d8; } ::-webkit-scrollbar-thumb{ background-color: #ece9d8; } p{ color: #6e5057; } .shrineImg { height: 210px; width: 188px; /*border: 2px solid black; */ margin: 15px 15px 0px 15px; font-weight: bold; display:inline-block; } #infoBox { height: 260px; width: 390px; /*border: 2px solid black; */ margin: 5px; font-weight: bold; padding: 5px; float: right; background: white; color: #6e5057; border: 10px solid transparent; border-image: url(https://files.catbox.moe/5ghp7a.png) 17 round; background-clip: padding-box; overflow-y: scroll; scrollbar-width: none; /*Firefox */ -ms-overflow-style: none; /*Internet Explorer 10+ */ } h2 { font-family: Verdana; } </style> </head> <body> <div id="container"> <div id="box"> <div id="main"> <div class="mainboxes"> <img src="https://files.catbox.moe/am4jpz.gif" style="min-width: 720px;"> <center> <img src="https://files.catbox.moe/hvitdz.gif" style="float:left;">  <img src="https://files.catbox.moe/hvitdz.gif" style="-webkit-transform: scaleX(-1); transform: scaleX(-1); float: right;"></center><br>  <img src="https://the-game-hoard.neocities.org/Shrines/FLCL/flcl-amarao.gif" style="max-width: 270px; margin:5px;">  <div id="infoBox"> <center><h2><i>☆ INSERT CHAR ☆</i></h2></center> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p> </div>   <marquee behavior="alternate" style="margin-top: 5px;"> <img src="/Shrines/FLCL/amarao/amaraoStamp1.png"> <img src="/Shrines/FLCL/amarao/amaraoStamp2.png"> <img src="/Shrines/FLCL/amarao/amaraoStamp5.gif"> <img src="/Shrines/FLCL/amarao/amaraoStamp3.png"> <img src="/Shrines/FLCL/amarao/amaraoStamp8.png"> <img src="/Shrines/FLCL/amarao/amaraoStamp4.gif"> <img src="/Shrines/FLCL/amarao/amaraoStamp7.png"> <img src="/Shrines/FLCL/amarao/amaraoStamp6.png"> </marquee> <img src="https://files.catbox.moe/am4jpz.gif" style="min-width: 720px;"> </div> </div> </div> </div> </div> </body> </html>