posted Dec 16, 2018 19:26:26 GMT -6 in snake eyes
[googlefont=Roboto:400,600,700|Raleway:200|Roboto+Condensed:400,700]
[newclass=.selk-snake-eyes .abc-selk-contain h1, .selk-snake-eyes .abc-selk-hash a, .selk-snake-eyes .abc-selk-rules h2]color:#DE1B2E!important;[/newclass]
[newclass=.selk-snake-eyes .abc-selk-link]background-color:#DE1B2E!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=Roboto:400,400i,700|Montserrat:800]
[newclass=.snakeEyesPost] --snakeEyesAccent:#DE1B2E; [/newclass]
[newclass=.se-LIGHTVER] --snakeEyesBG:#ececec; --snakeEyesLightBG:#f3f3f3; --snakeEyesBorder:#ddd; --snakeEyesText:#6a6a6a; --snakeEyesLightText:#aaa; --snakeEyesH2:#3a3a3a; --snakeEyesShadow:#fff; [/newclass]
[newclass=.se-DARKVER] --snakeEyesBG:#333; --snakeEyesLightBG:#444; --snakeEyesBorder:#666; --snakeEyesText:#aaa; --snakeEyesLightText:#888; --snakeEyesH2:#eee; --snakeEyesShadow:#222; [/newclass]
[newclass=.snakeEyesPost] width:500px; background-color:#ececec; background-color:var(--snakeEyesBG); border-radius:10px; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:relative; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader] display:flex; flex-flow:row wrap; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader img] width:100px; height:100px; border-radius:100%; padding:7.5px; background-color:var(--snakeEyesLightBG);border:3px solid #ddd; border:3px solid var(--snakeEyesBorder); border-right:3px solid var(--snakeEyesAccent); border-radius-top-left:0; [/newclass]
[newclass=.snakeEyesHeader div] height:205px; width:205px; border-radius:100%; display:flex; align-items:center; flex-shrink:0; justify-content:center; margin-left:-35px; margin-top:-35px; [/newclass]
[newclass=.snakeEyesHeader div:after] content:''; position:absolute; height:190px; width:190px; border:5px dashed var(--snakeEyesAccent); border-radius:100%; animation:8s linear infinite snakeEyesSpin; animation-play-state:paused; } @keyframes snakeEyesSpin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); }[/newclass]
[newclass=.snakeEyesPost:hover .snakeEyesHeader div:after] animation-play-state:running; [/newclass]
[newclass=.snakeEyesHeader span] height:170px; display:flex; flex-flow:column nowrap; justify-content:flex-end; [/newclass]
[newclass=.snakeEyesHeader h1] width:280px; height:75px; margin:25px; text-align:left; font:800 50px/50px Montserrat; text-transform:uppercase; color:var(--snakeEyesAccent); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); [/newclass]
[newclass=.snakeEyesHeader h2] margin:-20px 0px 0px 0px; width:280px; font:bold 30px 'Signerica Fat'; color:#3a3a3a; color:var(--snakeEyesH2); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); } @font-face { font-family:Signerica Fat; src:url(//dl.dropbox.com/s/o5tlpkcxt7qwgj1/Signerica_Fat.ttf) format('truetype');[/newclass]
[newclass=.snakeEyesBody div] padding:50px; margin:25px; border-radius:10px; text-align:justify; background-color:var(--snakeEyesLightBG); color:#6a6a6a; color:var(--snakeEyesText); font:400 11px/15px roboto; [/newclass]
[newclass=.snakeEyesBody div:nth-child(2)] color:var(--snakeEyesLightText); text-align:justify; padding:10px 25px; margin:25px; display:flex; justify-content:space-between; align-items:center; [/newclass]
[newclass=.snakeEyesBody div a] font:800 11px/15px roboto; color:var(--snakeEyesAccent); padding:0px 0px 0px 25px; margin:0px; [/newclass]
[newclass=.snakeEyesBody b] font:700 11px/15px roboto; color:var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesBody i] color:var(--snakeEyesLightText); border-bottom:1px solid var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesCredit] font:700 7px roboto; margin-left:425px; [/newclass]
[newclass=.snakeEyesCredit a] font:700 7px roboto!important; [/newclass]
[attr="class","selk-snake-eyes"]
[attr="class","abc-selk-contain"]
snake eyes
[attr="class","abc-selk-rules"]
[attr="class","abc-selk-body"]
[attr="class","abc-selk-text"]
nothing like last-minute reworks to something you coded ages ago to get the blood pumping. why do you do this, me @ me.[break][break]
the icon is, of course, 100 by 100 pixels. if you're going to edit the lyrics, try to keep each line around the same length as the demo -- i don't think it'll break, but it might look wonky. [break][break]
also! this template has built-in dark & light modes that you can swap between without getting into the css -- just change se-LIGHTVER to se-DARKVER in the div class at the top or vice versa.
nothing like last-minute reworks to something you coded ages ago to get the blood pumping. why do you do this, me @ me.[break][break]
the icon is, of course, 100 by 100 pixels. if you're going to edit the lyrics, try to keep each line around the same length as the demo -- i don't think it'll break, but it might look wonky. [break][break]
also! this template has built-in dark & light modes that you can swap between without getting into the css -- just change se-LIGHTVER to se-DARKVER in the div class at the top or vice versa.
[attr="class","abc-selk-hash"]
[HASH]lightposting [HASH]darkposting [HASH]icon [HASH]noscroll [HASH]animation [HASH]customfont [HASH]signericafat [HASH]roboto [HASH]montserrat [HASH]abcsofcode
[HASH]lightposting [HASH]darkposting [HASH]icon [HASH]noscroll [HASH]animation [HASH]customfont [HASH]signericafat [HASH]roboto [HASH]montserrat [HASH]abcsofcode
[attr="class","abc-selk-colorpickers"]
[attr="class","abc-selk-color"]
#DE1B2E
#DE1B2E
[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(--VARNAME) to the desired hex code.
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(--VARNAME) to the desired hex code.
[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=Roboto:400,400i,700|Montserrat:800]
[newclass=.snakeEyesPost] --snakeEyesAccent:#DE1B2E; [/newclass]
[div align="center"]
[div][attr="class","se-LIGHTVER"]
[div][attr="class","snakeEyesPost"]
[div][attr="class","snakeEyesHeader"]
[div]
[img style="width:100px; height:100px;" src="https://image.ibb.co/csnNFS/19.png"]
[/div]
[span]
[h1]you kept rolling[/h1]
[h2]snake eyes[/h2]
[/span]
[/div]
[div][attr="class","snakeEyesBody"]
[div]
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. [break][break]
you kept rolling snake eyes, [b]you kept rolling snake eyes[/b], one too many times. one too many times. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. you kept rolling snake eyes. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, [i]one too many times[/i].
[/div]
[div]
write your notes here! they autoexpand.
@admin
[/div][/div][/div][/div][div][attr="class","snakeEyesCredit"][a href="http://pixel-perfect.boards.net/user/15"]SELKIE[/a][/div][/div]
[newclass=.se-LIGHTVER] --snakeEyesBG:#ececec; --snakeEyesLightBG:#f3f3f3; --snakeEyesBorder:#ddd; --snakeEyesText:#6a6a6a; --snakeEyesLightText:#aaa; --snakeEyesH2:#3a3a3a; --snakeEyesShadow:#fff; [/newclass]
[newclass=.se-DARKVER] --snakeEyesBG:#333; --snakeEyesLightBG:#444; --snakeEyesBorder:#666; --snakeEyesText:#aaa; --snakeEyesLightText:#888; --snakeEyesH2:#eee; --snakeEyesShadow:#222; [/newclass]
[newclass=.snakeEyesPost] width:500px; background-color:#ececec; background-color:var(--snakeEyesBG); border-radius:10px; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:relative; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader] display:flex; flex-flow:row wrap; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader img] width:100px; height:100px; border-radius:100%; padding:7.5px; background-color:var(--snakeEyesLightBG);border:3px solid #ddd; border:3px solid var(--snakeEyesBorder); border-right:3px solid var(--snakeEyesAccent); border-radius-top-left:0; [/newclass]
[newclass=.snakeEyesHeader div] height:205px; width:205px; border-radius:100%; display:flex; align-items:center; flex-shrink:0; justify-content:center; margin-left:-35px; margin-top:-35px; [/newclass]
[newclass=.snakeEyesHeader div:after] content:''; position:absolute; height:190px; width:190px; border:5px dashed var(--snakeEyesAccent); border-radius:100%; animation:8s linear infinite snakeEyesSpin; animation-play-state:paused; } @keyframes snakeEyesSpin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); }[/newclass]
[newclass=.snakeEyesPost:hover .snakeEyesHeader div:after] animation-play-state:running; [/newclass]
[newclass=.snakeEyesHeader span] height:170px; display:flex; flex-flow:column nowrap; justify-content:flex-end; [/newclass]
[newclass=.snakeEyesHeader h1] width:280px; height:75px; margin:25px; text-align:left; font:800 50px/50px Montserrat; text-transform:uppercase; color:var(--snakeEyesAccent); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); [/newclass]
[newclass=.snakeEyesHeader h2] margin:-20px 0px 0px 0px; width:280px; font:bold 30px 'Signerica Fat'; color:#3a3a3a; color:var(--snakeEyesH2); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); } @font-face { font-family:Signerica Fat; src:url(//dl.dropbox.com/s/o5tlpkcxt7qwgj1/Signerica_Fat.ttf) format('truetype');[/newclass]
[newclass=.snakeEyesBody div] padding:50px; margin:25px; border-radius:10px; text-align:justify; background-color:var(--snakeEyesLightBG); color:#6a6a6a; color:var(--snakeEyesText); font:400 11px/15px roboto; [/newclass]
[newclass=.snakeEyesBody div:nth-child(2)] color:var(--snakeEyesLightText); text-align:justify; padding:10px 25px; margin:25px; display:flex; justify-content:space-between; align-items:center; [/newclass]
[newclass=.snakeEyesBody div a] font:800 11px/15px roboto; color:var(--snakeEyesAccent); padding:0px 0px 0px 25px; margin:0px; [/newclass]
[newclass=.snakeEyesBody b] font:700 11px/15px roboto; color:var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesBody i] color:var(--snakeEyesLightText); border-bottom:1px solid var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesCredit] font:700 7px roboto; margin-left:425px; [/newclass]
[newclass=.snakeEyesCredit a] font:700 7px roboto!important; [/newclass]
[attr="class","abc-selk-link"]
[attr="class","lnr lnr-link"]
[attr="class","lnr lnr-link"]
[newclass=.selk-snake-eyes .abc-selk-contain h1, .selk-snake-eyes .abc-selk-hash a, .selk-snake-eyes .abc-selk-rules h2]color:#DE1B2E!important;[/newclass]
[newclass=.selk-snake-eyes .abc-selk-link]background-color:#DE1B2E!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=Roboto:400,400i,700|Montserrat:800]
[newclass=.snakeEyesPost] --snakeEyesAccent:#DE1B2E; [/newclass]
[attr="class","se-LIGHTVER"]
[attr="class","snakeEyesPost"]
[attr="class","snakeEyesHeader"]
you kept rolling
snake eyes
[attr="class","snakeEyesBody"]
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. [break][break]
you kept rolling snake eyes, you kept rolling snake eyes, one too many times. one too many times. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. you kept rolling snake eyes. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, one too many times.
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. [break][break]
you kept rolling snake eyes, you kept rolling snake eyes, one too many times. one too many times. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
can't you see? everything is a mess, when you hide all the lies that you thought you could bury. you kept rolling snake eyes. and all you see are the cards that you can play, and you thought you'd get away with these games. and all you see are the cards there in your hand, and you thought that you have everything planned. [break][break]
you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, you kept rolling snake eyes, one too many times.
[attr="class","snakeEyesCredit"]SELKIE
[newclass=.se-LIGHTVER] --snakeEyesBG:#ececec; --snakeEyesLightBG:#f3f3f3; --snakeEyesBorder:#ddd; --snakeEyesText:#6a6a6a; --snakeEyesLightText:#aaa; --snakeEyesH2:#3a3a3a; --snakeEyesShadow:#fff; [/newclass]
[newclass=.se-DARKVER] --snakeEyesBG:#333; --snakeEyesLightBG:#444; --snakeEyesBorder:#666; --snakeEyesText:#aaa; --snakeEyesLightText:#888; --snakeEyesH2:#eee; --snakeEyesShadow:#222; [/newclass]
[newclass=.snakeEyesPost] width:500px; background-color:#ececec; background-color:var(--snakeEyesBG); border-radius:10px; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; position:relative; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader] display:flex; flex-flow:row wrap; overflow:hidden; [/newclass]
[newclass=.snakeEyesHeader img] width:100px; height:100px; border-radius:100%; padding:7.5px; background-color:var(--snakeEyesLightBG);border:3px solid #ddd; border:3px solid var(--snakeEyesBorder); border-right:3px solid var(--snakeEyesAccent); border-radius-top-left:0; [/newclass]
[newclass=.snakeEyesHeader div] height:205px; width:205px; border-radius:100%; display:flex; align-items:center; flex-shrink:0; justify-content:center; margin-left:-35px; margin-top:-35px; [/newclass]
[newclass=.snakeEyesHeader div:after] content:''; position:absolute; height:190px; width:190px; border:5px dashed var(--snakeEyesAccent); border-radius:100%; animation:8s linear infinite snakeEyesSpin; animation-play-state:paused; } @keyframes snakeEyesSpin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); }[/newclass]
[newclass=.snakeEyesPost:hover .snakeEyesHeader div:after] animation-play-state:running; [/newclass]
[newclass=.snakeEyesHeader span] height:170px; display:flex; flex-flow:column nowrap; justify-content:flex-end; [/newclass]
[newclass=.snakeEyesHeader h1] width:280px; height:75px; margin:25px; text-align:left; font:800 50px/50px Montserrat; text-transform:uppercase; color:var(--snakeEyesAccent); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); [/newclass]
[newclass=.snakeEyesHeader h2] margin:-20px 0px 0px 0px; width:280px; font:bold 30px 'Signerica Fat'; color:#3a3a3a; color:var(--snakeEyesH2); text-shadow: -1px -1px 0 var(--snakeEyesShadow), 1px -1px 0 var(--snakeEyesShadow), -1px 1px 0 var(--snakeEyesShadow), 1px 1px 0 var(--snakeEyesShadow); } @font-face { font-family:Signerica Fat; src:url(//dl.dropbox.com/s/o5tlpkcxt7qwgj1/Signerica_Fat.ttf) format('truetype');[/newclass]
[newclass=.snakeEyesBody div] padding:50px; margin:25px; border-radius:10px; text-align:justify; background-color:var(--snakeEyesLightBG); color:#6a6a6a; color:var(--snakeEyesText); font:400 11px/15px roboto; [/newclass]
[newclass=.snakeEyesBody div:nth-child(2)] color:var(--snakeEyesLightText); text-align:justify; padding:10px 25px; margin:25px; display:flex; justify-content:space-between; align-items:center; [/newclass]
[newclass=.snakeEyesBody div a] font:800 11px/15px roboto; color:var(--snakeEyesAccent); padding:0px 0px 0px 25px; margin:0px; [/newclass]
[newclass=.snakeEyesBody b] font:700 11px/15px roboto; color:var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesBody i] color:var(--snakeEyesLightText); border-bottom:1px solid var(--snakeEyesAccent); [/newclass]
[newclass=.snakeEyesCredit] font:700 7px roboto; margin-left:425px; [/newclass]
[newclass=.snakeEyesCredit a] font:700 7px roboto!important; [/newclass]