Profile
Click to select all
<!-- Share and Reply A F2U Code by EeveePotter RETIRED Rules ~ Don't claim as your own ~ No reselling ~ Feel free to edit or Frankenstein Other: ~ NOT Mobile Friendly ~ WYSIWYG off Resources: ~ Code Editor: https://th.circlejourney.net/ ~ Color Picker: https://www.w3schools.com/colors/colors_picker.asp Colors (highlight the hex code, ctrl+f, little plus on the pop-up and paste the new code before clicking 'All' next to 'Replace' to replace): ~ Title Name: 3385ff ~ Title Share & Reply: ff1b8d ~ Nave Colors: ffda00 ~ Profile Tab Name Color: ff008e Share & Reply Color: 0c00ff ~ Personality Tab Share Symbols: ff0035 Reply Symbols: 0600e1 Sliders: f4da04 ~ Story Tab Share and Reply Symbols: f5179f ~ Stats Tab Share and Reply Symbols: fa54d3 Box colors: 37b3ff ~ Details Tab Share and Reply List Symbols: 1909a0 Share and Reply Athstetic Symbols: 9d1682 ~ Relationships Tab Relation 1 S&R Symbols: e51a90 Relation 2 S&R Symbols: e5d11a Relation 3 S&R Symbols: 1a63e5 --> <div class="profile-content-content user-content fr-view"> <div class="container code" style="text-align:center;max-width:1000px;border:solid;color:#fff;" style="height: 400px;" data-pause="true" style="height: 400px;"> <h1 style="margin-top:20px;color:#1bb3ff;font-size:35px;"><i class="fas fa-share my-auto" style="color:#ff1b8d;"></i> CHARACTERNAME/NICKNAME <i class="fas fa-reply my-auto" style="color:#ff1b8d;"></i></h1> <div class="rounded-circle m-auto" style="height:150px; width:150px; background:url(IMAGELINK) center no-repeat; background-size:cover; background-color:#fff;"></div> <font style="color:#000" size="+4"></font> <ul class="nav nav-tabs row mt-4 ml-3"> <li class="col-2 p-0"><a class="active text-muted" data-toggle="tab" href="#Tab1" style="font-size:26pt;"><i class="fas fa-info" style="color:#ffda00;"></i></a></li> <li class="col-2 p-0"><a class="text-muted" data-toggle="tab" href="#Tab2" style="font-size:26pt;"><i class="fas fa-theater-masks" style="color:#ffda00;"></i></a></li> <li class="col-2 p-0"><a class="text-muted" data-toggle="tab" href="#Tab3" style="font-size:26pt;"><i class="fas fa-book" style="color:#ffda00;"></i></a></li> <li class="col-2 p-0"><a class="text-muted" data-toggle="tab" href="#Tab4" style="font-size:26pt;"><i class="far fa-chart-bar" style="color:#ffda00;"></i></a></li> <li class="col-2 p-0"><a class="text-muted" data-toggle="tab" href="#Tab5" style="font-size:26pt;"><i class="fas fa-search" style="color:#ffda00;"></i></a></li> <li class="col-2 p-0"><a class="text-muted" data-toggle="tab" href="#Tab6" style="font-size:26pt;"><i class="fas fa-link" style="color:#ffda00;"></i></a></li> </ul> <hr style="height:0px;border:solid;border-width:1px;"> <div class="tab-content" style="max-height:500px;overflow:auto;"> <div id="Tab1" class="tab-pane fade in active show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <div class="card mx-auto rounded-0" style="width:900px; border-width:0px;"> <div class="rounded-0 m-auto" style="float:left; height:200px; width:600px; background:url(IMAGELINK) center no-repeat; background-size:cover; background-color:#fff;"></div> <hr style="height:0px;border:solid;border-width:1px;color:#636363;"> <h1 style="margin-top:0px;margin-bottom:0px;color:#ff008e;"><i class="fas fa-share my-auto" style="color:#0c00ff;"></i> FirstName LastName <i class="fas fa-reply my-auto" style="color:#0c00ff;"></i></h1> <hr style="height:0px;border:solid;border-width:1px;color:#636363;"> <div class="row"> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> NICKNAMES</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Nickname, Nickname <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> SEXUALITY</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Sexuality <i class="fas fa-reply my-auto"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> GENDER</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Gender <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> PRONOUNS</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Pr/Pr <i class="fas fa-reply my-auto"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> AGE</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Age <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> BIRTHDAY</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">MNTH / DY / YR <i class="fas fa-reply my-auto"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> OCCUPATION</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Job <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> HEIGHT</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Ft.' In." <i class="fas fa-reply my-auto"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> ROLE</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">Role <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> VERSE</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span><a href="#" target="blank">Universe</a> <i class="fas fa-reply my-auto" style="color:#000;"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> CREATOR</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span><a href="#" target="blank">Creator</a> <i class="fas fa-reply my-auto" style="color:#000;"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> DESIGNER</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span><a href="#" target="blank">Designer</a> <i class="fas fa-reply my-auto" style="color:#000;"></i></span> </div> </div> <hr> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> WORTH</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span style="color:#000;">$Amount <i class="fas fa-reply my-auto"></i></span> </div> </div> <div class="col-md-6 mb-1"> <div class="d-flex justify-content-between"> <span class="text-uppercase" style="letter-spacing:1px;color:#252525;"><i class="fas fa-share my-auto"></i> THEME</span> <div class="col m-auto p-1"><hr class="my-1" style="background:#000;"></div> <span><a href="#" target="blank">Song Name ~ Artist </a><i class="fas fa-reply my-auto" style="color:#000;"></i></span> </div> </div> <hr> </div> </div> </div> </font> </div> <div id="Tab2" class="tab-pane fade show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Introvert</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Extrovert</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Lazy</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Active</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Cowardly</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Brave</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Immature</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Mature</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Friendly</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Reserved</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Hostile</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Passive</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Impulsive</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Strategic</font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase text-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#ff0035;"></i>Logical</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar card-primary" style="background:none;border-right-width:8px;border-right-style:solid;width:50%;border-color:#f4da04;"></div> </div> <font class="w-25 text-uppercase text-right" size="+2" style="color:#000;">Empathetic</font> </div> <hr style="height:0px;border:solid;border-width:1px;"> <div class="d-flex p-1"> <font class="w-25 text-uppercase my-auto" size="+2" style="color:#000;">Charisma</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar" style="background-color: #f4da04;width: 50%;"></div> </div> <font class="w-25 text-right" size="+3" style="color:#000;">50<i class="fas fa-reply my-auto" style="color:#0600e1;"></i></font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase my-auto" size="+2" style="color:#000;">Charm</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar" style="background-color: #f4da04;width: 50%;"></div> </div> <font class="w-25 text-right" size="+3" style="color:#000;">50<i class="fas fa-reply my-auto" style="color:#0600e1;"></i></font> </div> <div class="d-flex p-1"> <font class="w-25 text-uppercase my-auto" size="+2" style="color:#000;">Luck</font> <div class="w-100 card progress my-auto" style="height: 10px"> <div class="progress-bar" style="background-color: #f4da04;width: 50%;"></div> </div> <font class="w-25 text-right" size="+3" style="color:#000;">50<i class="fas fa-reply my-auto" style="color:#0600e1;"></i></font> </div> <hr style="height:0px;border:solid;border-width:1px;"> <p style="color:#000;">Write a little about your character's personality here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> <p style="color:#000;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> </div> </font> </div> <div id="Tab3" class="tab-pane fade show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <div class="display-4 text-center d-flex justify-content-between" style="font-size:18px;"> <i class="fas fa-share fa-lg my-auto" style="color:#f5179f;"></i> <i><font style="color:#000;">A Quote Here. As long as you want. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.</font></i> <i class="fas fa-reply fa-lg my-auto" style="color:#f5179f;"></i> </div> <br> <div class="col-md-3 float-md-left mx-auto mb-2"> <div style="height:350px; width:200px; background:url(IMAGELINK) center no-repeat; background-size:cover;"> </div> </div> <font size="+3" style="color:#000;">Header</font><br> <font style="color:#000;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</font><br> <font size="+2" style="color:#000;">SubHeader</font><br> <font style="color:#000;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</font><br> <font size="+2" style="color:#000;">SubHeader</font><br> <font style="color:#000;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</font> <hr> <div class="display-4 text-center d-flex justify-content-between" style="font-size:18px;"> <i class="fas fa-share fa-lg my-auto" style="color:#f5179f;"></i> <i><font style="color:#000;">A Quote Here. As long as you want. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.</font></i> <i class="fas fa-reply fa-lg my-auto" style="color:#f5179f;"></i> </div> </div> </font> </div> <div id="Tab4" class="tab-pane fade show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Intelligence <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Strength <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Speed <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Durability <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Magic <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <font class="w-25 text-uppercase float-left" size="+2" style="color:#000;"><i class="fas fa-share my-auto" style="color:#fa54d3;"></i> Fighting <i class="fas fa-reply my-auto" style="color:#fa54d3;"></i></font> <font size="+3" style="float:right;"> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="fas fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> <i class="far fa-square" style="color:#37b3ff;"></i> </font> <hr> <h1 style="margin-top:20px;color:#000;font-size:35px;">Total: 00</h1> <hr style="height:0px;border:solid;border-width:1px;"> <p style="color:#000;">A little bit about your character's special abilities here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p><br> <p style="color:#000;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> </div> </font> </div> <div id="Tab5" class="tab-pane fade show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <table style="border:1px solid black;width:100%;"> <tr> <td style="border:1px solid black;width:50%;"> <h2 style="color:#000;text-align:left;">Trivia</h2> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Write stuff about your OC here. Add or remove as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.</li> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> This is an add on to the last point. Add or delete as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.</li> </ul> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. </li> </ul> </td> <td style="border:1px solid black;width:50%;"> <h2 style="color:#000;text-align:left;">Design Notes</h2> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Write design notes about your OC here. Add or remove as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.</li> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> This is an add on to the last point. Add or delete as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.</li> </ul> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. </li> </ul> <tr> </tr> </table> <table style="border:1px solid black;width:100%;"> <tr> <td style="width:100%;"> <h2 style="color:#000;text-align:center;">Extended Notes</h2> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Extended Notes about your OC. Add or remove as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</li> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</li> <ul class="fa-ul"> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> This is an add on to the last point. Add or delete as many as you'd like. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</li> <li style="color:#000;text-align:left;"><i class="fas fa-reply" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</li> </ul> <li style="color:#000;text-align:left;"><i class="fas fa-share" style="color:#1909a0;"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</li> </ul> </td> </tr> <tr> <td style="width:100%;border:1px solid black;"> <center> <h2 style="color:#000;text-align:center;">Athstetic</h2> <font size="+1"><i class="fas fa-share fa-lg my-auto" style="color:#9d1682;"></i></font> <img src="IMAGELINK" height=200 width=200> <img src="IMAGELINK" height=200 width=200> <img src="IMAGELINK" height=200 width=200> <img src="IMAGELINK" height=200 width=200> <font size="+1"><i class="fas fa-reply fa-lg my-auto" style="color:#9d1682;"></i></font> </center> </td> </tr> </table> </div> </font> </div> <div id="Tab6" class="tab-pane fade show card-block"> <font style="color:#000;"> <div id="Profile" style="height:400px;"> <table style="border:1px solid black;width:100%;"> <tr> <td style="border:1px solid black;width:50%;"> <div class="col-md-2 float-md-right my-auto mb-2"><img src="IMAGELINK" height=200 width=200></div> <font size="+2" style="color:#000;" class="float-md-left"><a href="#" target="blank"><i class="fas fa-share" style="color:#e51a90;"></i> Name <i class="fas fa-reply" style="color:#e51a90;"></i></a></font> <br><br> <font size="+1" style="color:#000;" class="float-md-left"><i><i class="fas fa-share" style="color:#e51a90;"></i> Relationship <i class="fas fa-reply" style="color:#e51a90;"></i></i></font> <br><br> <p style="color:#000;">Explain a little about the relationship. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> </td> </tr> <tr> <td style="border:1px solid black;width:50%;"> <div class="col-md-2 float-md-right my-auto mb-2"><img src="IMAGELINK" height=200 width=200></div> <font size="+2" style="color:#000;" class="float-md-left"><a href="#" target="blank"><i class="fas fa-share" style="color:#e5d11a;"></i> Name <i class="fas fa-reply" style="color:#e5d11a;"></i></a></font> <br><br> <font size="+1" style="color:#000;" class="float-md-left"><i class="fas fa-share" style="color:#e5d11a;"></i><i> Relationship <i class="fas fa-reply" style="color:#e5d11a;"></i></i></font> <br><br> <p style="color:#000;">Explain a little about the relationship. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> </td> </tr> <tr> <td style="border:1px solid black;width:50%;"> <div class="col-md-2 float-md-right my-auto mb-2"><img src="IMAGELINK" height=200 width=200></div> <font size="+2" style="color:#000;" class="float-md-left"><a href="#" target="blank"><i class="fas fa-share" style="color:#1a63e5;"></i> Name <i class="fas fa-reply" style="color:#1a63e5;"></i></a></font> <br><br> <font size="+1" style="color:#000;" class="float-md-left"><i class="fas fa-share" style="color:#1a63e5;"></i><i></i> Relationship <i class="fas fa-reply" style="color:#1a63e5;"></i></font> <br><br> <p style="color:#000;">Explain a little about the relationship. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p> </td> </tr> </table> </div> </font> </div> </div> </div> </div>