powys

estrellita.crd.co menu

May 25th, 2021 (edited)
8,087
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.54 KB | None
  1. <head>
  2.  
  3. <style>
  4. .container {
  5. position: relative;
  6. width: 100%;
  7. }
  8.  
  9. .image {
  10. opacity: 1;
  11. width: 100%;
  12. height: auto;
  13. opacity: 1;
  14. transition: .5s ease;
  15. backface-visibility: hidden;
  16. border-width:7px;
  17. border-style:solid;
  18. border-image: url("https://media.discordapp.net/attachments/826854899013648384/839700444375810078/tumblr_inline_o98n9dbCl61u2r0ws_540_1_2.png") 8 fill round;
  19. }
  20.  
  21. .overlay {
  22.  
  23. position: absolute;
  24. bottom: 0;
  25. left: 0;
  26. right: 0;
  27. background-color: #FFF;
  28. overflow: hidden;
  29. width: 0;
  30. height: 100%;
  31. transition: .5s ease;
  32.  
  33. }
  34.  
  35. .container:hover .overlay {
  36. width: 35%;
  37. opacity: 0.8;
  38.  
  39. }
  40. .container:hover .image {
  41. opacity: 0.3;
  42. }
  43.  
  44. .link {
  45. text-decoration:none;
  46. text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
  47. font-size:20px;
  48. font-weight: bold;
  49. font-style: italic;
  50. position: absolute;
  51. div align:"left";
  52. top: 50%;
  53. color: #fff;
  54. left: 40%;
  55. -webkit-transform: translate(-50%, -50%);
  56. -ms-transform: translate(-50%, -50%);
  57. transform: translate(-50%, -50%);
  58. white-space: nowrap;
  59.  
  60. </style>
  61. </head>
  62. <body>
  63.  
  64.  
  65.  
  66.  
  67. <div class="container">
  68.  
  69. <!-- change the image below only--!>
  70.  
  71.  
  72. <a href="https://twitter.com/un_nm5sy/status/1342849832336027648/photo/1" target= "_blank"><img src="https://pbs.twimg.com/media/EqLCzecUcAEtsSv?format=jpg&name=large" alt=" " class="image"></a>
  73. <div class="overlay">
  74. <div class="middle">
  75. <div class="link"><a href="#home">index</a>
  76. <p></p>
  77. <a href="#i">about</a>
  78. <p></p>
  79. <a href="#ii">rules</a>
  80. <p></p>
  81. <a href="#iii">love</a>
  82. </div>
  83. </div>
  84. </div>
  85.  
  86. </body>
  87. </html>
RAW Paste Data Copied