Recent Posts

options
skin help written Nov 16, 2021 23:44:40 GMT
pronounsShe/Her
424written posts
luxearned bits
offlinecurrently
lux
Senior Member
lux Avatar
But I'm a sunflower, a little funny
link to board: all was well
problem: we are currently having four issues that, after being paid (despite her terms & conditions saying she would help fix bugs/mistakes, etc) the coder i commissioned deleted me off of discord and refuses to help. we appreciate anyone who is able to help us figure these problems out ๐Ÿ’›
what needs to be fixed:
    [/a]
    [*]the toggle code/copy code box is not working, example
    [*]we are looking for a way to add an image to boards that are not yet posted in on the forum row, as well as placeholder images for guests in that same spot, example
    [*]the freeform coding for the main profile for new accounts is messed up, example here
    [/ul]
    browser: chrome
    other details: it is an existing code, and edits are allowed!
    codes:
    css
     /*=============================================== *
    * Jcink.com Forum Hosting Stylesheet
    * ==============================================
    * #Version: 1.0.2
    *=============================================== */

    html{scroll-behavior: smooth;}
    form{display: inline;}
    ::-webkit-scrollbar{height: 6px;width: 9px;background: var(--cr2);}
    ::-webkit-scrollbar-thumb{background: var(--text);border: 4px solid var(--cr3);}
    ::-webkit-scrollbar-corner{background: var(--cr1);}
    ::-webkit-scrollbar-button{background: var(--cr1);height: 5px !important;}

    /** hidden stuff **/

    #GROUP-2.adminprof {display:none;}
    #GROUP-3.adminprof {display:none;}
    #GROUP-4.adminprof {display:none;}
    #GROUP-5.adminprof {display:none;}
    #GROUP-6.adminprof {display:none;}
    #GROUP-7.adminprof {display:none;}
    #GROUP-8.adminprof {display:none;}
    #GROUP-9.adminprof {display:none;}
    #GROUP-10.adminprof {display:none;}
    #GROUP-11.adminprof {display:none;}
    #GROUP-12.adminprof {display:none;}
    #GROUP-13.adminprof {display:none;}
    #GROUP-14.adminprof {display:none;}
    #GROUP-15.adminprof {display:none;}
    #GROUP-16.adminprof {display:none;}
    #GROUP-17.adminprof {display:none;}
    #GROUP-18.adminprof {display:none;}
    #GROUP-19.adminprof {display:none;}

    #GROUP-4.adminprof {display:block;}
    #GROUP-16.adminprof {display:block;}
    #GROUP-2.crprofmem {display:block;}
    #GROUP-3.crprofmem {display:block;}
    #GROUP-4.crprofmem {display:block;}
    #GROUP-5.crprofmem {display:block;}
    #GROUP-6.crprofmem {display:block;}
    #GROUP-7.crprofmem {display:block;}
    #GROUP-8.crprofmem {display:block;}
    #GROUP-9.crprofmem {display:block;}
    #GROUP-10.crprofmem {display:block;}
    #GROUP-11.crprofmem {display:block;}
    #GROUP-12.crprofmem {display:block;}
    #GROUP-13.crprofmem {display:block;}
    #GROUP-14.crprofmem {display:block;}
    #GROUP-15.crprofmem {display:block;}
    #GROUP-16.crprofmem {display:block;}
    #GROUP-17.crprofmem {display:block;}
    #GROUP-18.crprofmem {display:block;}
    #GROUP-19.crprofmem {display:block:}

    #GROUP-4.crprofmem {display:none;}
    #GROUP-16.crprofmem {display:none;}

    #userlinks {display:none;}
    .forum-subheader .titlemedium {display:none;}
    .topic-subheader .titlemedium {display:none;}

    /** tootips **/

    #s-m-t-tooltip {max-width:300px; position:relative; z-index:9999!important; margin:15px 14px 7px 12px; padding:5px; background-color: rgba(205, 205, 205,.5); color: #333; font-family: Poppins, sans-serif; letter-spacing:1px; text-transform: uppercase; font-weight: 600; font-size:12px; line-height:115%; border-radius: 5px;}


    /********
    permissions
    ********/

    .mcp-0, .acp-0, .m-2 { display: none!important; }
    .g-2 { display: block !important; }
    .m-4 {display: block!important; }

    :root {
      overflow-x:hidden;

     --cr1: #282828;
     --cr2: #373737;
     --cr3: #222222;
     --cr4: #474554;
     --cr5: #ACA9BB;
     --maintext: #eee;
     --text: #eee;
     --white: #eee;
     --fade: 255,255,255;
     --shadow: -1px -1px 0 var(--cr1), 1px -1px 0 var(--cr1), -1px 1px 0 var(--cr1), 1px 1px 0 var(--cr1);
     --shadow2: -1px -1px 0 rgb(var(--fade),.2), 1px -1px 0 rgb(var(--fade),.2), -1px 1px 0 rgb(var(--fade),.2), 1px 1px 0 rgb(var(--fade),.2);
     --opacity: 0.5;
     --invert: 0;
     --overlay: 280deg, rgba(41,41,41,.5) 100%, rgba(0,0,0,0) 100%;
     --overlay2: 280deg, rgba(241,241,241,.2) 100%, rgba(0,0,0,0) 100%;
     --link: #eaeaea;
     --bodbg: linear-gradient(196deg, rgba(88,88,88,1) 0%, rgba(53,53,53,1) 66%);
      --bas: #194A2C;
     --bow: #86B87F;
     --gri: #A17A27;
     --cen: #566A98;
     --har: #4A0535;
     --hip: #D4D0CF;
     --kel: #43858C;
     --the: #11054A;
     --pix: #694978;
     --ali: #7493a6;
     --puf: #C9B902;
     --uni: #C967B6;
     --wyv: #7A1B23;
     --mag: #A3BA9D;
     
     --martin: 'martin';
     --cache: 'cache';
     --poppins: 'Poppins', sans-serif;
     
    --bg1: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/Lux_img_7.jpg');
     --bg2: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/bg4_drk.jpg');
     --bg3: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/cartographer.png');
     --bg4: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/Lux_img_1.png');
     --bg5: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/matteo_vistocco_mcqXQYPqy2o_unsplash.jpg');
    }


    @font-face {
     font-family: 'cache';
     src: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/Cache_Rough.otf');
     font-weight: bold;
     font-style: normal;
    }

    @font-face {
     font-family: 'martin';
     src: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/Martinesse.ttf');
     font-weight: bold;
     font-style: normal;
    }

    html { overflow-x: auto; }
    form { display:inline; }

    /****************************************
    Body Background & Text Style
    *****************************************/

    body {
    background: var(--bg3) repeat center center / auto fixed;
    padding:0px;
    margin:0px;
    font: 500 14px/150% var(--poppins);
      color: var(--text);
    }


    /* set up dark variables */
    body.darkmode {
    --cr1: #C1C1C1;
    --cr2: #eaeaea;
           --cr3: #DBDBDB;
    --text: #222;
    --fade: 0,0,0;
           --opacity: 1;
           --invert: 1;
           --overlay: 280deg, rgba(221, 221, 221,.7) 100%, rgba(255,255,255) 100%;
    --drkbg: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/beanstalk.png');
           --text: #484848;
      --shadow: -1px -1px 0 var(--cr1), 1px -1px 0 var(--cr1), -1px 1px 0 var(--cr1), 1px 1px 0 var(--cr1);
           --fade: 21,21,21;
           --link: #eaeaea;
           --bodbg: linear-gradient(196deg, rgba(214,214,214,1) 8%, rgba(163,163,163,1) 71%);
    --bg2: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/bg4_lite.jpg');
    --bg3: url('https://files.jcink.net/uploads/sellyourseoul/Crimson_Rose/cartographer_lite.jpg');
    }

    body img {object-fit: cover;}

    /****************************************
      Table Styles
    *****************************************/

    table, tr, td {
    font-size: 12px;
    color:  var(--333);
    }

    .impot{padding:20px; background: linear-gradient(230deg, var(--memfade)30%, var(--memfade2)100%), var(--bg4) no-repeat center / cover fixed; font:700 18px/100% var(--martin);color:var(--text);width:95%;border-bottom:1px solid var(--white); text-transform:lowercase;    margin-left: 9px;}
    /****************************************
      Board Width
    *****************************************/

    #wrapper {width: 1200px; background: linear-gradient(360deg, var(--memfade) 5%, var(--cr2) 20%), var(--cr1); margin: 0px auto; padding-top: 20px; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-start; align-content:flex-start; border-bottom: 10px solid var(--cr3); padding-bottom: 0px; border-radius: 10px;}

    #innerwrapper { width: 96.5%;margin:10px 0 0 10px;padding: 10px; border:1px solid rgb(var(--fade),.1);}

    /****************************************
      Link colors & tooltips
    *****************************************/

    a:link, a:visited, a:active {
    text-decoration: none;
    color:  var(--mem2);
    transition-duration:1s;
    }
    a:hover {
    color: var(--text);
    text-decoration: none;
    }

    /* style your tooltips (title="") */
    .ui-tooltip {
    background: var(--cr2);
    color: var(--mem2);
    }


    /****************************************
      Profile styles
    *****************************************/

    #profilename {
    font-size:28px;
    font-weight:bold;
    }

    #photowrap {
    padding:6px;
    }

    #phototitle {
    font-size:24px;
    border-bottom:1px solid  var(--333);
    }

    #photoimg   {
    text-align:center; margin-top:15px;
    }

    /****************************************
      UserCP/My Controls styles
    *****************************************/

    #ucpmenu {
    line-height:150%;
    width:22%;
    border:1px solid  var(--cr1);
    background-color:  var(--cr2);
    }

    #ucpmenu p  {
    padding:2px 5px 6px 9px;
    margin:0px;  
    }

    #ucpcontent {
    background-color:  var(--cr2);
    border:1px solid var(--cr1);
    line-height:150%; width:auto;
    }

    #ucpcontent p  {
    padding:10px;
    margin:0px;
    }

    /****************************************
     Logo Strip
    *****************************************/

    #logostrip {display: none;}

    #logo {
    min-height: 60px;
    text-align: left;
    margin-top: 5px;
    padding: 20px 20px 5px;
    }


    #logo a, #logo a:hover {
    font-size: 36px;
    text-decoration: none;
    font-weight: bold;
    color:  var(--mem);
    }

    /****************************************
     Search Bar
    *****************************************/

    #searchbar {
    display: block;
    float: right;
    position: relative;
    right: 10px;
    top: 8px;
    }

    #searchbar .search-container {
       background-color: var(--cr2);
       box-shadow: 0 1px 3px rgba(0,0,0,0.4) inset;
       border: 1px solid  var(--ccc);
       display: block;
       height: 26px;
       position: relative;
       width: 200px;
    }

    #searchbar .search-input {
    background: none repeat scroll 0 0 transparent;
    border: 0;
    color:  var(--mem2);
    font-size: 12px;
    width: 192px;
    height: 26px;
    padding: 1px 0 0 8px;
    }

    #searchbar .search-input:focus {
       color:  var(--333);
    }

    #searchbar .search-button {
    background: var(--mem2);
    border: 0;
    bottom: 0;
    margin: 0;
    border-radius: 0;
    display: block;
    height: 26px;
    padding: 0;
    position: absolute;
    right: 0;
    text-indent: -3000em;
    top: 0;
    width: 26px;
    cursor: pointer;
    box-shadow: none;
    }

    /****************************************
     Navigation Bar / Submenu
    *****************************************/

    #submenu  {
    font-size: 13px;
    border: solid  var(--555);
           border-width: 1px 0;
    background-color:  var(--mem);
           background-position: center center;
           margin-bottom: 3px;
    }

    #submenu img {
    display: none;
    }

    #submenu a:link, #submenu a:visited, #submenu a:active {
    text-decoration: none;
    color: var(--c1text)!important;
           padding: 7px 7px;
           font-weight: bold;
    }

    #navi br {
    display: none;
    }

    #navstrip  {
    font-weight:bold;
    padding:6px 0px 16px 0px;
    }

    /****************************************
      Calendar styling
    *****************************************/

    .caldate   {
    text-align:right;
    font-weight:bold;
    font-size:11px;
    color: var(--555);
    background-color: var(--cr2);
    padding:4px; margin:0px;
    }

    #calendarname {
    font-size:22px;
    font-weight:bold;
    }

    #padandcenter {
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    padding:14px 0px 14px 0px;
    }


    /**************************************************
    User Links Menu (Messages / View new posts / etc )
    ***************************************************/

    #userlinks {
    border: 1px solid  var(--cr1);
    background-color:  var(--cr2);
    list-style: none;
    width: 960px;
    margin: 0 auto;
    }

    #userlinks td {
    color:  var(--text);
    }

    #userlinks a {
    text-decoration: underline; padding: 1px;
    }

    #userlinks a:hover {
    text-decoration: none;
    }


    /****************************************
      Topic View styles
    *****************************************/

    .activeuserstrip {
    background-color:  var(--ccc); padding:6px
    }

    .normalname {
    font-size: 12px;
    font-weight: bold;
    color:  var(--text);
    }

    .normalname a {
    font-size: 12px;
    }

    .unreg {
    font-size: 11px;
    font-weight: bold;
    color:  var(--text);
    }

    .post1 {
    background-color:  var(--cr2);
    }

    .post2 {
    background-color:  var(--cr2);
    }

    .postdetails {
    font-size: 10px;
    }

    .postcolor   {
    font-size: 12px; line-height: 160%;
    }

    .postlinksbar {
    background-color: var(--ccc);
    padding:10px;
    margin-top:1px;
    font-size:10px;
    }

    .signature   {
    font-size: 10px;
    color: var(--333);
    line-height:150%;  
    }


    /*******************************
    Pagination e.g. [1],2,3 ...
    *******************************/

    .pagination .pagination_current, .pagination a {
        padding: 2px 5px;
    }

    .pagination a:link, .pagination a:visited, .pagination a:active {
        border: 1px solid  var(--cr1);
        border-radius:3px;
        background-color: var(--cr2);
        padding-left:6px;
        padding-right:6px;
        color: var(--text);
        text-decoration:none;
    }

    .pagination a:hover {
    background: var(--cr2);
    text-decoration: none;
    color: var(--text);
    }

    .pagination .pagination_current {
        background: none repeat scroll 0% 0%  var(--cr2);
        border: 1px solid  var(--mem);
        color:  var(--text);
        border-radius:3px;
        padding-left:6px;
        padding-right:6px;
    }

    .pagination_first, .pagination_last, .pagination_page {
        background: none repeat scroll 0% 0%  var(--cr1);
        border: 1px solid var(--cr2);
    }

    .pagination_pagetxt {
       display:none;
    }

    /****************************************
      Global general table/div row styles
    *****************************************/

    .row1,.row3,.row4,.row2 {
    background-color:  var(--cr2);
    padding: 5px;
    }
    .row2 a {color: var(--text);}
    .row4 {background:transparent!important;}
    .row4 a {color: var(--mem);}

    #boardstats .row2 {
    text-align: center;
    }

    .darkrow1 {
    background-color:  var(--cr1);  color: var(--text);
    }

    .darkrow2 {
    background-color: var(--cr1); color: var(--text);
    }

    td.darkrow2 {
    display: none;
    }

    .darkrow3 {
    background-color: var(--ccc);
    color:  var(--333);
    padding: 3px;
    }

    .hlight { background-color:  var(--cr2);  }
    .dlight { background-color:  var(--cr2);  }

    /****************************************
      Top table bars / gradient holders
    *****************************************/

    .maintitle {margin:10px auto; width: 95%; height: 135px; background: var(--cr3); padding: 20px; position:relative; color: var(--text);margin: auto;font: 400 2vw/100% var(--cache); overflow:hidden; text-align:Center;}

    .maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; padding: 20px;height: 135px; width: 95%; background: var(--cr1); color: var(--text);margin: auto;position:relative; font: 400 2vw/100% var(--cache); overflow:hidden; text-align:Center; display:flex; align-items:center; justify-content:center; display:flex; align-items:center; justify-content:center;}
    .topic-desc {display:block; font: 300 14px/100% var(--poppins); margin-top: -20px;}
    .topic-title {position:relative; top: 50px;}
    .maintitle a:hover { text-decoration: none;}


    /****************************************
     Bar directly below the maintitles
    *****************************************/

    .titlemedium {
    font-weight:bold; color: var(--333);
    padding: 2px 6px; margin:0px;
    background-color: var(--ccc);
    }

    .titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active  {
    text-decoration: none;
    color:  var(--333);
    }

    /****************************************
     Table & Div Borders
    *****************************************/

    .tableborder {
    background-color:  var(--ccc);
    border:1px solid  var(--555); padding:0px; margin:0;
    }

    .tablefill {
    background-color:  var(--cr2);
    border:1px solid  var(--cr1);
    padding:6px;
    }

    .tablepad {
    background-color:  transparent;  
    padding:6px;
    }

    .tablebasic {
    width:100%; padding:0; margin:0px; border:0px;
    }

    .plainborder {
    border:1px solid  var(--cr1);
    background-color:  var(--cr2);
    }

    /****************************************
     QUOTE and CODE BBCode boxes
    *****************************************/

    #QUOTE {
    white-space:normal;
    font-size: 11px;
    color:  var(--333);
    background-color:  var(--cr2);
    border: 0px;
    padding:2px;
    border:1px solid  var(--cr1);
    margin-top:2px;
    }


    .code-scroll {
    max-height: 250px;
    overflow: auto;
    padding-right: 5px;
    }

    .code-top {
    margin: 0;
    padding: 0;
    text-align: center;
    color: var(--c1text);
    position: relative;
    padding-right: 50px;
    }
    .code-highlight {
    padding: 0px; margin:0px;
    background-color: var(--c1text);
    text-align: center;
    text-transform: uppercase;
    color: var(--text);
    letter-spacing: 1px;
    cursor: crosshair;
    width: 60px;
    line-height:60px;
    font-size: 20px;
    position: absolute;
    top: 0px;
    right: 0px;
    }
    .code-highlight:hover {background: var(--memfade); color: var(--text);}
    .code-top .code-title {
    font: italic normal 300 20px/100% mano;
    text-transform: lowercase;
    line-height: 60px;
    background: var(--cr1);
    }
    .code-toggle {
    cursor: crosshair;
    }

    .code-scroll.auto-code {
    height: auto;
    max-height: none;
    }

    #CODE-WRAP.nicole-code { border-collapse: collapse; }
    #CODE  {
    white-space:normal;
    font-size: 11px;
    background-color: var(--cr2);
    border: 0px;
    padding:12px;
    margin-top:2px;
    position:relative;
    z-index:2;
    }


    /**********************************************
     Input buttons, e.g. submit, text input, etc
    ***********************************************/

    .button-large {
    background:  var(--cr1);
    border-radius: 3px;
           padding: 5px 12px;
    text-align:center;
    margin:0px 5px 0px 5px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
           color: var(--c1text);
    font-weight: bold;
           min-width: 75px;
           display: inline-block;
    }


    .button-small {
    background:  var(--cr1);
    border-radius:3px;
    color: var(--text);
    font-weight: bold;
    font-size: 11px;
    margin: 3px;
    padding: 4px 7px;
    text-decoration: none;
           min-width: 50px;
           max-width: 80px;
    }

    .post-buttons-top { margin-top: 3px; }

    .button-large.closed {
           padding: 7px 12px;
    text-align:center;
    margin:0px 5px 0px 5px;
           border: 1px solid  var(--cr2);
           color:  var(--text);
    font-weight: bold;
    }

    .forminput, .codebuttons, .textinput, .radiobutton, .checkbox {
    border-radius: 5px;
    background:  var(--cr1); border: 1px solid var(--cr2);
    color:  var(--text);
    font-size: 12px;
    padding: 5px;
    vertical-align: middle;
    }
    #subaccounts_menu .forminput{border:none!important; background:none;}
    .forminput option {color: var(--text); background: var(--cr2);}


    input[type=submit], input[type=button], input[type=reset] {
    background: var(--cr2);
    border-radius:3px;
    color:   var(--text);
    font: 400 12px/100% var(--poppins); text-transform:uppercase;
    margin: 3px;
    padding: 4px 8px;
    text-decoration: none;
    border: none;
    }

    .codebuttons  {
    font-size: 10px;
    }


    /****************************************
     Form table cell styles, left/right/top
    *****************************************/

    .pformstrip {
    background-color:  var(--ccc);
    color: var(--333); font-weight:bold;
    padding: 2px 5px;
    margin-top:1px
    }

    .pformleft  {
    padding:6px;
    margin-top:1px;width:25%;
    }

    .pformleftw {
      padding:6px;
    margin-top:1px;width:40%;
    }

    .pformright {
    padding:6px; margin-top:1px;
    }


    /****************************************
    Tabs on the portal profiles + sections
    *****************************************/

    .opentab {
    color: var(--c1text);
    padding:8px;float: left; width: auto;
    background-color: var(--mem2);
    margin-top:3px;
    margin-right:2px;
    font-size:11px;
    border:  var(--555) 1px solid;
    }

    .closedtab {
    color: var(--c1text);
    padding:7px;float: left;width: auto;
    background-color: var(--mem);
    margin-top:6px;
    margin-right:2px;
    font-size:11px;
    border-top:   var(--555) 1px solid;
    border-right:  var(--555) 1px solid;
    border-left:   var(--555) 1px solid;
    }

    .positiontab {
    height: 34px; margin-left: 2px;
    }

    /****************************************
      Delete all cookies / mark read
    *****************************************/

    #delcookiesrow, #mark-as-read-subto {
    background-color:  var(--cr2);
    border: 1px solid  var(--cr1);
    font-size: 10px;
    padding: 5px;
           width: 300px; text-align:center;
           margin:-3px auto;
           padding-left:1px;
    }

    #mark-as-read-subto {
    float: none;
    padding-top: 3px;
    }


    /*******************************
        Board Statistics Links
    *******************************/

    .toplinks a {
    color:  var(--c1text);
    font-size: 11px;
    text-decoration: none;
    }

    .toplinks {
    margin: 0 11px -37px 0;
    text-align: right;
    color: transparent;
    }

    /*******************************
    Mini Profile Seperators
    *******************************/

    .postbit {
    border-bottom: solid 1px  var(--cr1);
    color: var(--text);
    background:  var(--cr2);
    font-size: 11px;
           padding: 6px 7px;
    }

    /********************************
    Miscellaneous
    ********************************/

    /* image tag styles */
    img        { vertical-align:middle; border:0px }
    img.attach { border:2px outset  var(--555); padding:2px }

    /* Forum Descriptions */
    .desc { font-size:11px; color:  var(--333);  }

    /* Edited by text */
    .edit { font-size: 9px }

    /* Topic Macros */

    .wrapmini { float: left; }

    /* Warning CSS */
    .warngood { color:green }
    .warnbad  { color:red }

    /* Skin selector dropdown */
    #skin_selector {
    margin: 10px 0;
    }


    /* Online users list row */
    .thin {
    padding:6px 0px 6px 0px;
    line-height:140%;
    margin:2px 0px 2px 0px;
    border-top:1px solid  var(--cr1);
    border-bottom:1px solid var(--cr1);
    }

    /* Latest news area */
    .newstext {
    background-color:  var(--cr2);  
    border: 1px solid var(--cr1);
    padding: 6px 6px 2px 6px;
    margin-bottom: 10px;
    }

    /* Highlighted text in search */
    .searchlite {
    color: var(--text);
    font-weight:bold;  
    background-color: var(--cr2);
    }

    /***************************************************
     GENERAL INFORMATION WEBPAGES
     REFERENCE:
     http://cttw.jcink.net/index.php?showtopic=22323
    *****************************************************/
    .guidebookie {width: 95%; height: 700px; background: var(--cr1); margin:auto;position:relative; display:flex;}
    .guidetitle {padding: 20px; height: 94.1%; width: 150px; background: var(--mem);display:flex; justify-content:center; align-items:center;}
    .guidetitle h1 { background:var(--cr1); padding: 10px 40px 15px 40px; width: 250px;font: 400 100px/100% var(--cache); position:relative; top: 175px; border-radius: 10px;}
    .tabinfo-holder {
     margin: auto;
     padding: 1px; top: 0px;
     position: relative;
     display: flex;
     justify-content: space-between;
     height: 700px;
     flex-basis: 100%;
     align-items: stretch;
    }
    .information-tabs {
     display: inline-block;
     flex-basis:24%; margin-left: -190px;
     overflow: auto; width: 400px; overflow-x:hidden;
    }
    .information-tabs li, .information-tabs ul.gtabs {
     list-style:none;
     margin: 0px;
     position: relative;
     left: -20px;
    }
    .information-tabs a {
     padding: 6px;
     display: block;
     text-align: right;
     color:  var(--text);
     font-family: var(--poppins);
     text-transform: uppercase;
     font-size: 14px;
     line-height: 16px;
     text-decoration:none;
    }
    .information-tabs a:hover {
     color:  var(--text);
    }
    .information-tabs a.active {
     color:  var(--text);
    }
    .information-tabs a.active:after {
     display: inline-block;
     margin-left: 10px;
     content: ' ยซ'
    }
    .information-tabs h1  {
     padding: 10px;
     text-align: center;
     color: var(--text);
     text-transform: lowercase;
     font: 300 20px/100% var(--martin);
    }
    .information-tabs  h2 {
     padding: 10px 30px 10px 50px;
     background: var(--cr2);
     color: var(--mem2);
     text-align: left; border-radius: 10px;
     line-height: 20px; position:relative; left: 30px;
     font-size: 15px; margin-left: 0px; text-shadow: var(--shadow);
     font-family:  var(--poppins); font-weight: 900;
    }
    .information-tabcontent {
     display: inline-block;
     background:  var(--cr2);
     border: 10px solid transparent;
     flex-basis: 87%;
     height: 600px;
     text-align: justify;
     padding: 15px;
     font-size: 12px;
     line-height: 14px; margin-top: 20px;
     overflow: auto; margin-left: 40px;
    }
    /****************************************
    Mobile-specific Styles
    *****************************************/

    #mobile {
    background-color:  var(--ccc);
    }

    /***********************************
    Copyright: Removal is against Terms
    ************************************/
    #copyright {
    font-size: 10px; line-height: 12px; width: calc(185% - 0px); padding: 5px;
    margin: 10px auto;display:flex; flex-direction:row;
    align-items:center; background:rgb(var(--fade),.20); justify-content:center;
    }

    /*****************************************
    UCP MENU
    *****************************************/
    .act-UserCP table tbody tr {
     display: flex;
     flex-direction: column;
    }
    .act-UserCP td#ucpmenu,
    .act-UserCP td#ucpcontent {
     border: none;
     background: transparent;
    }
    .act-UserCP td#ucpmenu {
     display: grid;
     grid-template-columns: 1fr 1fr 1fr 1fr;
     width: 100%;
     grid-column-gap: 20px;
    }
    .act-UserCP td#ucpmenu p {
     grid-area: 3 / auto / span 1 / span 1;
     font-size: 0px;
     margin: 10px 0px;
    }
    .act-UserCP td#ucpmenu p a {
     text-transform: lowercase;
     font-size: 15px;
     font-family: var(--poppins);
     font-weight: bold;
     opacity: .8;
    }
    .act-UserCP td#ucpmenu p a:hover {opacity: 1;}
    .act-UserCP td#ucpmenu .pformstrip {
     grid-area: 2 / auto / span 1 / span 1;
     background: transparent;
     border-bottom: 1px solid rgba(var(--fade),.5);
    }
    .act-UserCP td#ucpmenu .maintitle {
     grid-area: 1 / auto / span 1 / span 4;
     font-size: 50px; line-height: 300%;
     font-family: var(--cache);
    }
    .act-UserCP td#ucpmenu p:nth-of-type(2),
    .act-UserCP td#ucpmenu div:nth-of-type(3) {
     grid-area: auto / 4 / span 1 / span 1;
    }
    .act-UserCP td#ucpcontent {
     background: rgba(var(--fade),.1);
     padding: 0px 5px;
     width: 99%;
    }
    #ucpcontent .maintitle {width: 97.5%; margin-left: -5px; font-size: 50px; line-height: 300%;}

    .act-UserCP td#ucpcontent table tr {
     width: 84%!important;
     justify-self: stretch;
     align-self: stretch;
     border: none;
     background: transparent;
     display: grid;
     grid-template-columns: 210px 1fr;
     background: transparent;
     grid-gap: 10px;
    }

    .act-UserCP td#ucpcontent div.pformstrip {display: none;}

    .act-UserCP td#ucpcontent table td.pformleft {
     width: 200px;
     min-height: 20px;
     background: rgba(255,255,255,.3);
     border-radius: 10px;
     color: var(--text);
     font-family: var(--poppins);
     text-transform: lowercase;
     font-weight: bold;
    }
    .act-UserCP td#ucpcontent table td.pformleft label {
     font-family: var(--poppins);
     text-transform: uppercase;
     color: var(--mem);
    }
    .act-UserCP td#ucpcontent table td.pformright {
     flex-grow: 1;
     width: 330px;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     justify-content: flex-end;
     background: transparent;
    }
    .act-UserCP td#ucpcontent table td.pformright input {
     border: none;
     border-bottom: 1px solid var(--cr1);
     background: transparent;
     color: var(--text);
    }
    .act-UserCP td#ucpcontent table tbody {
     display: grid;
     grid-template-columns: repeat(2, calc(50% - 10px) [col-start]);
     grid-gap: 10px;
     align-items: stretch;
     justify-content:stretch;
     align-content: stretch;
     width: 100%;
    }
    .act-UserCP td#ucpcontent table tr td {width: auto; display: block; }
    .act-UserCP td#ucpcontent table td {border: none;}

    .act-UserCP td#ucpcontent table tr td.pformstrip {
     align-items: center;
     justify-content: center;
     grid-area: auto / auto / span 2 / span 2;
     background: transparent;
     display: flex;
    }
    .act-UserCP td#ucpcontent table tr td.pformstrip input {
     padding: 10px;
     font-size: 20px;
     font-family: var(--poppins);
     text-transform: uppercase;
     border-radius: 5px;
     opacity: .8;
     cursor: pointer;
     margin: 10;
    }
    .act-UserCP table tr#field-website,
    .act-UserCP table tr#field-location,
    .act-UserCP table tr#field-interests {display: none!important;}

    .act-UserCP td#ucpcontent table tr td.pformstrip input:hover {opacity: 1;}
    .act-UserCP td#ucpcontent div.tableborder table,
    .act-UserCP td#ucpcontent div.tableborder tbody {
     display: grid;
     grid-template-columns: repeat(6, auto [col-start]);
     grid-area: auto / auto / span 1 / span 6;
    }
    .act-UserCP td#ucpcontent div.tableborder tr {
     flex-grow: 1;
     grid-area: auto / auto / span 1 / span 6;
     align-content: center;
     display: grid;
     grid-template-columns: repeat(6, auto [col-start]);
     align-content: stretch;
     justify-content: stretch;
     align-items: stretch;
    }
    .act-UserCP td#ucpcontent div.tableborder td.darkrow3 {
     grid-area: auto / auto / span 1 / span 6;
    }
    .act-UserCP td#ucpcontent div.tableborder td,
    .act-UserCP td#ucpcontent div.tableborder th {
     display: table-cell;
     width: 100%;
    }
    tr.dlight {
    grid-template-columns: 100px 1fr 250px 50px!important;
    }
    #ucpcontent table {width: 100%;}

    /***********************************************
    hidden
    ***********************************************/
    #userlinks {display:none;}
    #submenu {display:none;}
    .newstext {display:none;}

    /***********************************************
    header
    ***********************************************/

    /** topbar **/
    usermenu {width: 1190px; height: 75px; background: linear-gradient(var(--overlay), var(--cr1)); position:absolute; top:0px; left: 0; padding-left: 10px; display:flex; align-items:center; justify-content:flex-end; border-bottom:3px solid var(--mem);}
    .navbar {padding: 5px; font: 14px/100% var(--poppins); color: var(--text);padding-bottom: 5px; margin-right: 40px;     display: flex; align-items: center;}
    .navbar a {color: var(--cr4); text-decoration:none;transition:all 2s ease; background:linear-gradient(to left, var(--cr1) 50%, var(--memfade) 100%) right; background-size: 220%; padding: 5px; border-radius: 10px;}
    .navbar a:hover {background-position: left; color: var(--text)!important;}



    /** header **/

    .crimheader { display: grid;-webkit-box-align: center;-ms-flex-align: center;align-items: center; padding: 50px 20px; min-height: 600px; width: 1200px; margin: auto; border-top: 3px solid rgb(var(--fade),.1); border-bottom: 3px solid rgb(var(--fade),.1); background: linear-gradient(196deg, var(--memfade) 8%, var(--memfade2) 100%); position: relative; visibility: visible; padding: 40px 0 50px 0; overflow:hidden;}

    /** header 2 **/
    .crimcenter {background: var(--bg5) no-repeat center center / cover; width: 90%; height: 90%; overflow:hidden; display: grid; margin: auto; border:1px solid rgb(var(--fade),.1); outline: 1px solid rgb(var(--fade),.2); outline-offset: 5px;  position:relative; top: 45px;
     grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
     grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
     gap: 0px 0px;
     grid-template-areas:
       "leftside leftside leftside right-side right-side"
       "leftside leftside leftside right-side right-side"
       "leftside leftside leftside right-side right-side"
       "leftside leftside leftside right-side right-side"
       "leftside leftside leftside right-side right-side"
       "leftside leftside leftside staff staff"; }
    .crimcenter::before {content:'';   backdrop-filter: blur(4px) opacity(100%);  position:absolute; z-index:1px; width: 100%; height: 100%;}
    .leftside { grid-area: leftside; background: rgb(var(--fade),.3); position:relative; width: 80%; height: 78%; margin:45px 0px 0px 40px; border: 1px solid rgb(var(--fade),.1);}
    .leftside img {width: 100%; object-fit:cover; filter:invert(var(--invert)); margin-top: -55px;}
    .aniiconh {width: 30%; height: 30%; margin: 70px 0 0 30px;}
    .lefttitleimg {position:relative; height: 90%;  width: 520px;position:absolute; top: 50px; left: 0;display:flex; align-items:center; justify-content:center;}
    .lefttitleimg img {position:absolute; left:0px; top:-52px; width: 100%; filter: opacity(.4) invert(var(--invert));}
    .lefttitleimg a {font: 900 70px/100% var(--martin); text-transform:lowercase; text-decoration:none; color: var(--cr1); text-shadow: var(--shadow2); position:absolute; left: 25px; bottom: 160px;}
    .lefttitleimg a sub {display:block; font: 800 30px/100% var(--cache); color: var(--cr4); text-shadow: var(--shadow);}
    .informationbox {padding: 10px; height: 125px; width: 90%; overflow:hidden; text-align:justify; position:absolute; left: 15px; bottom: -5px; font: 12.5px/170% var(--poppins); color:var(--white);}
    .informationbox b { color: var(--mem); font-weight:900;}
    .crstaff {width: 560px; height: 100px; position:absolute; bottom:0; left:0; display: flex; flex-direction:row; align-items:center; justify-content:flex-end;}
    .crstaff:after {content:''; position:absolute; top: 70px; left:0; width: 100%; height:1px; background: rgb(var(--fade),.3);}
    .crstaff a {width: 40px; height: 40px; object-fit:cover; border-radius: 100%; background: #eee; position:relative; z-index:3; border:7px solid var(--cr1); margin-top: 30px; margin-right: -5px;}
    .crstaff img {width: 30px; height: 30px; object-fit:cover; border-radius: 100%;}
    .right-side { grid-area: right-side; background:linear-gradient(230deg,var(--memfade)30%, var(--memfade2)100%), var(--bg5) no-repeat center / cover; border-left: 1px solid rgb(var(--fade),.1); position:relative; z-index:1; filter:blur(0px); margin-top: 25px; margin-right: 25px; height: 500px;}
    .tab-icons { grid-area: 1 / 4 / 3 / 6; }
    .tab-body { grid-area: 3 / 4 / 5 / 6; border:10px solid rgb(var(--fade),.2); outline:1px solid rgb(var(--fade),.3); position:Relative; width: 85%; height: 85%; margin:20px auto; padding-top: 18px; overflow:hidden;}
    .right-side:hover .tab-body {opacity: 1;transition: .8s ease-in-out;}
    .right-side .tab-body {opacity: 0;transition: .8s ease-in-out;}
    .conlineleft {width: 1px; height:80%; background: rgb(var(--fade),.3); position:absolute; top:-30px; left: -35px; z-index:3;}

    .tabnavi h1 {width:315px; height: 100px; margin-left: -29px; margin-top: -38px; background: var(--cr2); display:flex; flex-direction: row; align-items:center; justify-content:space-between; padding-left: 30px; padding-right: 10px;}
    .tabimg {width: 305px; height: 160px; margin:auto; background: linear-gradient(var(--memfade)10%, var(--memfade2)100%), url('https://images.unsplash.com/photo-1598153346810-860daa814c4b?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8aGFycnklMjBwb3R0ZXJ8ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80') no-repeat center center / cover; display:flex; align-items:center; justify-content:center; border-radius: 10px;}
    .tabimg a {font: 900 40px/100% var(--cache); text-decoration:none; text-shadow:var(--shadow); color: var(--cr5); letter-spacing: 15px; border-bottom: 2px solid var(--cr4); width: 80%;position:relative; z-index:3; text-align:center;}
    .tabbot {width:335px; height: 117px; margin-left: -29px; margin-top: 25px; background: var(--cr2); padding: 10px; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-around;}
    .tabbot a {background: var(--mem2); padding: 5px; height: 10px; border-radius: 10px; font: 300 12px/100% var(--poppins); color: var(--white); text-decoration:none; min-width: 120px; justify-content:space-between; display:flex; align-items:center; margin-left: 4px; overflow:hidden;}
    .tabbot i {background: var(--cr1); padding: 10px; margin-left: -5px;}

    .tabfeatimg {width: 325px; height: 200px; margin:auto; margin-left: -10px;display:flex; align-items:center; justify-content:space-around; }
    .tabfeatimg img {width: 100px; height: 190px; object-fit:cover; outline:1px solid rgb(var(--fade),.5); outline-offset: -10px; transition-duration:1.5s;}
     .tabfeatimg img:hover {transform:scale(1.2);}
    .tabbfeat {width:330px; height: 75px; margin-left: -20px; margin-top: 25px; background: var(--cr2); padding: 10px; font: 300 12px/145% var(--poppins); text-align:justify; overflow:hidden;}
    .tabbfeat b {color: var(--mem2); background: var(--cr1); padding: 1px;}

    .tabannocimg {width: 305px; height: 200px; margin:auto; display:flex; align-items:center; justify-content:space-around; }
    .tabannocimg img {width: 150px; height: 180px; object-fit:cover; outline:1px solid rgb(var(--fade),.5); outline-offset: -10px; transition-duration:1.5s;}
     .tabannocimg img:hover {transform:scale(1.2);}

    /** header tabs **/

    ul.tabs {margin: 0;padding: 0;list-style: none;height: 300px;width: 70px; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; position:absolute; left: -69px; top: 30px;}
    ul.tabs i {font-size: 15px; font-weight: 100; color: var(--text); z-index:4; position:absolute;}
    ul.tabs li {background: var(--cr1); padding: 10px; border-radius: 100%; border: 5px solid rgb(var(--fade),.4); width: 20px; height: 20px; position:relative; display:flex; align-items:Center; justify-content:center; top: 10px; z-index:3;}
    ul.tabs li.active{position:Relative; z-index:4; background: var(--cr3);}
    .tab_container {opacity: 1;transition: .8s ease-in-out;}
    .tab_container{clear: both;background: pink; width: 95%; height: 97%; background: var(--cr1); color: var(--text); margin: auto;}
    .tab_content{padding: 20px; padding-bottom: 75px;font-size: 1.2em;display: none;}
    /** header tabs **/

    ul.tabs {margin: 0;padding: 0;list-style: none;height: 300px;width: 70px; display:flex; flex-direction:column; justify-content:f;ex-start; align-items:center; position:absolute; left: -69px; top: 30px;}
    ul.tabs i {font-size: 15px; font-weight: 100; color: var(--text); z-index:4; position:absolute;}
    ul.tabs li {background: var(--cr1); padding: 10px; border-radius: 100%; border: 5px solid rgb(var(--fade),.4); width: 20px; height: 20px; position:relative; display:flex; align-items:Center; justify-content:center; top: 10px; z-index:3;}
    ul.tabs li.active{position:Relative; z-index:4; background: var(--cr3);}
    .tab_container {opacity: 1;transition: .8s ease-in-out;}
    .tab_container{clear: both;background: pink; width: 100%; height: 97%; background: var(--cr1); color: var(--text); margin: auto;}
    .tab_content{padding: 20px; padding-bottom: 75px;font-size: 1.2em;display: none;}

    .staff { grid-area: staff; background: var(--cr2); display:flex; flex-direction:row; padding:10px; align-items:center; justify-content:space-around; position:relative;border-left: 1px solid rgb(var(--fade),.1);}
    .staff::after {content:'Site Staff'; position:absolute; left:0; top:0; -webkit-text-fill-color: transparent;-webkit-text-stroke-width: 1px;letter-spacing: 6px;-webkit-text-stroke-color: rgba(var(--fade),.1); font: 500 70px/120% var(--cache); margin-left: 20px; letter-spacing: 20px; width: 100%;}
    .staff a {width: 60px; height: 60px; object-fit:cover; border-radius: 100%; background: #eee; position:relative; z-index:3; border:7px solid var(--cr1); position:}
    .staff img {width: 50px; height: 50px; object-fit:cover; border-radius: 100%;}

    /**category title **/

    #catinner {margin:10px auto; width: 95%; height: auto; background: var(--cr3); padding: 10px; position:relative;}
    #catinner::after{content:''; width: 100%; height: 100%; border:1px solid rgb(var(--fade),.1); position:absolute; left: 10px; top: -10px;}
    .cattitle{padding: 20px;height: 135px; width: 95%; background: var(--cr1);color: var(--text);margin: auto;position:relative; font: 400 2vw/100% var(--cache); overflow:hidden; text-align:Center; display:flex; align-items:center; justify-content:center;}
    .cattitle a{font: 400 2vw/100% var(--cache);color: var(--text);text-decoration: none;border-bottom: none;transition: 0.3s;text-transform:lowercase;letter-spacing: 10px;text-shadow:none;position:absolute;z-index:2;width: 100%;left:30px;}
    .catfor {padding:10px;
    background: linear-gradient(var(--memfade)30%, var(--memfade)100%), var(--bg1) no-repeat center center / cover; background-attachment: fixed; width: 96.4%; margin:auto;  display:flex; flex-direction: row; flex-wrap:wrap;}

    /** templates **/
    /** admin temp **/
    .admintemp {width: 500px; min-height: 300px; background:linear-gradient(10deg, var(--mem), var(--mem2)); margin: 20px auto; position:Relative; border-radius: 5px; border-top: 10px solid var(--mem2); border-bottom: 10px solid var(--mem2);}
    .admintemp::after {content:''; width: 95%; height: calc(100% - 35px); border:1px solid rgb(255,255,255,.1); position:absolute; left: 10px; top: 15px; border-radius: 5px;}
    .adtptop {padding: 10px; height: 100px; background: var(--cr1); margin-top: -1px;}
    .adtptop h2 {text-align:center; font: 500 40px/100% 'poppins',sans-serif; color: var(--text);}
    .adtptop sub {display:block; font: 100 12px/100% 'poppins',sans-serif; text-transform:uppercase;}
    .adtpbottom {padding: 10px; height: 30px; background: var(--cr1);}
    .adtpbody {margin: 20px auto; background: var(--cr2); min-height: 200px; width: 400px; border-radius: 10px; padding:30px; text-align:justify; position:relative; z-index:2;}
    .adtpbody h1 {font: 300 25px/100% var(--martin); text-transform:capitalize; text-align:center; border-bottom:1px dotted var(--mem2);  border-top:1px dotted var(--mem2); background: var(--cr1); height: 20px; padding: 30px 20px 30px 20px; margin-top: 10px; border-radius: 5px;}
    .adtpbody h2 {font: 300 50px/20px var(--cache); text-transform:capitalize; background: var(--memgrad); border-radius: 3px; text-align:right;}
    .adtpbody h3 {font: 600 30px/100% var(--poppins); text-transform:capitalize;}
    .adtpbody p {margin:auto; text-align:justify;width: 300px; line-height: 25px; padding-bottom: 30px; padding: 0 5px 0 5px; margin-top: 5px; padding-top: 10px;}
    .adtpbody p img {float:left; width: 100px; height: 150px; -webkit-box-shadow: 0px 0px 6px 0px var(--cr1); box-shadow: 0px 0px 6px 0px var(--cr1); margin: 0px 15px 5px 0px; }
    .adtpbody a {text-transform:uppercase; color: var(--cr5); text-decoration:none; position:relative; z-index:2;}
    .adtpbody b {color:var(--mem); background: var(--text); text-transform:uppercase; padding:3px; border-radius:2px; font:900 14px/10% var(--poppins); height: 2px; width: auto;}
    .adtpbody i {font:900 14px/10% var(--poppins); color: var(--mem2);}
    .adtpbody img {width: 395px; max-height: 250px; object-fit:cover; border-radius: 5px;  margin: auto; -webkit-box-shadow: 0px 0px 6px 0px var(--cr1); box-shadow: 0px 0px 6px 0px var(--cr1);}
    .adtpbody blockquote { border-left: 10px solid var(--mem2); padding: 10px; position:relative; z-index:2;}

    basilisk{color: var(--bas); background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    bowtruckle {color: var(--bow); background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    griffin {color: var(--gri);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    centaur {color: var(--cen);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    harpy {color: var(--har);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    hippogriff {color: var(--hip);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    kelpie {color: var(--kel);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    thestral {color: var(--the);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    pixie {color: var(--pix);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    alias {color: var(--ali);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    puffskein {color: var(--puf);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    unicorn {color: var(--uni);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    wyvern {color: var(--wyv);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    magicalmuckracker {color: var(--mag);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    admin {color: var(--mag);background: rgb(var(--fade),.1); padding:1px 3px 1px 3px; border-radius: 3px; margin-top:5px;}
    /** face claims **/

    .crfctable {width: 400px; height: 470px; background:rgb(var(--fade),.1); border-radius:5px; display:flex; flex-direction:column; justify-content:space-around; align-items:center;padding-bottom: 10px; margin-top: 10px;}
    .crfctable ltr { text-align:right; background:pink; align-self: flex-end; margin-right: 20px; font: 300 30px/100% var(--cache); text-transform:capitalize; background: var(--memgrad); border-radius: 3px;  }
    .crfcbox {width: 370px; height: 170px; background: var(--cr1); box-shadow: 0 0 0 3px transparent; border: 5px solid transparent; border-radius: 4px; overflow:auto; position:relative; z-index:2;}
    .crfccredit {background: var(--cr2); padding: 10px; text-align:center; height: 30px; max-width: 310px; font: 600 12px/100% var(--poppins); display:flex; align-items:center; justify-content:space-around; margin-top:5px; margin-left: 5px; border-radius: 5px;}
     .crfccredit a{text-decoration:none;}

      .crfccredit.basilisk {border: 3px solid var(--bas); color: var(--text); text-decoration:none;}
      .crfccredit.bowtruckle {border: 3px solid var(--bow); color: var(--text); text-decoration:none;}
      .crfccredit.griffin {border: 3px solid var(--gri); color: var(--text); text-decoration:none;}
      .crfccredit.centaur {border: 3px solid var(--cen); color: var(--text); text-decoration:none;}
      .crfccredit.harpy {border: 3px solid var(--har); color: var(--text); text-decoration:none;}
      .crfccredit.hippogriff {border: 3px solid var(--hip); color: var(--text); text-decoration:none;}
      .crfccredit.kelpie {border: 3px solid var(--kel); color: var(--text); text-decoration:none;}
      .crfccredit.thestral {border: 3px solid var(--the); color: var(--text); text-decoration:none;}
      .crfccredit.pixie {border: 3px solid var(--pix); color: var(--text); text-decoration:none;}
      .crfccredit.puffskein {border: 3px solid var(--puf); color: var(--text); text-decoration:none;}
      .crfccredit.unicorn {border: 3px solid var(--uni); color: var(--text); text-decoration:none;}
      .crfccredit.wyvern {border: 3px solid var(--wyv); color: var(--text); text-decoration:none;}
      .crfccredit.magicalmuckracker {border: 3px solid var(--mag); color: var(--text); text-decoration:none;}
      .crfccredit.alias {border: 3px solid var(--ali); color: var(--text); text-decoration:none;}

     
     /** canon list **/
     #canonlist {background: var(--cr1); padding-bottom: 60px; border-radius: 5px; position:Relative; z-index:2;}
     #canonlist h1 {background:none; font: 400 50px/100% var(--cache);padding: 10px; background: var(--cr1); border-radius: 0%; border:none; border-radius: 5px 5px 0 0;}
     #canonlist h4 {font: 100 20px/100% var(--poppins); text-transform:uppercase;}
     #canonlist block {display:block;}
     #canonlist line {width: 100%; height:1px; display:block;border-bottom:1px dotted var(--mem2);margin-bottom: 10px; margin-top: 10px;}
     .clibox {padding: 10px; width: 250px; margin: -40px auto;}
        #canonlist.basilisk {background: var(--bas); color: var(--text); text-decoration:none;}
        #canonlist.bowtruckle {background: var(--bow); color: var(--text); text-decoration:none;}
        #canonlist.griffin {background: var(--gri); color: var(--text); text-decoration:none;}
        #canonlist.centaur {background: var(--cen); color: var(--text); text-decoration:none;}
        #canonlist.harpy {background: var(--har); color: var(--text); text-decoration:none;}
        #canonlist.hippogriff {background: var(--hip); color: var(--text); text-decoration:none;}
        #canonlist.kelpie {background: var(--kel); color: var(--text); text-decoration:none;}
        #canonlist.thestral {background: var(--the); color: var(--text); text-decoration:none;}
        #canonlist.pixie {background: var(--pix); color: var(--text); text-decoration:none;}
        #canonlist.puffskein {background: var(--puf); color: var(--text); text-decoration:none;}
        #canonlist.unicorn {background: var(--uni); color: var(--text); text-decoration:none;}
        #canonlist.wyvern {background: var(--wyv); color: var(--text); text-decoration:none;}
        #canonlist.magicalmuckracker {background: var(--mag); color: var(--text); text-decoration:none;}
        #canonlist.alias {background: var(--ali); color: var(--text); text-decoration:none;}

    /** mem dir temp **/
    .memdir {width: 500px; height: 600px; background:linear-gradient(10deg, var(--memfade), var(--memfade2)), var(--bg2); margin: 20px auto; position:Relative; border-radius: 5px; border-top: 10px solid var(--mem2); border-bottom: 10px solid var(--mem2); overflow:hidden;}
    .memdir::after {content:''; width: 95%; height: 98%; border:1px solid rgb(255,255,255,.1); position:absolute; left: 10px; top: 15px; border-radius: 5px;}
    .memdirtop {padding: 10px; height: 100px; background: var(--cr1); margin-top: -1px;}
    .memdirtop h2 {text-align:left; font: 500 40px/100% 'poppins',sans-serif; color: var(--text); text-indent:10px;}
    .memdirtop sub {display:block; font: 100 12px/100% 'poppins',sans-serif; text-transform:uppercase;}
    .memdirimg {width: 200px; height: 400px; border-radius: 20px; background: var(--cr1); padding: 10px; position:absolute; bottom: -20px; right:-20px; z-index:2;}
    .memdirimg:before{content:"";position:absolute;bottom:70px;left:-40px;height:40px;width:40px;border-bottom-left-radius:50%;background:transparent;box-shadow:0 20px 0 0 var(--cr1);transform:rotate(0deg) scaleX(-1);}
    .memdirimg:after{content:"";position:absolute;top:-40px;left:160px;height:40px;width:40px;z-index:-1;border-bottom-left-radius:50%;background:transparent;box-shadow:0 20px 0 0 var(--cr1);transform:rotate(0deg) scaleX(-1);}
    .memdirimg img{width: 200px; height: 400px; border-radius: 20px; object-fit:cover;}
    .memdirbot {padding: 10px; height: 30px; width: 100%;background: var(--cr1); position:absolute; bottom:0; lefT:0; z-index:1;}
    .memcharinfo {width: 90%; margin:auto; padding:5px; position:absolute; top: 130px; left: 18px; font: 200 14px/100% var(--poppins); color: var(--text); text-align:center;}
    .memcharlist {padding: 10px; background: rgb(var(--fade),.3); height: 305px; width: 250px; margin-top: 85px; margin-left: 20px; border-radius: 0px 0px 20px; overflow:auto; z-index:1; position:relative;     box-shadow: 0 0 0 3px transparent;border: 5px solid transparent;}
    .memcharlist::-webkit-scrollbar {width: 2px;}
    .memcharlist::-webkit-scrollbar-track {background: transparent;}
    .memcharlist::-webkit-scrollbar-thumb {background: var(--text);}

    .charbox {display:block; margin: 10px auto; text-align:center; border-bottom:1px solid var(--white); font: 300 35px/100% var(--cache);}
    .charbox a {color: var(--cr1); text-decoration:none;}
    .charbox sub {display:block;font: 700 14px/100% var(--poppins);}
    .charbox a sub {color: var(--cr2)!important;}


    #basilisk {color: var(--bas);}
    #bowtruckle {color: var(--bow);}
    #griffin {color: var(--gri);}
    #centaur {color: var(--cen);}
    #harpy {color: var(--har);}
    #hippogriff {color: var(--hip);}
    #kelpie {color: var(--kel);}
    #thestral {color: var(--the);}
    #pixie {color: var(--pix);}
    #alias {color: var(--ali);}
    #puffskein {color: var(--puf);}
    #unicorn {color: var(--uni);}
    #wyvern {color: var(--wyv);}
    #magicalmuckracker {color: var(--mag);}
    options
    goldmine || brother's best friend romance written Aug 11, 2021 0:25:52 GMT
    pronounsShe/Her
    424written posts
    luxearned bits
    offlinecurrently
    lux
    Senior Member
    lux Avatar
    But I'm a sunflower, a little funny
    [nospaces]
    [attr="class","worthlessPride"]

    [googlefont=Monsterrat:400,600,800]

    [attr="class","worthlessPrideHeader"]



    • #

      male



    • #

      seventh year



    • #

      17/18



    • #

      matthew daddario









    [attr="class","worthlessPrideName"]



    wesley[break]dixon









    [attr="class","alignT worthlessImage"]





    [attr="class","worthlessPrideBody"]





    about for the sake of the ad, i have named this wanted character wesley dixon -- his name, however, is completely open![break][break]

    requirements:[break]
    [*]he will need to be 17 or 18[break]
    [*]he must be a seventh year[break]
    [*]best friends with sage dawson[break]
    [*]face claim is matthew daddario[break]

    as for other expectations/requests of this guy, i would like him to be able to play guitar and sing. he is respectful, has a tender heart, but on the outside, he seems intimidating, aloof and mysterious. he is tall and well-built, perhaps he works out or plays quidditch with sage.[break][break]

    other than these qualities listed above, his home life, the rest of his personality, hogwarts house, etc is up to you![break][break]

    if you have any questions after reading everything down below, feel free to add me on discord at LIA#1567![break][break]



    briar briar is the youngest dawson child. sister to sage and heath, she has always felt out of place on the ranch. ever since heath passed away, even more so, as sage treats her notoriously awful while they attend hogwarts. she is a sixth year hufflepuff, shy as can be, and often succumbs to the maltreatment of her weight by her peers.[break][break]

    i am wanting, eventually, for "wesley" and briar to fall in love. this will be the typical, 'but you're my best friend's little sister' trope.[break][break]

    however, the one thing about "wesley" is that he does not treat her how sage does. he gives her hugs, meaninglessly flirts with her, makes her feel comfortable, and snaps at all the bullies at school. in a lump sum, "wesley" is everything briar needs in an older brother, but this support she gets from him quickly develops into feelings, which she keeps to herself.[break][break]



    sage "wesley" was the first true, authentic friend to befriend sage when he and his sister transferred to hogwarts their second and third years, respectively. the two boys are in the same year, and sage is a slytherin.[break][break]

    where a conflict may arise between these two is that sage is apart of a 'posse' of students that bully, pick-on, and terrorize the other children. "wesley" does not agree with such acts, and it will most likely cause tension, especially when briar is involved in their victimizing.[break][break]

    this, of course, will make matters worse when "wesley" reveals his true feelings for briar.[break][break]

    if you have any other questions about this relationship, feel free to ask me, or add admin nyx on discord at nyx#1822, as she plays sage![break][break]












    [attr="class","worthlessPrideFooter"]















    [newclass=".worthlessPride"]width:540px;background:url('http://www.designbolts.com/wp-content/uploads/2012/12/Subtle-Dots-White-Tileable-pattern.jpg');margin:20px auto;display:block;position:relative;border:1px solid #d3dfd8;box-sizing:border-box;border-radius:2px;[/newclass]





    [newclass=".worthlessImage img"]width:345px;height:180px;border:10px solid #fff;padding:1px;background:#d3dfd8;outline:1.5px solid #d3dfd8[/newclass]

    [newclass=".worthlessPrideName"]display:inline-block;width:140px;height:462px;background:#d3dfd8;box-sizing:border-box;padding:45px 30px;border-bottom:1px solid #d3dfd8;font:800 20pt 'montserrat',sans-serif;color:#fff;text-shadow: -1px -1px 0 #b4cabb, 1px -1px 0 #b4cabb, -1px 1px 0 #b4cabb, 1px 1px 0 #b4cabb;text-transform:uppercase;[/newclass]

    [newclass=".worthlessPrideName img"]border-radius:50%;border:3px solid #d3dfd8;border-left:1px solid #fff; border-right:1px solid #fff; padding:8px;width:80px;height:80px;margin-top: -30px;margin-left: -10px;[/newclass]

    [newclass=".worthlessPrideName h1"]font:800 20pt 'montserrat',sans-serif;color:#fff;text-shadow: -1px -1px 0 #b4cabb, 1px -1px 0 #b4cabb, -1px 1px 0 #b4cabb, 1px 1px 0 #b4cabb;text-transform:uppercase;transform:rotate(-90deg);margin-left:-110px;margin-top:122px;width:300px;line-height:25px;height:80px;box-sizing:border-box;padding-top:10px;position:relative;[/newclass]

    [newclass=".worthlessPrideName hr"]position:absolute;bottom:-5px;height:2px;background:#fff;border:0.5px solid #b4cabb;width:180px;[/newclass]







    [newclass=".alignT"]display:inline-block;vertical-align:top;padding:15px;[/newclass]

    [newclass=".worthlessPrideBody"]background:#fff;display:block;height:215px;padding:20px;margin-top:10px;width:365px;border:1px solid #d3dfd8;box-sizing:border-box;border-radius:2px;font:400 7pt 'montserrat', sans-serif;color:#999;text-align:justify;[/newclass]

    [newclass=".worthlessPrideBody span"]display:inline-block;padding:8px;background:#d2eada;margin:3px 0px 3px 3px;border:1px solid #b4cabb;border-radius:2px;color:#fff; text-shadow: -1px -1px 0 #b4cabb, 1px -1px 0 #b4cabb, -1px 1px 0 #b4cabb, 1px 1px 0 #b4cabb;text-transform:uppercase;color:#fff;font-weight:800;letter-spacing:2px;[/newclass]

    [newclass=".worthlessPrideBody b"]color:#b4cabb;filter:brightness(90%);-webkit-filter:brigthness(90%);-moz-filter:brightness(90%);[/newclass]

    [newclass=".worthlessPrideBody div"]margin:0px;padding-right:8px;border:0px;height:170px;overflow:auto;[/newclass]

    [newclass=".worthlessPrideBody div::-webkit-scrollbar"]width: 8px;background-color: #eaeaea;border: 1px solid #ccc;[/newclass]

    [newclass=".worthlessPrideBody div::-webkit-scrollbar-thumb"]background:#d3dfd8;border: 1px solid #b4cabb;[/newclass]





    [newclass=".worthlessPrideFooter b, .worthlessPrideHeader b"]color:#b4cabb;[/newclass]

    [newclass=".worthlessPrideFooter a, .worthlessPrideHeader a"]font:600 7pt 'montserrat', sans-serif;color:#bbb;[/newclass]

    [newclass=".worthlessPrideFooter ul, .worthlessPrideHeader ul"]margin:0px !important;list-style-type:none;[/newclass]

    [newclass=".worthlessPrideFooter li, .worthlessPrideHeader li]display:inline-block;margin:0px 5px;font:600 7pt 'montserrat',sans-serif;text-transform:uppercase;color:#bbb;[/newclass]

    [newclass=".worthlessPrideFooter, .worthlessPrideHeader"]height:30px;background:#f8f8f8;display:block;box-sizing:border-box;padding:0px 20px;line-height:30px;text-align:right;border-bottom:1px solid #d3dfd8;text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;

    [/newclass]

    [newclass=".worthlessPrideFooter"]border-bottom:0px;border-top:1px solid #d3dfd8;[/newclass]
    last edit on Aug 11, 2021 17:23:33 GMT by lux
    options
    safe & sound || addicted mother written Apr 10, 2021 20:38:26 GMT
    pronounsShe/Her
    424written posts
    luxearned bits
    offlinecurrently
    lux
    Senior Member
    lux Avatar
    But I'm a sunflower, a little funny
    [nospaces][googlefont=Montserrat:800|Teko:700|Catamaran:700|Work+Sans:400,400i,700]

    [newclass=.punkifavsound .accentbg]background: #99b4c7;[/newclass]

    [newclass=.punkifavsound h3, .punkifavsoundcredit a, .punkifavsound .scroll b, .punkifavsound .scroll i]color: #99b4c7;[/newclass]

    [newclass=.punkifavsound .accentborder]border-color: #99b4c7;[/newclass]

    [newclass=.punkifavsound]width: 400px; height: 400px; background: #ffffff; margin: auto; border-radius: 5px; overflow: hidden;[/newclass]

    [newclass=.punkifavsound .img]position: absolute; width: 120px; height: 120px; background: #F8FBFB; background-repeat: no-repeat; background-position: center; padding: 39px; border: 1px solid rgba(0,0,0,0.03); margin-top: 50px; margin-left: 100px; border-radius: 50%;[/newclass]

    [newclass=.punkifavsound .img > div:first-child]width: 150px; height: 150px; position: absolute; border-radius: 50%; border-width: 1px; border-style: solid; margin-left: -16px; margin-top: -16px; opacity: 0.6; clip-path: polygon(0 10px,100% 10px,100% 141px,0 141px); animation: punkifavsoundcircle 5s linear infinite; } @keyframes punkifavsoundcircle { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }[/newclass]

    [newclass=.punkifavsound .img > div:last-child]width: 200px; height: 200px; position: absolute; border-width: 1px; border-style: solid; border-radius: 50%; margin-top: -41px; margin-left: -41px; clip-path: polygon(20px 0, 181px 0,181px 20px,20px 20px); animation: punkifavsoundcircle 3s linear infinite reverse;[/newclass]

    [newclass=.punkifavsound .img .icon]width: inherit; height: inherit; border: 15px solid #ffffff; position: absolute; border-radius: 50%; background: url('https://i.imgur.com/nT4eD7X.jpg'); margin-left: -15px; margin-top: -15px;[/newclass]

    [newclass=.punkifavsound .charname]position: absolute; font-family: Montserrat; font-size: 40px; line-height: 35px; width: 400px; margin-left: 0px; text-align: center; text-transform: uppercase; margin-top: 285px; color: #F8FBFB; text-shadow: 1px 1px rgba(0,0,0,0.075), -1px 1px rgba(0,0,0,0.075), 1px -1px rgba(0,0,0,0.075),-1px -1px rgba(0,0,0,0.075); font-weight: 800; letter-spacing: -1px;[/newclass]

    [newclass=.punkifavsound .bulk]width: 400px; height: 400px; padding-left: 450px; background: #F8FBFB; position: relative; left: 350px; clip-path: polygon(0 400px,400px 0,100% 0,100% 100%,0 100%); transition: all 1s ease; transition-delay: 0.5s;[/newclass]

    [newclass=.punkifavsound:hover .bulk]background: #ffffff; left: -450px; transition-delay: 0s;[/newclass]

    [newclass=.punkifavsound .bulk > div:first-child]width: 0; height: 0; position: absolute; border-left: 451px solid rgba(0,0,0,0.03); border-bottom: 451px solid transparent; margin-left: -450px; margin-top: -49px;[/newclass]

    [newclass=.punkifavsound .fade]position: relative; height: 400px; transition: all 0.5s ease; opacity: 0;[/newclass]

    [newclass=.punkifavsound:hover .fade]opacity: 1; transition-delay: 1s;[/newclass]

    [newclass=.punkifavsound .t]height: 111px; background: #6e6e6e; position: absolute; width: 374px; padding-left: 26px; padding-top: 28px; font-family: Teko; font-size: 40px; line-height: 26px; color: #ffffff; text-transform: uppercase; letter-spacing: -1px; font-weight: bold; text-shadow: 0px 0px 2px rgba(0,0,0,0.2);[/newclass]

    [newclass=.punkifavsound .t > div span]display: inline-block; font-size: 11px; line-height: 21px; margin-top: 10px; padding: 0 5px; border: 1px solid rgba(255,255,255,0.15); border-radius: 2px; letter-spacing: 0px; font-family: Catamaran;[/newclass]

    [newclass=.punkifavsound .tborder]height: 142px; border-right-width: 120px; border-right-style: solid; background: #E4E6E6;[/newclass]

    [newclass=.punkifavsound .scroll]height: 258px; overflow: auto;[/newclass]

    [newclass=.punkifavsound .scroll > div]padding: 20px; padding-top: 0; font-family: Work Sans; font-size: 11px; line-height: 17px; text-align: justify; color: #6e6e6e;[/newclass]

    [newclass=.punkifavsound .scroll i]opacity: 0.8;[/newclass]

    [newclass=.punkifavsound h3]background: #F8FBFB; border: 1px solid rgba(0,0,0,0.03); border-left: none; border-right: none; font-family: Catamaran; font-size: 20px; line-height: 40px; text-indent: 10px; margin: 20px -20px; text-transform: uppercase; font-weight: 700; letter-spacing: -1px;[/newclass]

    [newclass=.punkifavsoundcredit]width: 400px; margin: auto; color: #6e6e6e; text-align: right; font-family: Catamaran; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; line-height: 25px; font-weight: bold;[/newclass]

    [newclass=.punkifavsoundcredit a]font-size: inherit; font: inherit; transition: all 0.3s ease;[/newclass]

    [newclass=.punkifavsoundcredit a:hover]opacity: 0.6;[/newclass]

    [attr=class,punkifavsound]
    [attr=class,img]
    [attr=class,accentborder]

    [attr=class,icon]

    [attr=class,accentborder]


    [attr=class,charname]
    OPEN[break]
    NAME

    [attr=class,bulk]

    [attr=class,fade]
    [attr=class,t accentbg]
    drugs rule everything around me

    [attr=class,accentbg]forties [attr=class,accentbg]muggle [attr=class,accentbg]cameron diaz


    [attr=class,tborder accentborder]

    [attr=class,scroll]

    mother


    hello hello![break][break]



    this woman here that i am looking for is the mother of my character lachlan boot-corner. he is currently a fifth year student at hogwarts, a slytherin, but the sweetest, most shy and naรฏve boy you ever did see. his back story is quite simple, albeit disheartening.[break][break]



    he was born in la, california, a month premature, and addicted to drugs. his mother -- cough cough this lady -- was in and out of homeless shelters, has no idea who the father is, and was taken from the hospital immediately following lachlan's birth. whether she was brought to a rehab or a jail would be up to you! the only other established facts i have for her are that she is a muggle, has not contacted lachlan in any way, and i would still like her to be struggling with addiction.[break][break]



    after lachlan was cleared to leave the hospital, he was moved from foster home to foster home up until his eighth birthday. at that point, he was adopted by michael corner and terry boot, who also adopted three other magical children.[break][break]



    currently, lachlan is working to come to terms with his sexuality and who he is. he recently stopped ignoring his feelings (he is bisexual), and has his first boyfriend. however despite all of this, he still struggles with not knowing who his mother and father are, why they abandoned him, why his mother could not stop using for him, and worries he might turn out the same.[break][break]



    he is dating orion travers, a pureblood gryffindor, who unfortunately is selling drugs, but is hiding his own drug use from lachlan.[break][break]



    i think to have his mother come back into his life sixteen years later, curious about who he is, but still using and to meet the two boys would be drama filled and just oh so fun. you can read more about lachlan here, and feel free to add me on discord at LIA#1567 with any questions! i'd be happy to discuss any possibilities and am super excited for this ad! ๐Ÿคฉ





    [attr=class,punkifavsoundcredit]
    template by punki
    last edit on Apr 10, 2021 20:42:49 GMT by lux
    options
    art request for youtube i guess written Mar 29, 2020 19:46:42 GMT
    pronounsShe/Her
    424written posts
    luxearned bits
    offlinecurrently
    lux
    Senior Member
    lux Avatar
    But I'm a sunflower, a little funny
    [googlefont=Dosis]

    ICON AND BANNER
    okay being honest yโ€™all i am finally done with school and am itching to start vlogging on youtube. i have no idea where to begin or how to start, but i DO KNOW that i need an icon and banner for my channel. i have a few simple things iโ€™d want so i guess iโ€™ll list em down below PLEASE HELP :-*

    ยป i would like the icon and banner to have a cartoonized image of myself sort of like this here
    ยป nothing bright and crazy, i love simplicity and pastels (especially the color yellow)
    ยป i would need my name on the banner as well as my snapchat username and the day(s?) i would be uploading

    i honestly think thatโ€™s all? i donโ€™t know the size of the banner but iโ€™m sure i could easily figure it out and if youโ€™ve made it this far bless your heart ๐Ÿ’›
    options
    quote
    Post a Random Thought written Mar 7, 2019 1:34:20 GMT via mobile
    pronounsShe/Her
    424written posts
    luxearned bits
    offlinecurrently
    lux
    Senior Member
    lux Avatar
    But I'm a sunflower, a little funny
    pharaoh leap Avatar
    Mar 7, 2019 1:23:20 GMT said:
    lux Avatar
    Mar 6, 2019 22:41:03 GMT said:
    I ... just made a banner ... on scratchpad?

    What to do with it?
    Share it with the class, of course. ;D


    Okay it is not even remotely decent but it is my first time doing anything LOL

    scratchpad.io/reminiscent-cabbage-9345