posted Dec 21, 2018 17:04:15 GMT -6 in werewolf gimmick
[googlefont=Roboto:400,600,700|Raleway:200|Roboto+Condensed:400,700]
[newclass=.selk-werewolf-gimmick .abc-selk-contain h1, .selk-werewolf-gimmick .abc-selk-hash a, .selk-werewolf-gimmick .abc-selk-rules h2]color:#A4447C!important;[/newclass]
[newclass=.selk-werewolf-gimmick .abc-selk-link]background-color:#A4447C!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,600,700|Montserrat:600,700]
[newclass=.wwgm_tracker] --wwgm_accent:#A4447C; [/newclass]
[newclass=.wwgm_tracker] width:600px; height:400px; background:url(http://placehold.it/600x400.png); border-radius:5px; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.wwgm_contain] display:flex; flex-flow:row wrap; align-items:center; justify-content:center; opacity:1; transition:.5s ease; position:relative [/newclass]
[newclass=.wwgm_hover] position:absolute; top:0px; width:600px; height:400px; transition:.5s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_hover] animation: wwgm_wipe .5s ease; background-color:rgba(0,0,0,.5); transition:.5s ease; } @keyframes wwgm_wipe { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); }[/newclass]
[newclass=.wwgm_header] width:calc(100% - 20px); height:95px; padding:10px; background-color:#333; display:flex; align-items:center; justify-content:flex-start; position:relative; top:-115px; transition:.33s ease; z-index:1; transition-delay:.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_header] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_header img] width:75px; height:75px; padding:5px; background-color:#fafafa; border:5px solid var(--wwgm_accent); border-radius:100%; [/newclass]
[newclass=.wwgm_header h1] margin:0px 0px 0px 25px; font:700 30px montserrat; text-transform:uppercase; color:#eee; [/newclass]
[newclass=.wwgm_threads] display:flex; width:600px; align-items:flex-start; justify-content:flex-start; [/newclass]
[newclass=.wwgm_thread_box] width:186.5px; height:186.5px; margin-top:10px; margin-left:10px; flex-shrink:0; background-color:#aaa; display:flex; align-items:center; justify-content:space-between; overflow:hidden; position:relative; z-index:1; opacity:0; transition:.33s ease; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(1)] opacity:1; transition:.33s ease; transition-delay:1s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(2)] opacity:1; transition:.33s ease; transition-delay:1.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(3)] opacity:1; transition:.33s ease; transition-delay:1.66s; [/newclass]
[newclass=.wwgm_thread_box h1] margin:0px; height:100%; width:25px; display:flex; align-items:center; justify-content:center; background-color:#333; color:#eee; font:600 8px/25px montserrat; text-transform:uppercase; [/newclass]
[newclass=.wwgm_thread_box h1 span] writing-mode: vertical-rl; [/newclass]
[newclass=.wwgm_thread_list] width:162px; height:187px; overflow:auto; background-color:#eee; [/newclass]
[newclass=.wwgm_thread_list::-webkit-scrollbar] width:0px; [/newclass]
[newclass=.wwgm_thread_hover] height:20px; margin:5px; background-color:#333; border-radius:5px; font:700 7px/20px roboto; overflow:hidden; text-transform:uppercase; color:#aaa; [/newclass]
[newclass=.wwgm_thread_title] margin-top:0px; transition:.33s ease; background-color:#333; [/newclass]
[newclass=.wwgm_thread_hover:hover .wwgm_thread_title] margin-top:-20px; transition:.33s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_thread_title a] color:#fafafa; font:700 7px/20px roboto!important; [/newclass]
[newclass=.wwgm_footer] height:81px; width:calc(100% - 100px); padding:0px 50px; background-color:#333; color:#eee; font:600 10px roboto; text-transform:uppercase; margin-top:10px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1; top:80px; transition:.33s ease; transition-delay:.33s; [/newclass]
[newclass=.wwgm_footer span] font-size:90px; color:var(--wwgm_accent); position:absolute; bottom:-15px; right:0px; text-shadow:-1px -1px 0 #eee, 1px -1px 0 #eee, -1px 1px 0 #eee, 1px 1px 0 #eee; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_footer] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_credit] font:700 7px roboto; margin-left:550px; [/newclass]
[newclass=.wwgm_credit a] font:700 7px roboto!important; [/newclass]
[newclass=.th]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-constellation:before]content:"\e41d"; font-family:"honeybee";[/newclass]
[attr="class","selk-werewolf-gimmick"]
[attr="class","abc-selk-contain"]
werewolf gimmick
[attr="class","abc-selk-rules"]
[attr="class","abc-selk-body"]
[attr="class","abc-selk-text"]
you could consider this template the spiritual successor to neon rainbow, tbh. same basic layout, more bells and whistles. progression is fun! [break][break]
the background image is 600 by 400 pixels and the icon is 75 by 75 pixels. take care when adding more threads to make sure you've got all the opening & closing div tags!
you could consider this template the spiritual successor to neon rainbow, tbh. same basic layout, more bells and whistles. progression is fun! [break][break]
the background image is 600 by 400 pixels and the icon is 75 by 75 pixels. take care when adding more threads to make sure you've got all the opening & closing div tags!
[attr="class","abc-selk-hash"]
[HASH]darkplotting [HASH]mediumplotting [HASH]bigimage [HASH]hover [HASH]animation [HASH]scroll [HASH]honeybeeicons [HASH]roboto [HASH]montserrat [HASH]abcsofcode
[HASH]darkplotting [HASH]mediumplotting [HASH]bigimage [HASH]hover [HASH]animation [HASH]scroll [HASH]honeybeeicons [HASH]roboto [HASH]montserrat [HASH]abcsofcode
[attr="class","abc-selk-colorpickers"]
[attr="class","abc-selk-color"]
#A4447C
#A4447C
[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(--wwgm_accent) 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(--wwgm_accent) 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,600,700|Montserrat:600,700]
[newclass=.wwgm_tracker] --wwgm_accent:#A4447C; [/newclass]
[div align="center"]
[div style="background:url(https://image.ibb.co/dme2oe/image.png);"][attr="class","wwgm_tracker"]
[div][attr="class","wwgm_contain"]
[div][attr="class","wwgm_header"]
[img src="https://image.ibb.co/fAw5rp/67.png"]
[h1]
firstname lastname
[/h1]
[/div]
[div][attr="class","wwgm_threads"]
[div][attr="class","wwgm_thread_box"]
[h1][span]ongoing[/span][/h1]
[div][attr="class","wwgm_thread_list"]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]i was not there for rehearsal[/a]
[div]
WITH @admin
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]i don't need it anymore[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]when i show up just in time to pop[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]you can clear the goddamn floor[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[/div][/div]
[div][attr="class","wwgm_thread_box"]
[h1][span]complete[/span][/h1]
[div][attr="class","wwgm_thread_list"]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]empty out the locker room[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]let me find my space[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[/div][/div]
[div][attr="class","wwgm_thread_box"]
[h1][span]planned[/span][/h1]
[div][attr="class","wwgm_thread_list"]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]let him who thinks he knows no fear[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]look well upon my face[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]nameless bodies[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]in unremembered rooms[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]know how a man becomes a beat[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]when the wolfsbane blooms[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]sail past all the grasping hands[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]floodlights white and hot[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]bring my vision into focus[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[div][attr="class","wwgm_thread_hover"]
[div][attr="class","wwgm_thread_title"]
[a href="/"]find out what i've got[/a]
[div]
WITH @TAGGED
[/div]
[/div][/div]
[/div][/div][/div]
[div][attr="class","wwgm_footer"]
[div]
bring your heroes to the wolves den and watch them all get crushed
[/div]
[span]
[attr="class","th th-constellation"]
[/span]
[/div][/div]
[div][attr="class","wwgm_hover"][/div]
[/div][div][attr="class","wwgm_credit"][a href="http://pixel-perfect.boards.net/user/15"]SELKIE[/a][/div][/div]
[newclass=.wwgm_tracker] width:600px; height:400px; background:url(http://placehold.it/600x400.png); border-radius:5px; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.wwgm_contain] display:flex; flex-flow:row wrap; align-items:center; justify-content:center; opacity:1; transition:.5s ease; position:relative [/newclass]
[newclass=.wwgm_hover] position:absolute; top:0px; width:600px; height:400px; transition:.5s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_hover] animation: wwgm_wipe .5s ease; background-color:rgba(0,0,0,.5); transition:.5s ease; } @keyframes wwgm_wipe { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); }[/newclass]
[newclass=.wwgm_header] width:calc(100% - 20px); height:95px; padding:10px; background-color:#333; display:flex; align-items:center; justify-content:flex-start; position:relative; top:-115px; transition:.33s ease; z-index:1; transition-delay:.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_header] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_header img] width:75px; height:75px; padding:5px; background-color:#fafafa; border:5px solid var(--wwgm_accent); border-radius:100%; [/newclass]
[newclass=.wwgm_header h1] margin:0px 0px 0px 25px; font:700 30px montserrat; text-transform:uppercase; color:#eee; [/newclass]
[newclass=.wwgm_threads] display:flex; width:600px; align-items:flex-start; justify-content:flex-start; [/newclass]
[newclass=.wwgm_thread_box] width:186.5px; height:186.5px; margin-top:10px; margin-left:10px; flex-shrink:0; background-color:#aaa; display:flex; align-items:center; justify-content:space-between; overflow:hidden; position:relative; z-index:1; opacity:0; transition:.33s ease; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(1)] opacity:1; transition:.33s ease; transition-delay:1s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(2)] opacity:1; transition:.33s ease; transition-delay:1.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(3)] opacity:1; transition:.33s ease; transition-delay:1.66s; [/newclass]
[newclass=.wwgm_thread_box h1] margin:0px; height:100%; width:25px; display:flex; align-items:center; justify-content:center; background-color:#333; color:#eee; font:600 8px/25px montserrat; text-transform:uppercase; [/newclass]
[newclass=.wwgm_thread_box h1 span] writing-mode: vertical-rl; [/newclass]
[newclass=.wwgm_thread_list] width:162px; height:187px; overflow:auto; background-color:#eee; [/newclass]
[newclass=.wwgm_thread_list::-webkit-scrollbar] width:0px; [/newclass]
[newclass=.wwgm_thread_hover] height:20px; margin:5px; background-color:#333; border-radius:5px; font:700 7px/20px roboto; overflow:hidden; text-transform:uppercase; color:#aaa; [/newclass]
[newclass=.wwgm_thread_title] margin-top:0px; transition:.33s ease; background-color:#333; [/newclass]
[newclass=.wwgm_thread_hover:hover .wwgm_thread_title] margin-top:-20px; transition:.33s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_thread_title a] color:#fafafa; font:700 7px/20px roboto!important; [/newclass]
[newclass=.wwgm_footer] height:81px; width:calc(100% - 100px); padding:0px 50px; background-color:#333; color:#eee; font:600 10px roboto; text-transform:uppercase; margin-top:10px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1; top:80px; transition:.33s ease; transition-delay:.33s; [/newclass]
[newclass=.wwgm_footer span] font-size:90px; color:var(--wwgm_accent); position:absolute; bottom:-15px; right:0px; text-shadow:-1px -1px 0 #eee, 1px -1px 0 #eee, -1px 1px 0 #eee, 1px 1px 0 #eee; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_footer] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_credit] font:700 7px roboto; margin-left:550px; [/newclass]
[newclass=.wwgm_credit a] font:700 7px roboto!important; [/newclass]
[newclass=.th]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-constellation:before]content:"\e41d"; font-family:"honeybee";[/newclass][attr="class","abc-selk-link"]
[attr="class","lnr lnr-link"]
[attr="class","lnr lnr-link"]
[newclass=.selk-werewolf-gimmick .abc-selk-contain h1, .selk-werewolf-gimmick .abc-selk-hash a, .selk-werewolf-gimmick .abc-selk-rules h2]color:#A4447C!important;[/newclass]
[newclass=.selk-werewolf-gimmick .abc-selk-link]background-color:#A4447C!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,600,700|Montserrat:600,700]
[attr="class","wwgm_tracker"]
[attr="class","wwgm_contain"]
[attr="class","wwgm_header"]
firstname lastname
[attr="class","wwgm_threads"]
[attr="class","wwgm_thread_box"]
ongoing
[attr="class","wwgm_thread_list"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_box"]
complete
[attr="class","wwgm_thread_list"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_box"]
planned
[attr="class","wwgm_thread_list"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_thread_hover"]
[attr="class","wwgm_footer"]
bring your heroes to the wolves den and watch them all get crushed
[attr="class","th th-constellation"]
bring your heroes to the wolves den and watch them all get crushed
[attr="class","th th-constellation"]
[attr="class","wwgm_hover"]
[attr="class","wwgm_credit"]SELKIE
[newclass=.wwgm_tracker] --wwgm_accent:#A4447C; [/newclass]
[newclass=.wwgm_tracker] width:600px; height:400px; background:url(http://placehold.it/600x400.png); border-radius:5px; overflow:hidden; position:relative; display:flex; align-items:center; justify-content:center; [/newclass]
[newclass=.wwgm_contain] display:flex; flex-flow:row wrap; align-items:center; justify-content:center; opacity:1; transition:.5s ease; position:relative [/newclass]
[newclass=.wwgm_hover] position:absolute; top:0px; width:600px; height:400px; transition:.5s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_hover] animation: wwgm_wipe .5s ease; background-color:rgba(0,0,0,.5); transition:.5s ease; } @keyframes wwgm_wipe { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); }[/newclass]
[newclass=.wwgm_header] width:calc(100% - 20px); height:95px; padding:10px; background-color:#333; display:flex; align-items:center; justify-content:flex-start; position:relative; top:-115px; transition:.33s ease; z-index:1; transition-delay:.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_header] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_header img] width:75px; height:75px; padding:5px; background-color:#fafafa; border:5px solid var(--wwgm_accent); border-radius:100%; [/newclass]
[newclass=.wwgm_header h1] margin:0px 0px 0px 25px; font:700 30px montserrat; text-transform:uppercase; color:#eee; [/newclass]
[newclass=.wwgm_threads] display:flex; width:600px; align-items:flex-start; justify-content:flex-start; [/newclass]
[newclass=.wwgm_thread_box] width:186.5px; height:186.5px; margin-top:10px; margin-left:10px; flex-shrink:0; background-color:#aaa; display:flex; align-items:center; justify-content:space-between; overflow:hidden; position:relative; z-index:1; opacity:0; transition:.33s ease; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(1)] opacity:1; transition:.33s ease; transition-delay:1s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(2)] opacity:1; transition:.33s ease; transition-delay:1.33s; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_thread_box:nth-child(3)] opacity:1; transition:.33s ease; transition-delay:1.66s; [/newclass]
[newclass=.wwgm_thread_box h1] margin:0px; height:100%; width:25px; display:flex; align-items:center; justify-content:center; background-color:#333; color:#eee; font:600 8px/25px montserrat; text-transform:uppercase; [/newclass]
[newclass=.wwgm_thread_box h1 span] writing-mode: vertical-rl; [/newclass]
[newclass=.wwgm_thread_list] width:162px; height:187px; overflow:auto; background-color:#eee; [/newclass]
[newclass=.wwgm_thread_list::-webkit-scrollbar] width:0px; [/newclass]
[newclass=.wwgm_thread_hover] height:20px; margin:5px; background-color:#333; border-radius:5px; font:700 7px/20px roboto; overflow:hidden; text-transform:uppercase; color:#aaa; [/newclass]
[newclass=.wwgm_thread_title] margin-top:0px; transition:.33s ease; background-color:#333; [/newclass]
[newclass=.wwgm_thread_hover:hover .wwgm_thread_title] margin-top:-20px; transition:.33s ease; transition-delay:.75s; [/newclass]
[newclass=.wwgm_thread_title a] color:#fafafa; font:700 7px/20px roboto!important; [/newclass]
[newclass=.wwgm_footer] height:81px; width:calc(100% - 100px); padding:0px 50px; background-color:#333; color:#eee; font:600 10px roboto; text-transform:uppercase; margin-top:10px; display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1; top:80px; transition:.33s ease; transition-delay:.33s; [/newclass]
[newclass=.wwgm_footer span] font-size:90px; color:var(--wwgm_accent); position:absolute; bottom:-15px; right:0px; text-shadow:-1px -1px 0 #eee, 1px -1px 0 #eee, -1px 1px 0 #eee, 1px 1px 0 #eee; [/newclass]
[newclass=.wwgm_tracker:hover .wwgm_footer] top:0px; transition:.33s ease; transition-delay:.5s; [/newclass]
[newclass=.wwgm_credit] font:700 7px roboto; margin-left:550px; [/newclass]
[newclass=.wwgm_credit a] font:700 7px roboto!important; [/newclass]
[newclass=.th]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-constellation:before]content:"\e41d"; font-family:"honeybee";[/newclass]