Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style>
- /* CONTAINER SETTINGS */
- figure.blurfilter
- { margin: 0;
- padding: 0;
- display: inline-block;
- position: relative;
- overflow: hidden;
- border: 4px solid #596a91;
- border-radius: 10px 10px 50px 10px;}
- .figcaption img
- { width: 10px; }
- figure.blurfilter img
- { display: block;
- width: 9.75em;
- height: auto;
- transition: all 0.4s 0.4s; }
- /* TEXT BOX */
- figure.blurfilter figcaption
- { position: absolute;
- display: block;
- /* TEXT BOX COSMETICS */
- text-align: left;
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- text-align: center;
- background: white;
- padding: 10px;
- z-index: 100;
- width: 90%;
- height: 90%;
- overflow: auto;
- top: 5%;
- left: 5%;
- font-family: Arial;
- font-size: 16px;
- opacity: 0;
- border-radius: 10px 10px 50px 10px;
- /* TEXT BOX ANIMATION CODE */
- -moz-transition: all 0.4s;
- -webkit-transition: all 0.4s;
- transition: all .4s; }
- figure.blurfilter figcaption h3
- { border-bottom: 1px solid red;
- text-align: left;
- width: 90%;
- margin: 0;
- }
- figure.blurfilter figcaption p
- { text-align: left;
- margin-top: 10px;
- line-height: 1;
- }
- figure.blurfilter figcaption a
- { text-decoration: none;
- }
- figure.blurfilter:hover img
- { -webkit-filter: blur(5px);
- filter: blur(5px);
- -webkit-transform: scale(1.3);
- transform: scale(1.3);
- -moz-transition: all 0.4s;
- -webkit-transition: all 0.4s;
- transition: all 0.4s; } figure.blurfilter:hover figcaption{ opacity: 1;
- -moz-transition: all .4s .4s;
- -webkit-transition: all .4s .4s;
- transition: all .4s .4s; }
- figure.slideup figcaption
- { -webkit-transform: translateY(100%);
- transform: translateY(100%);
- }
- figure.slideup:hover figcaption
- { -webkit-transform: translateY(0);
- transform: translateY(0); }
- .pixel
- { width: 1em !important;
- filter: none !important;
- display: inline-block; }
- figcaption { overflow-y: scroll; }
- .links {
- border-radius: 5px;
- }
- mark2 {
- text-shadow: -1px 0 #3e2137, 0 1px #3e2137, 1px 0 #3e2137, 0 -1px #3e2137, 0 0;
- font-family:'genty';
- color: #adb8bb;
- font-size: 1.5em;
- }
- </style>
- <! –– IMAGE URL AND TEXT ––>
- <figure class="blurfilter slideup"><img class="links" src="https://cdn.discordapp.com/attachments/1011654476983177419/1026732241352675381/325e8d5a0c7542c9aec00b6961e0a752_1.jpg">
- <figcaption>
- <mark2><center>Socials</center></mark2>
- <br>
- <a href="http://twitter.com/finderqirl">twitter</a> <a href="http://twitter.com/virtualcrd">crd acc</a>
- </figcaption></figure>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement