API tools faq
paste
Advertisement
Jayn

Anime Recs 01

Jayn
Feb 28th, 2014
1,037
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.67 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-- HELLO FRIENDS! THIS IS JAYN HERE WITH A NEW PAGE FOR YOU.
  6. OF COURSE I'D LIKE TO ASK THAT YOU DON'T STEAL THIS CODE BECAUSE THAT WOULD BE
  7. REALLY UNFORTUNATE. PLEASE DON'T DELETE THIS PART, OR THE HEART IN YOUR LINKS SECTION.
  8. THANK SO MUCH YOU'RE THE BESS. KISS KISS. -->
  9.  
  10.  
  11. <!--THIS IS THE TITLE OF YOUR PAGE-->
  12.  
  13. <title>Anime Recommendations</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15.  
  16. <link href='http://fonts.googleapis.com/css?family=Bitter:700,400' rel='stylesheet' type='text/css'>
  17. <link href='http://fonts.googleapis.com/css?family=Roboto:100' rel='stylesheet' type='text/css'>
  18. <style type="text/css">
  19.  
  20. @font-face {
  21. font-family: 'Rex Bold';
  22. src: url('http://static.tumblr.com/pgongfd/vthn1oj2c/rex_bold.ttf');
  23. }
  24.  
  25. @font-face {
  26. font-family: 'Rex Light;
  27. src: url('http://static.tumblr.com/pgongfd/Maln1oj76/rex_light.ttf');
  28. }
  29.  
  30.  
  31. body {
  32.  
  33. font-family: calibri;
  34. font-size: 13px;
  35. color:#d99da2;
  36. text-transform:uppercase;
  37. background: url(http://static.tumblr.com/pgongfd/rHCn1ohrb/tumblr_mqmeypbrzi1r1d24uo4_250.png);
  38.  
  39. }
  40.  
  41. body b {
  42.  
  43. color:#c54650;
  44. background-color:#ffd4d7;
  45.  
  46.  
  47. }
  48.  
  49. body i {
  50.  
  51. color:#c54650;
  52. background-color:#ffd4d7;
  53.  
  54.  
  55. }
  56.  
  57.  
  58.  
  59. body a:hover {
  60.  
  61. color:#c54650;
  62. text-decoration: underline;
  63.  
  64. -webkit-transition:all 0.5s ease-in-out;
  65. -moz-transition: all .5s ease-in-out;
  66. -ms-transition: all .5s ease-in-out;
  67. -o-transition: all .5s ease-in-out;
  68. transition: all .5s ease-in-out;
  69.  
  70.  
  71. }
  72.  
  73. #container {
  74. margin-left:auto;
  75. margin-right:auto;
  76. width: 869px;
  77. background-color: rgba(255, 255, 255, 0.5);
  78. height:auto;
  79.  
  80. }
  81.  
  82. #title {
  83. font-family:'Rex Bold', 'Bitter', serif;
  84. text-align:center;
  85. width: 869px;
  86. color:#d99da2;
  87. height:auto;
  88. font-size:55px;
  89. text-shadow: 2px 1px #c55b46;
  90.  
  91. }
  92.  
  93.  
  94. .cirlclelink {
  95. font-weight:bold;
  96. font-size:22px;
  97. font-family:'calibri';
  98. line-height: 70px;
  99.  
  100. background-color:#fff;
  101. height:70px;
  102. width:70px;
  103. text-align:center;
  104.  
  105. border-radius: 200px 200px 200px 200px;
  106. -moz-border-radius: 200px 200px 200px 200px;
  107. -webkit-border-radius: 200px 200px 200px 200px;
  108. border: 0px solid #000000;
  109.  
  110.  
  111. position:relative;
  112. float:left;
  113. left:40%;
  114. margin-right: 10px;
  115.  
  116.  
  117. }
  118.  
  119. .cirlclelink a {
  120. font-weight:bold;
  121. font-size:22px;
  122. font-family:'calibri';
  123. line-height: 70px;
  124. color:#d99da2;
  125. text-decoration:none;
  126.  
  127.  
  128. }
  129.  
  130. .cirlclelink a:hover {
  131. font-weight:bold;
  132. font-size:22px;
  133. font-family:'calibri';
  134. line-height: 70px;
  135. color:#e8bda8;
  136. text-decoration:none;
  137.  
  138. -webkit-transition:all 0.5s ease-in-out;
  139. -moz-transition: all .5s ease-in-out;
  140. -ms-transition: all .5s ease-in-out;
  141. -o-transition: all .5s ease-in-out;
  142. transition: all .5s ease-in-out;
  143. }
  144.  
  145.  
  146. .rec {
  147. display: table;
  148. background-color: #fff;
  149. width:665px;
  150. height:auto;
  151. margin-left:auto;
  152. margin-right:auto;
  153.  
  154. -webkit-box-shadow: 3px 3px 0px 0px rgba(194,148,148,1);
  155. -moz-box-shadow: 3px 3px 0px 0px rgba(194,148,148,1);
  156. box-shadow: 3px 3px 0px 0px rgba(194,148,148,1);
  157. }
  158.  
  159. .rec a {
  160.  
  161. color:#c54650;
  162. background-color:#ffd4d7;
  163. text-decoration: underline;
  164.  
  165. -webkit-transition:all 0.5s ease-in-out;
  166. -moz-transition: all .5s ease-in-out;
  167. -ms-transition: all .5s ease-in-out;
  168. -o-transition: all .5s ease-in-out;
  169. transition: all .5s ease-in-out;
  170.  
  171. }
  172.  
  173. .rec a:hover {
  174.  
  175. background-color:#f3c09f;
  176.  
  177. -webkit-transition:all 0.5s ease-in-out;
  178. -moz-transition: all .5s ease-in-out;
  179. -ms-transition: all .5s ease-in-out;
  180. -o-transition: all .5s ease-in-out;
  181. transition: all .5s ease-in-out;
  182.  
  183. }
  184.  
  185. .cats {
  186.  
  187. font-weight:bold;
  188. font-style:italic;
  189. color:#c54650;
  190. letter-spacing:2px;
  191.  
  192.  
  193. }
  194.  
  195. .series
  196.  
  197. {
  198.  
  199. font-family: 'Rex Light', 'Roboto', sans-serif;
  200. font-size: 40px;
  201. text-align:right;
  202. margin-top:-40px;
  203. letter-spacing: 6px;
  204. }
  205.  
  206. #music-player-rounded {
  207. top:18;
  208. position:absolute;
  209. margin-left:12;
  210. margin-right:auto;
  211. width:25px;
  212. height:25px;
  213. padding-left:10px;
  214. padding-top:10px;
  215. background-color: #fff;
  216. -moz-border-radius:200px;
  217. -webkit-border-radius:200px;
  218. border-radius:200px;
  219. -webkit-transition: all 0.4s ease;
  220. -moz-transition: all 0.4s ease;
  221. transition: all 0.4s ease;
  222. }
  223.  
  224.  
  225. .music-player {
  226.  
  227. position:absolute;
  228. margin-top:auto;
  229. margin-left:auto;
  230. margin-right:auto;
  231. right:20px;
  232. width:1px;
  233. height:45px;
  234. padding-left:0px;
  235. padding-top:10px;
  236. -moz-border-radius:200px;
  237. -webkit-border-radius:200px;
  238. border-radius:200px;
  239. -webkit-transition: all 0.4s ease;
  240. -moz-transition: all 0.4s ease;
  241. transition: all 0.4s ease;
  242. opacity:0;
  243.  
  244. }
  245.  
  246. .music-player:hover {
  247.  
  248. opacity:1;
  249. overflow:hidden;
  250.  
  251.  
  252. }
  253.  
  254. .music-player-embed {
  255. margin-left:-24px;
  256. margin-top:-30px;
  257. background-color: #fff;
  258. opacity:0;
  259. }
  260.  
  261. .music-player-embed:hover {
  262. opacity:1;
  263. }
  264.  
  265.  
  266. .rec img {
  267.  
  268. opacity:0.8
  269.  
  270. }
  271.  
  272. </style>
  273.  
  274.  
  275. </head>
  276. <body>
  277.  
  278. <div id="container">
  279.  
  280.  
  281. <!-- LINKS AT THE TOP-->
  282.  
  283. <div class="cirlclelink"><a href="/">BACK</a></div>
  284. <div class="cirlclelink"><a href="http://tumblr.com">DASH</a></div>
  285. <div class="cirlclelink"><a href="http://teenaqe-vow.tumblr.com">&#9829;</a></div>
  286. <br><br><br><br><br>
  287.  
  288. <!-- END LINKS -->
  289.  
  290. <div id="title">Anime Recommendations</div>
  291.  
  292. <br><br><br><br>
  293.  
  294.  
  295. <!--START OF EXAMPLE REC -->
  296.  
  297. <div class="rec"><div class="series">Higurashi [ example ]</div>
  298. <img src="http://static.tumblr.com/pgongfd/b82n1p80s/untitled-1.png" alt="231x131 image" style="float:left; border-style:dotted; border-color:#ebd0bf;border-width:1px; margin-right:10px; margin-bottom:5px; margin-left:10px;" ><span class="cats">genre:</span> KAWAII / ROMANCE / SLICE OF LIFE <br>
  299. <span class="cats">rating:</span> 10/10 <br>
  300. <span class="cats">thoughts:</span> Just super kawaii. Nothing bad ever happens in <b>Higurashi no Naku Koro ni.</b> It's basically just cute girls doing cute things. I guess you could consider it a harem as there's one guy, Maebara Keiichi, who is constantly surrounded by these cute chicks. The anime also has a <a href="https://www.youtube.com/watch?v=pPLO4tnvNko">super cute opening</a>.
  301. </div>
  302.  
  303. <br><br><br><br>
  304.  
  305. <!--END OF EXAMPLE REC-->
  306. <!--START OF REC -->
  307.  
  308. <div class="rec"><div class="series">Title Here</div>
  309. <img src="http://static.tumblr.com/pgongfd/eaFn1olim/01.png" alt="231x131 image" style="float:left; border-style:dotted; border-color:#ebd0bf;border-width:1px; margin-right:10px; margin-bottom:5px; margin-left:10px; max-height:131px; max-width:231px;" ><span class="cats">genre:</span> What's the genre of this anime? <br>
  310. <span class="cats">rating:</span> What would you rate this anime? <br>
  311. <span class="cats">thoughts:</span> What did you think about this anime?
  312. </div>
  313.  
  314. <br><br><br><br>
  315.  
  316. <!--END OF REC-->
  317. <!--START OF REC -->
  318.  
  319. <div class="rec"><div class="series">Title Here</div>
  320. <img src="http://static.tumblr.com/pgongfd/eaFn1olim/01.png" alt="231x131 image" style="float:left; border-style:dotted; border-color:#ebd0bf;border-width:1px; margin-right:10px; margin-bottom:5px; margin-left:10px; max-height:131px; max-width:231px;" ><span class="cats">genre:</span> What's the genre of this anime? <br>
  321. <span class="cats">rating:</span> What would you rate this anime? <br>
  322. <span class="cats">thoughts:</span> What did you think about this anime?
  323. </div>
  324.  
  325. <br><br><br><br>
  326. <!--END OF REC-->
  327.  
  328. <!--START OF REC -->
  329.  
  330. <div class="rec"><div class="series">Title Here</div>
  331. <img src="http://static.tumblr.com/pgongfd/eaFn1olim/01.png" alt="231x131 image" style="float:left; border-style:dotted; border-color:#ebd0bf;border-width:1px; margin-right:10px; margin-bottom:5px; margin-left:10px; max-height:131px; max-width:231px;" ><span class="cats">genre:</span> What's the genre of this anime? <br>
  332. <span class="cats">rating:</span> What would you rate this anime? <br>
  333. <span class="cats">thoughts:</span> What did you think about this anime?
  334. </div>
  335.  
  336. <br><br><br><br>
  337. <!--END OF REC-->
  338.  
  339. <!--START OF REC -->
  340.  
  341. <div class="rec"><div class="series">Title Here</div>
  342. <img src="http://static.tumblr.com/pgongfd/eaFn1olim/01.png" alt="231x131 image" style="float:left; border-style:dotted; border-color:#ebd0bf;border-width:1px; margin-right:10px; margin-bottom:5px; margin-left:10px; max-height:131px; max-width:231px;" ><span class="cats">genre:</span> What's the genre of this anime? <br>
  343. <span class="cats">rating:</span> What would you rate this anime? <br>
  344. <span class="cats">thoughts:</span> What did you think about this anime?
  345. </div>
  346.  
  347. <br><br><br><br>
  348. <!--END OF REC-->
  349.  
  350. </div>
  351.  
  352.  
  353. </body>
  354. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!