posted Dec 1, 2018 19:47:24 GMT -6 in galaxy
[googlefont=Roboto:400,600,700|Raleway:200|Roboto+Condensed:400,700]
[newclass=.selk-galaxy .abc-selk-contain h1, .selk-galaxy .abc-selk-hash a, .selk-galaxy .abc-selk-rules h2]color:#5064A7!important;[/newclass]
[newclass=.selk-galaxy .abc-selk-link]background-color:#5064A7!important;[/newclass]
[newclass=.abc-selk-contain, .selk-code] --abc-selk-accent:#CCCCCC; [/newclass]
[newclass=.abc-selk-contain] width:500px; padding:25px; -webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px; background-color:#eee; display:flex; flex-flow:row wrap; justify-content:space-between; position:relative; overflow:hidden; [/newclass]
[newclass=.abc-selk-contain h1] margin:0px; width:100%; display:flex; flex-flow:row wrap; align-items:center; font:200 32px/32px Raleway; color:var(--abc-selk-accent); [/newclass]
[newclass=.abc-selk-contain h1:after] content:''; width:10px; height:1px; background-color:#ccc; flex-grow:2; margin-left:25px; [/newclass]
[newclass=.abc-selk-contain h1:before] content:'A-B-'; color:#ccc; [/newclass]
[newclass=.abc-selk-body] width:350px; border-radius:5px; color:#aaa; font:400 11px roboto; text-align:justify; margin-top:25px; [/newclass]
[newclass=.abc-selk-text] background-color:#fafafa; padding:25px; border-radius:5px; [/newclass]
[newclass=.abc-selk-hash] margin:25px 0px; text-align:left; [/newclass]
[newclass=.abc-selk-hash a] display:inline-block; height:10px; padding:5px 7px; margin:0px 3px 5px 0px; color:var(--abc-selk-accent); background-color:#ddd; border-radius:2px; text-transform:uppercase; font:600 10px/10px roboto; [/newclass]
[newclass=.abc-selk-colorpickers] width:309px; display:flex; flex-flow:row wrap; align-items:flex-start; [/newclass]
[newclass=.abc-selk-color] display:flex; flex-flow:row nowrap; width:309px; [/newclass]
[newclass=.abc-selk-color div] height:10px; display:inline-block; margin-right:5px; background-color:#ccc; [/newclass]
[newclass=.abc-selk-color span] height:10px; width:0px; display:flex; font:600 9px/10px Roboto; color:#ccc; [/newclass]
[newclass=.abc-selk-var] width:340px; font:400 10px/13px roboto; margin-top:25px; padding-right:10px; height:25px; overflow:auto; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar] width:5px; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-thumb] background-color:#999; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-track] background-color:#ddd; border:0px; [/newclass]
[newclass=.abc-selk-rules] margin:25px 0px 0px 0px; text-align:left; width:125px; display:flex; justify-content:flex-start; align-self:stretch; flex-flow:column nowrap; border-right:1px solid #ddd; [/newclass]
[newclass=.abc-selk-rules img] width:100px; height:100px; border-radius:5px; [/newclass]
[newclass=.selk-code] background-color:#eee; width:500px; padding:25px; -webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; margin-top:-25px; position:relative; overflow:hidden; [/newclass]
[newclass=.selk-code div] margin:0px!important; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; [/newclass]
[newclass=.selk-code div span] display:inline-block; font:700 9px roboto; color:#333; text-transform:uppercase; background-color:#ddd; margin:0px 5px 25px 0px; padding:5px 8px; border-radius:3px; [/newclass]
[newclass=.selk-code code] display:block; width:400px!important; height:100px!important;overflow:auto!important; padding:25px!important; text-align:justify; border-radius:5px; font:11px roboto; color:#aaa; background-color:#f7f7f7; border:0px!important; [/newclass]
[newclass=.selk-code .code_tag_toggle]margin-top:25px; border:0px!important; color:#333!important; font:700 9px/9px roboto!important; padding:5px 10px!important; border-radius:3px!important;[/newclass]
[newclass=.abc-selk-link] position:absolute; bottom:0px; right:0px; height:45px; width:45px!important; background-color:var(--abc-selk-accent); display:flex!important; align-items:center!important; justify-content:center!important; border-radius:0px; [/newclass]
[newclass=.abc-selk-link i] font-size:20px; color:#fafafa; [/newclass][break][break]
[nospaces][googlefont=Muli:300,400,800|Material+Icons]
[newclass=.galaxyPhone] --galaxyAccent1:#5064A7; --galaxyAccent2:#AE9BEB; [/newclass]
[newclass=.galaxyPhone] --galaxyPhoneBG:url(https://image.ibb.co/bQASaU/image.png);[/newclass]
[newclass=.galaxyPhone] --galaxycontactIMG:url(https://i.ibb.co/f04hZN0/image.png); [/newclass]
[newclass=.galaxyCase] padding:5px 10px; border-radius:10px; background-color:#212121; width:299px; position:relative; [/newclass]
[newclass=.galaxySpeaker] background-color:rgba(255,255,255,.1); height:7px; width:149px; margin:10px 0px; border-radius:5px; [/newclass]
[newclass=.galaxyCamera] width:7px; height:7px; border-radius:100%; background-color:rgba(255,255,255,.1); position:absolute; left:25px; top:15px; [/newclass]
[newclass=.galaxyPhone] width:299px; height:500px; overflow:hidden; background-color:#efefef; position:relative; [/newclass]
[newclass=.galaxyLockscreen] width:300px; flex-shrink:0; height:500px; position:absolute; z-index:0; opacity:1; background-image:url(http://placehold.it/300x500/333/eee.png); background-image:var(--galaxyPhoneBG); display:flex; align-items:center; justify-content:center; transition:.33s; [/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen] transition:.33s; transition-delay:.33s; [/newclass]
[newclass=.galaxySecond] opacity:0; margin-top:250px; transition:.33s; position:relative; [/newclass]
[newclass=.galaxyPhone:hover .galaxySecond] opacity:1; transition:.33s; margin-top:0px; position:relative; transition-delay:.33s; [/newclass]
[newclass=.galaxyLockscreen h1] margin:0px; position:absolute; z-index:1; font:300 56px Muli; color:#fafafa; text-shadow: 0px 0px 3px #555; [/newclass]
[newclass=.galaxyLockscreen h2] margin:0px; font:300 12px Muli; margin-top:75px; text-shadow: 0px 1px 2px #555; [/newclass]
[newclass=.galaxyLockscreen span] position:absolute; bottom:25px; color:#fafafa; text-shadow: 0px 1px 2px #555; transition:.25s; transition-delay:.33s; cursor:default; font:48px Material Icons; white-space: nowrap; animation:2.5s galaxy-shake linear infinite; } @keyframes galaxy-shake { 0% { transform: rotate(0deg); } 85% { transform: rotate(0deg); } 90% { transform: rotate(5deg); } 95% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); }[/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen span] animation:.25s galaxy-in normal; opacity:0; } @keyframes galaxy-in { 0% { transform:scale(1); opacity:1; } 100% { transform:scale(1.5); opacity:0; }[/newclass]
[newclass=.galaxyRibbon] height:20px; width:279px; position:absolute; z-index:9; background-color:rgba(0,0,0,.2); color:#fafafa; display:flex; align-items:center; justify-content:space-between; padding:2px 10px; font:400 10px muli; [/newclass]
[newclass=.galaxyRibbon div] display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.galaxyRibbon span] margin-right:5px; height:10px; width:10px; line-height:20px; display:flex; align-items:center; justify-content:center; font-size:10px; speak: none; font-style: normal; font-weight: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; font-variant: normal;[/newclass]
[newclass=.galaxyContact] height:59px; margin-top:0px; padding:24px 10px 0px 10px; background:linear-gradient(60deg, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent2); font:800 18px/18px Muli; color:#fff!important; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyContact div] position:absolute; font:300 10px muli; margin-top:15px; [/newclass]
[newclass=.galaxyContact div a] font:300 10px muli!important; color:rgba(255,255,255,.66)!important;text-transform:lowercase; [/newclass]
[newclass=.galaxyContact i] font-size:28px; font-style:normal; margin-right:0px; cursor:pointer; [/newclass]
[newclass=.galaxyMessages] height:371px; width:299px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; position:relative; [/newclass]
[newclass=.galaxyMessages::after] content:'.'; font-size:0; line-height:10px; background-color:#eee; color:#eee; [/newclass]
[newclass=.galaxyMessages h1, h2] margin:0px 10px 10px 10px; max-width:189px; color:#fafafa; padding:10px; font:12px roboto; text-align:justify; width:auto; [/newclass]
[newclass=.galaxyMessages h1 img, h2 img] display:block; border-radius:3px; [/newclass]
[newclass=.galaxyMessages h1] background-color:var(--galaxyAccent1); margin-left: auto; -webkit-border-radius: 3px; -webkit-border-top-right-radius: 0; border-radius: 3px; border-top-right-radius: 0; [/newclass]
[newclass=.galaxyMessages h2] background-color:var(--galaxyAccent2); margin-right:auto; position:relative; left:40px; -webkit-border-radius: 3px; -webkit-border-top-left-radius: 0; border-radius: 3px; border-top-left-radius: 0; [/newclass]
[newclass=.galaxyMessages h2:before] content:''; position:absolute; z-index:0; margin-left:-50px; margin-top:-7px; width:30px; height:30px; border-radius:100%; background-image:var(--galaxycontactIMG); background-size:cover; [/newclass]
[newclass=.galaxyMSGbox] width:289px; height:25px; padding:5px; border-top:1px solid #ddd; background-color:#eaeaea; display:flex; flex-flow:row nowrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyMSGbox h1] margin:0px 5px; width:244px; font:300 12px muli; color:#aaa; padding:5px; border-radius:3px; background-color:#f7f7f7; cursor:text; [/newclass]
[newclass=.galaxyMSGbox h1:before] content:'enter a message'[/newclass]
[newclass=.galaxyMSGbox span] display:inline; width:25px; height:25px; font-size:20px; line-height:25px; color:var(--galaxyAccent2); transition:.1s; [/newclass]
[newclass=.galaxyMSGbox span:before] background-image: linear-gradient(40deg, var(--galaxyAccent1), var(--galaxyAccent2) ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; [/newclass]
[newclass=.galaxyMSGbox span:hover] font-size:22px; transition:.1s; cursor:pointer; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-track] background-color:#fcfcfc;border:0px;[/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-thumb] background-image:linear-gradient(to bottom, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent1);border:0px; [/newclass]
[newclass=.galaxyCredit] font:800 7px roboto; margin-left:250px; [/newclass]
[newclass=.galaxyCredit a] font:800 7px roboto; [/newclass]
[newclass=.ion]display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @font-face { font-family: "Ionicons"; src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot"); src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot") format("embedded-opentype"), url("//dl.dropbox.com/s/jttet8q0r121h5t/ionicons.woff") format("woff"), url("//dl.dropbox.com/s/jl3yj9nwp5lyl3g/ionicons.ttf") format("truetype"), url("//dl.dropbox.com/s/7c60myjcm9320b4/ionicons.svg") format("svg"); font-weight: normal; font-style: normal;[/newclass]
[newclass=.ion-connection-bars:before] font-family: "Ionicons"; content: "\f274"; [/newclass]
[newclass=.ion-wifi:before] font-family: "Ionicons"; content: "\f25c"; [/newclass]
[newclass=.ion-battery-full:before] font-family: "Ionicons"; content: "\f113"; [/newclass]
[newclass=.ion-ios-telephone:before] font-family: "Ionicons"; content: "\f4b9"; [/newclass]
[newclass=.ion-android-camera:before] font-family: "Ionicons"; content: "\f2d3"; [/newclass]
[newclass=.ion-chatbubbles:before] font-family: "Ionicons"; content: "\f11f"; [/newclass]
[attr="class","selk-galaxy"]
[attr="class","abc-selk-contain"]
galaxy
[attr="class","abc-selk-rules"]
[attr="class","abc-selk-body"]
[attr="class","abc-selk-text"]
i adore this song, so i definitely went a little overboard with this, whoops. this is by far the most complex template of the project, featuring animations, variables, self-hosted font icons, and an ungodly amount of newclasses, so some notes on how to use it --[break][break]
1. all of the css you need to edit is at the top of the template, so don't poke around at the newclasses at the bottom unless you know what you're looking for (or are willing to break shit, go for it tbh), [break]
1. the background image is 300px by 500px and is controlled by the --galaxyPhoneBG variable,[break]
2. your sent messages are enclosed in [*h1][*/h1] tags and your recieved messages are in [*h2][*/h2] tags,[break]
3. the image next to your received messages is the recipient's contact icon and is controlled by the --galaxycontactIMG variable. it's 30px by 30px but it resizes your icons automatically,[break]
4. you'll need to replace the displayed time twice, sorry about that![break][break]
once you have everything set up, this shouldn't be too bad to edit! the font icons will display regardless of whether or not they're installed in the site skin, so you won't have to worry about it.
i adore this song, so i definitely went a little overboard with this, whoops. this is by far the most complex template of the project, featuring animations, variables, self-hosted font icons, and an ungodly amount of newclasses, so some notes on how to use it --[break][break]
1. all of the css you need to edit is at the top of the template, so don't poke around at the newclasses at the bottom unless you know what you're looking for (or are willing to break shit, go for it tbh), [break]
1. the background image is 300px by 500px and is controlled by the --galaxyPhoneBG variable,[break]
2. your sent messages are enclosed in [*h1][*/h1] tags and your recieved messages are in [*h2][*/h2] tags,[break]
3. the image next to your received messages is the recipient's contact icon and is controlled by the --galaxycontactIMG variable. it's 30px by 30px but it resizes your icons automatically,[break]
4. you'll need to replace the displayed time twice, sorry about that![break][break]
once you have everything set up, this shouldn't be too bad to edit! the font icons will display regardless of whether or not they're installed in the site skin, so you won't have to worry about it.
[attr="class","abc-selk-hash"]
[HASH]lighttechnology [HASH]phone [HASH]im [HASH]instantmessaging [HASH]hover [HASH]animation [HASH]gradient [HASH]scroll [HASH]materialicons [HASH]ionicons [HASH]muli [HASH]roboto
[HASH]lighttechnology [HASH]phone [HASH]im [HASH]instantmessaging [HASH]hover [HASH]animation [HASH]gradient [HASH]scroll [HASH]materialicons [HASH]ionicons [HASH]muli [HASH]roboto
[attr="class","abc-selk-colorpickers"]
[attr="class","abc-selk-color"]
#5064A7
#5064A7
[attr="class","abc-selk-color"]
#AE9BEB
#AE9BEB
[attr="class","abc-selk-var"]
this template uses css variables for easier editing and is therefore incompatible with internet explorer. if you need this cross-compatibility, use a search and replace to change var(--galaxyAccent1) and var(--galaxyAccent2) to the desired hex codes and var(--galaxyPhoneBG) and var(--galaxycontactIMG) to the desired images.
this template uses css variables for easier editing and is therefore incompatible with internet explorer. if you need this cross-compatibility, use a search and replace to change var(--galaxyAccent1) and var(--galaxyAccent2) to the desired hex codes and var(--galaxyPhoneBG) and var(--galaxycontactIMG) to the desired images.
[attr="class","selk-code"]
edit as much as you want!
don't touch the credits!
i'd love to see how you use it!
edit as much as you want!
don't touch the credits!
i'd love to see how you use it!
[nospaces][googlefont=Muli:300,400,800|Material+Icons][div align="center"]
[newclass=.galaxyPhone] --galaxyAccent1:#5064A7; --galaxyAccent2:#AE9BEB; [/newclass]
[newclass=.galaxyPhone] --galaxyPhoneBG:url(https://image.ibb.co/bQASaU/image.png);[/newclass]
[newclass=.galaxyPhone] --galaxycontactIMG:url(http://placehold.it/30x30/333/eee.png) [/newclass]
[div][attr="class","galaxyCase"][div][attr="class","galaxySpeaker"][/div][div][attr="class","galaxyCamera"][/div]
[div][attr="class","galaxyPhone"]
[div][attr="class","galaxyRibbon"]
12:21
[div][span][attr="class","ion ion-connection-bars"][/span][span][attr="class","ion ion-wifi"][/span][span][attr="class","ion ion-battery-full"][/span]
100%
[/div][/div]
[div][attr="class","galaxyLockscreen"]
[h1]
12:21
[/h1]
[h2]
Monday, September 13
[/h2]
[span]fingerprint[/span][/div]
[div][attr="class","galaxySecond"][div][attr="class","galaxyContact"]
CONTACT NICKNAME
[div]
@selkie
[/div][/div]
[div][attr="class","galaxyMessages"]
[h1]captivated like a sweet dream[/h1]
[h1]i've followed you into the deep universe[/h1]
[h2]and i met a lonely milky way[/h2]
[h2]finally, finally, it spreads out before me[/h2]
[h1]i want to know more about your dazzling light[/h1]
[h2]i'm jumping into your galaxy[/h2]
[h2]to a world you opened only for me[/h2]
[h1]i'm jumping into your galaxy[/h1]
[/div]
[div][attr="class","galaxyMSGbox"][span][attr="class","ion ion-android-camera"][/span][h1][/h1][span][attr="class","ion ion-chatbubbles"][/span][/div][/div][/div]
[div][attr="class","galaxySpeaker"][/div][/div]
[div][attr="class","galaxyCredit"][a href="http://pixel-perfect.boards.net/user/15"]SELKIE[/a][/div][/div]
[newclass=.galaxyCase] padding:5px 10px; border-radius:10px; background-color:#212121; width:299px; position:relative; [/newclass]
[newclass=.galaxySpeaker] background-color:rgba(255,255,255,.1); height:7px; width:149px; margin:10px 0px; border-radius:5px; [/newclass]
[newclass=.galaxyCamera] width:7px; height:7px; border-radius:100%; background-color:rgba(255,255,255,.1); position:absolute; left:25px; top:15px; [/newclass]
[newclass=.galaxyPhone] width:299px; height:500px; overflow:hidden; background-color:#efefef; position:relative; [/newclass]
[newclass=.galaxyLockscreen] width:300px; flex-shrink:0; height:500px; position:absolute; z-index:0; opacity:1; background-image:url(http://placehold.it/300x500/333/eee.png); background-image:var(--galaxyPhoneBG); display:flex; align-items:center; justify-content:center; transition:.33s; [/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen] transition:.33s; transition-delay:.33s; [/newclass]
[newclass=.galaxySecond] opacity:0; margin-top:250px; transition:.33s; position:relative; [/newclass]
[newclass=.galaxyPhone:hover .galaxySecond] opacity:1; transition:.33s; margin-top:0px; position:relative; transition-delay:.33s; [/newclass]
[newclass=.galaxyLockscreen h1] margin:0px; position:absolute; z-index:1; font:300 56px Muli; color:#fafafa; text-shadow: 0px 0px 3px #555; [/newclass]
[newclass=.galaxyLockscreen h2] margin:0px; font:300 12px Muli; margin-top:75px; text-shadow: 0px 1px 2px #555; [/newclass]
[newclass=.galaxyLockscreen span] position:absolute; bottom:25px; color:#fafafa; text-shadow: 0px 1px 2px #555; transition:.25s; transition-delay:.33s; cursor:default; font:48px Material Icons; white-space: nowrap; animation:2.5s galaxy-shake linear infinite; } @keyframes galaxy-shake { 0% { transform: rotate(0deg); } 85% { transform: rotate(0deg); } 90% { transform: rotate(5deg); } 95% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); }[/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen span] animation:.25s galaxy-in normal; opacity:0; } @keyframes galaxy-in { 0% { transform:scale(1); opacity:1; } 100% { transform:scale(1.5); opacity:0; }[/newclass]
[newclass=.galaxyRibbon] height:20px; width:279px; position:absolute; z-index:9; background-color:rgba(0,0,0,.2); color:#fafafa; display:flex; align-items:center; justify-content:space-between; padding:2px 10px; font:400 10px muli; [/newclass]
[newclass=.galaxyRibbon div] display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.galaxyRibbon span] margin-right:5px; height:10px; width:10px; line-height:20px; display:flex; align-items:center; justify-content:center; font-size:10px; speak: none; font-style: normal; font-weight: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; font-variant: normal;[/newclass]
[newclass=.galaxyContact] height:59px; margin-top:0px; padding:24px 10px 0px 10px; background:linear-gradient(60deg, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent2); font:800 18px/18px Muli; color:#fff!important; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyContact div] position:absolute; font:300 10px muli; margin-top:15px; [/newclass]
[newclass=.galaxyContact div a] font:300 10px muli!important; color:rgba(255,255,255,.66)!important;text-transform:lowercase; [/newclass]
[newclass=.galaxyContact i] font-size:28px; font-style:normal; margin-right:0px; cursor:pointer; [/newclass]
[newclass=.galaxyMessages] height:371px; width:299px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; position:relative; [/newclass]
[newclass=.galaxyMessages::after] content:'.'; font-size:0; line-height:10px; background-color:#eee; color:#eee; [/newclass]
[newclass=.galaxyMessages h1, h2] margin:0px 10px 10px 10px; max-width:189px; color:#fafafa; padding:10px; font:12px roboto; text-align:justify; width:auto; [/newclass]
[newclass=.galaxyMessages h1 img, h2 img] display:block; border-radius:3px; [/newclass]
[newclass=.galaxyMessages h1] background-color:var(--galaxyAccent1); margin-left: auto; -webkit-border-radius: 3px; -webkit-border-top-right-radius: 0; border-radius: 3px; border-top-right-radius: 0; [/newclass]
[newclass=.galaxyMessages h2] background-color:var(--galaxyAccent2); margin-right:auto; position:relative; left:40px; -webkit-border-radius: 3px; -webkit-border-top-left-radius: 0; border-radius: 3px; border-top-left-radius: 0; [/newclass]
[newclass=.galaxyMessages h2:before] content:''; position:absolute; z-index:0; margin-left:-50px; margin-top:-7px; width:30px; height:30px; border-radius:100%; background-image:var(--galaxycontactIMG); background-size:cover; [/newclass]
[newclass=.galaxyMSGbox] width:289px; height:25px; padding:5px; border-top:1px solid #ddd; background-color:#eaeaea; display:flex; flex-flow:row nowrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyMSGbox h1] margin:0px 5px; width:244px; font:300 12px muli; color:#aaa; padding:5px; border-radius:3px; background-color:#f7f7f7; cursor:text; [/newclass]
[newclass=.galaxyMSGbox h1:before] content:'enter a message'[/newclass]
[newclass=.galaxyMSGbox span] display:inline; width:25px; height:25px; font-size:20px; line-height:25px; color:var(--galaxyAccent2); transition:.1s; [/newclass]
[newclass=.galaxyMSGbox span:before] background-image: linear-gradient(40deg, var(--galaxyAccent1), var(--galaxyAccent2) ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; [/newclass]
[newclass=.galaxyMSGbox span:hover] font-size:22px; transition:.1s; cursor:pointer; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-track] background-color:#fcfcfc;border:0px;[/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-thumb] background-image:linear-gradient(to bottom, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent1);border:0px; [/newclass]
[newclass=.galaxyCredit] font:800 7px roboto; margin-left:250px; [/newclass]
[newclass=.galaxyCredit a] font:800 7px roboto; [/newclass]
[newclass=.ion]display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @font-face { font-family: "Ionicons"; src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot"); src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot") format("embedded-opentype"), url("//dl.dropbox.com/s/jttet8q0r121h5t/ionicons.woff") format("woff"), url("//dl.dropbox.com/s/jl3yj9nwp5lyl3g/ionicons.ttf") format("truetype"), url("//dl.dropbox.com/s/7c60myjcm9320b4/ionicons.svg") format("svg"); font-weight: normal; font-style: normal;[/newclass]
[newclass=.ion-connection-bars:before] font-family: "Ionicons"; content: "\f274"; [/newclass]
[newclass=.ion-wifi:before] font-family: "Ionicons"; content: "\f25c"; [/newclass]
[newclass=.ion-battery-full:before] font-family: "Ionicons"; content: "\f113"; [/newclass]
[newclass=.ion-ios-telephone:before] font-family: "Ionicons"; content: "\f4b9"; [/newclass]
[newclass=.ion-android-camera:before] font-family: "Ionicons"; content: "\f2d3"; [/newclass]
[newclass=.ion-chatbubbles:before] font-family: "Ionicons"; content: "\f11f"; [/newclass]
[attr="class","abc-selk-link"]
[attr="class","lnr lnr-link"]
[attr="class","lnr lnr-link"]
[newclass=.selk-galaxy .abc-selk-contain h1, .selk-galaxy .abc-selk-hash a, .selk-galaxy .abc-selk-rules h2]color:#5064A7!important;[/newclass]
[newclass=.selk-galaxy .abc-selk-link]background-color:#5064A7!important;[/newclass]
[newclass=.abc-selk-contain, .selk-code] --abc-selk-accent:#CCCCCC; [/newclass]
[newclass=.abc-selk-contain] width:500px; padding:25px; -webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px; background-color:#eee; display:flex; flex-flow:row wrap; justify-content:space-between; position:relative; overflow:hidden; [/newclass]
[newclass=.abc-selk-contain h1] margin:0px; width:100%; display:flex; flex-flow:row wrap; align-items:center; font:200 32px/32px Raleway; color:var(--abc-selk-accent); [/newclass]
[newclass=.abc-selk-contain h1:after] content:''; width:10px; height:1px; background-color:#ccc; flex-grow:2; margin-left:25px; [/newclass]
[newclass=.abc-selk-contain h1:before] content:'A-B-'; color:#ccc; [/newclass]
[newclass=.abc-selk-body] width:350px; border-radius:5px; color:#aaa; font:400 11px roboto; text-align:justify; margin-top:25px; [/newclass]
[newclass=.abc-selk-text] background-color:#fafafa; padding:25px; border-radius:5px; [/newclass]
[newclass=.abc-selk-hash] margin:25px 0px; text-align:left; [/newclass]
[newclass=.abc-selk-hash a] display:inline-block; height:10px; padding:5px 7px; margin:0px 3px 5px 0px; color:var(--abc-selk-accent); background-color:#ddd; border-radius:2px; text-transform:uppercase; font:600 10px/10px roboto; [/newclass]
[newclass=.abc-selk-colorpickers] width:309px; display:flex; flex-flow:row wrap; align-items:flex-start; [/newclass]
[newclass=.abc-selk-color] display:flex; flex-flow:row nowrap; width:309px; [/newclass]
[newclass=.abc-selk-color div] height:10px; display:inline-block; margin-right:5px; background-color:#ccc; [/newclass]
[newclass=.abc-selk-color span] height:10px; width:0px; display:flex; font:600 9px/10px Roboto; color:#ccc; [/newclass]
[newclass=.abc-selk-var] width:340px; font:400 10px/13px roboto; margin-top:25px; padding-right:10px; height:25px; overflow:auto; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar] width:5px; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-thumb] background-color:#999; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-track] background-color:#ddd; border:0px; [/newclass]
[newclass=.abc-selk-rules] margin:25px 0px 0px 0px; text-align:left; width:125px; display:flex; justify-content:flex-start; align-self:stretch; flex-flow:column nowrap; border-right:1px solid #ddd; [/newclass]
[newclass=.abc-selk-rules img] width:100px; height:100px; border-radius:5px; [/newclass]
[newclass=.selk-code] background-color:#eee; width:500px; padding:25px; -webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; margin-top:-25px; position:relative; overflow:hidden; [/newclass]
[newclass=.selk-code div] margin:0px!important; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; [/newclass]
[newclass=.selk-code div span] display:inline-block; font:700 9px roboto; color:#333; text-transform:uppercase; background-color:#ddd; margin:0px 5px 25px 0px; padding:5px 8px; border-radius:3px; [/newclass]
[newclass=.selk-code code] display:block; width:400px!important; height:100px!important;overflow:auto!important; padding:25px!important; text-align:justify; border-radius:5px; font:11px roboto; color:#aaa; background-color:#f7f7f7; border:0px!important; [/newclass]
[newclass=.selk-code .code_tag_toggle]margin-top:25px; border:0px!important; color:#333!important; font:700 9px/9px roboto!important; padding:5px 10px!important; border-radius:3px!important;[/newclass]
[newclass=.abc-selk-link] position:absolute; bottom:0px; right:0px; height:45px; width:45px!important; background-color:var(--abc-selk-accent); display:flex!important; align-items:center!important; justify-content:center!important; border-radius:0px; [/newclass]
[newclass=.abc-selk-link i] font-size:20px; color:#fafafa; [/newclass][break][break]
[nospaces][googlefont=Muli:300,400,800|Material+Icons]
[newclass=.galaxyPhone] --galaxyAccent1:#5064A7; --galaxyAccent2:#AE9BEB; [/newclass]
[newclass=.galaxyPhone] --galaxyPhoneBG:url(https://image.ibb.co/bQASaU/image.png);[/newclass]
[newclass=.galaxyPhone] --galaxycontactIMG:url(https://i.ibb.co/f04hZN0/image.png); [/newclass]
[attr="class","galaxyCase"]
[attr="class","galaxySpeaker"]
[attr="class","galaxyCamera"]
[attr="class","galaxyPhone"]
[attr="class","galaxyRibbon"]
12:21
12:21
[attr="class","ion ion-connection-bars"][attr="class","ion ion-wifi"][attr="class","ion ion-battery-full"]
100%
100%
[attr="class","galaxyLockscreen"]
fingerprint
12:21
Monday, September 13
fingerprint
[attr="class","galaxySecond"]
[attr="class","galaxyContact"]
CONTACT NICKNAME
@selkie
CONTACT NICKNAME
@selkie
[attr="class","galaxyMessages"]
captivated like a sweet dream
i've followed you into the deep universe
and i met a lonely milky way
finally, finally, it spreads out before me
i want to know more about your dazzling light
i'm jumping into your galaxy
to a world you opened only for me
i'm jumping into your galaxy
[attr="class","galaxyMSGbox"][attr="class","ion ion-android-camera"][attr="class","ion ion-chatbubbles"]
[attr="class","galaxySpeaker"]
[attr="class","galaxyCredit"]SELKIE
[newclass=.galaxyCase] padding:5px 10px; border-radius:10px; background-color:#212121; width:299px; position:relative; [/newclass]
[newclass=.galaxySpeaker] background-color:rgba(255,255,255,.1); height:7px; width:149px; margin:10px 0px; border-radius:5px; [/newclass]
[newclass=.galaxyCamera] width:7px; height:7px; border-radius:100%; background-color:rgba(255,255,255,.1); position:absolute; left:25px; top:15px; [/newclass]
[newclass=.galaxyPhone] width:299px; height:500px; overflow:hidden; background-color:#efefef; position:relative; [/newclass]
[newclass=.galaxyLockscreen] width:300px; flex-shrink:0; height:500px; position:absolute; z-index:0; opacity:1; background-image:url(http://placehold.it/300x500/333/eee.png); background-image:var(--galaxyPhoneBG); display:flex; align-items:center; justify-content:center; transition:.33s; [/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen] transition:.33s; transition-delay:.33s; [/newclass]
[newclass=.galaxySecond] opacity:0; margin-top:250px; transition:.33s; position:relative; [/newclass]
[newclass=.galaxyPhone:hover .galaxySecond] opacity:1; transition:.33s; margin-top:0px; position:relative; transition-delay:.33s; [/newclass]
[newclass=.galaxyLockscreen h1] margin:0px; position:absolute; z-index:1; font:300 56px Muli; color:#fafafa; text-shadow: 0px 0px 3px #555; [/newclass]
[newclass=.galaxyLockscreen h2] margin:0px; font:300 12px Muli; margin-top:75px; text-shadow: 0px 1px 2px #555; [/newclass]
[newclass=.galaxyLockscreen span] position:absolute; bottom:25px; color:#fafafa; text-shadow: 0px 1px 2px #555; transition:.25s; transition-delay:.33s; cursor:default; font:48px Material Icons; white-space: nowrap; animation:2.5s galaxy-shake linear infinite; } @keyframes galaxy-shake { 0% { transform: rotate(0deg); } 85% { transform: rotate(0deg); } 90% { transform: rotate(5deg); } 95% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); }[/newclass]
[newclass=.galaxyPhone:hover .galaxyLockscreen span] animation:.25s galaxy-in normal; opacity:0; } @keyframes galaxy-in { 0% { transform:scale(1); opacity:1; } 100% { transform:scale(1.5); opacity:0; }[/newclass]
[newclass=.galaxyRibbon] height:20px; width:279px; position:absolute; z-index:9; background-color:rgba(0,0,0,.2); color:#fafafa; display:flex; align-items:center; justify-content:space-between; padding:2px 10px; font:400 10px muli; [/newclass]
[newclass=.galaxyRibbon div] display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.galaxyRibbon span] margin-right:5px; height:10px; width:10px; line-height:20px; display:flex; align-items:center; justify-content:center; font-size:10px; speak: none; font-style: normal; font-weight: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; font-variant: normal;[/newclass]
[newclass=.galaxyContact] height:59px; margin-top:0px; padding:24px 10px 0px 10px; background:linear-gradient(60deg, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent2); font:800 18px/18px Muli; color:#fff!important; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyContact div] position:absolute; font:300 10px muli; margin-top:15px; [/newclass]
[newclass=.galaxyContact div a] font:300 10px muli!important; color:rgba(255,255,255,.66)!important;text-transform:lowercase; [/newclass]
[newclass=.galaxyContact i] font-size:28px; font-style:normal; margin-right:0px; cursor:pointer; [/newclass]
[newclass=.galaxyMessages] height:371px; width:299px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; position:relative; [/newclass]
[newclass=.galaxyMessages::after] content:'.'; font-size:0; line-height:10px; background-color:#eee; color:#eee; [/newclass]
[newclass=.galaxyMessages h1, h2] margin:0px 10px 10px 10px; max-width:189px; color:#fafafa; padding:10px; font:12px roboto; text-align:justify; width:auto; [/newclass]
[newclass=.galaxyMessages h1 img, h2 img] display:block; border-radius:3px; [/newclass]
[newclass=.galaxyMessages h1] background-color:var(--galaxyAccent1); margin-left: auto; -webkit-border-radius: 3px; -webkit-border-top-right-radius: 0; border-radius: 3px; border-top-right-radius: 0; [/newclass]
[newclass=.galaxyMessages h2] background-color:var(--galaxyAccent2); margin-right:auto; position:relative; left:40px; -webkit-border-radius: 3px; -webkit-border-top-left-radius: 0; border-radius: 3px; border-top-left-radius: 0; [/newclass]
[newclass=.galaxyMessages h2:before] content:''; position:absolute; z-index:0; margin-left:-50px; margin-top:-7px; width:30px; height:30px; border-radius:100%; background-image:var(--galaxycontactIMG); background-size:cover; [/newclass]
[newclass=.galaxyMSGbox] width:289px; height:25px; padding:5px; border-top:1px solid #ddd; background-color:#eaeaea; display:flex; flex-flow:row nowrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.galaxyMSGbox h1] margin:0px 5px; width:244px; font:300 12px muli; color:#aaa; padding:5px; border-radius:3px; background-color:#f7f7f7; cursor:text; [/newclass]
[newclass=.galaxyMSGbox h1:before] content:'enter a message'[/newclass]
[newclass=.galaxyMSGbox span] display:inline; width:25px; height:25px; font-size:20px; line-height:25px; color:var(--galaxyAccent2); transition:.1s; [/newclass]
[newclass=.galaxyMSGbox span:before] background-image: linear-gradient(40deg, var(--galaxyAccent1), var(--galaxyAccent2) ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; [/newclass]
[newclass=.galaxyMSGbox span:hover] font-size:22px; transition:.1s; cursor:pointer; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-track] background-color:#fcfcfc;border:0px;[/newclass]
[newclass=.galaxyMessages::-webkit-scrollbar-thumb] background-image:linear-gradient(to bottom, var(--galaxyAccent1), var(--galaxyAccent2) ); background-color:var(--galaxyAccent1);border:0px; [/newclass]
[newclass=.galaxyCredit] font:800 7px roboto; margin-left:250px; [/newclass]
[newclass=.galaxyCredit a] font:800 7px roboto; [/newclass]
[newclass=.ion]display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @font-face { font-family: "Ionicons"; src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot"); src: url("//dl.dropbox.com/s/mapg7pw2au1g09k/ionicons.eot") format("embedded-opentype"), url("//dl.dropbox.com/s/jttet8q0r121h5t/ionicons.woff") format("woff"), url("//dl.dropbox.com/s/jl3yj9nwp5lyl3g/ionicons.ttf") format("truetype"), url("//dl.dropbox.com/s/7c60myjcm9320b4/ionicons.svg") format("svg"); font-weight: normal; font-style: normal;[/newclass]
[newclass=.ion-connection-bars:before] font-family: "Ionicons"; content: "\f274"; [/newclass]
[newclass=.ion-wifi:before] font-family: "Ionicons"; content: "\f25c"; [/newclass]
[newclass=.ion-battery-full:before] font-family: "Ionicons"; content: "\f113"; [/newclass]
[newclass=.ion-ios-telephone:before] font-family: "Ionicons"; content: "\f4b9"; [/newclass]
[newclass=.ion-android-camera:before] font-family: "Ionicons"; content: "\f2d3"; [/newclass]
[newclass=.ion-chatbubbles:before] font-family: "Ionicons"; content: "\f11f"; [/newclass]