|
|
| (21 intermediate revisions by one other user not shown) |
| Line 1: |
Line 1: |
| __NOTOC__ __NOEDITSECTION__
| |
| {{#css:
| |
| .container {
| |
| font-family: Segoe Script;
| |
| display: flex;
| |
| justify-content: center;
| |
| height: auto;
| |
| width: 1000px;
| |
| margin: auto;
| |
| display: flex;
| |
| flex-direction: column;
| |
| }
| |
|
| |
|
| .bg-dark {
| |
| background-color: Black;
| |
| color: yellow;
| |
| border-color: Yellow;
| |
| }
| |
|
| |
| .bg-light {
| |
| background-color: blue;
| |
| color: #EFEFEF;
| |
| border-color: yellow;
| |
| }
| |
|
| |
| .top-section {
| |
| display: flex;
| |
| }
| |
|
| |
| .right-panel {
| |
| width: 30%;
| |
| height: auto;
| |
| border: 11px;
| |
| border-style: solid;
| |
| border-color: yellow;
| |
| font-size: 0.9em;
| |
|
| |
| }
| |
|
| |
| .left-panel {
| |
| width: 70%;
| |
| display: flex;
| |
| flex-direction: column;
| |
| justify-content: center;
| |
| }
| |
|
| |
| .center {
| |
| text-align: center;
| |
| }
| |
|
| |
| .underline {
| |
| border-bottom-style: solid;
| |
| border-color: yellow;
| |
| border-bottom-width: 0.1em;
| |
| padding-bottom: 0.5em;
| |
| }
| |
|
| |
| .label {
| |
| margin: 0.2em 0;
| |
| font-size: 1.4em;
| |
| font-weight: 600;
| |
| font-style: italic;
| |
| }
| |
|
| |
| .header-container {
| |
| width: 100%;
| |
| display: flex;
| |
| justify-content: center;
| |
| padding: 2em 0;
| |
| }
| |
|
| |
| .header-title {
| |
| width: 94%;
| |
| font-size: 32px;
| |
| letter-spacing: 2px;
| |
| word-spacing: 2px;
| |
| font-weight: 700;
| |
| text-decoration: none;
| |
| font-style: normal;
| |
| font-variant: normal;
| |
| text-transform: none;
| |
| }
| |
|
| |
| .portrait-image {
| |
| width: 100%;
| |
| }
| |
|
| |
| .portrait-image img {
| |
| width: 100%;
| |
| padding-bottom: 1em;
| |
| }
| |
|
| |
| .info-table {
| |
| margin: auto;
| |
| width: 100%;
| |
| padding: 0 1em;
| |
| }
| |
|
| |
| .info-table-label {
| |
| font-weight: 600;
| |
| width: 50%;
| |
| }
| |
|
| |
| .biography-container {
| |
| width: 94%;
| |
| padding: 1em 3%;
| |
| }
| |
|
| |
| .section-container {
| |
| width: 94%;
| |
| padding: 1em 3%;
| |
| font-size: 0.9em;
| |
| display: flex;
| |
| flex-direction: column;
| |
| }
| |
|
| |
| .photo-banner {
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| .photo-banner img {
| |
| width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| .mid-banner {
| |
| margin: -1em 0;
| |
| }
| |
|
| |
| .hooks-content {
| |
| padding-bottom: 1em;
| |
| }
| |
|
| |
| .hook-table-label {
| |
| width: 25%;
| |
| font-weight: 600;
| |
| padding-left: 0.5em;
| |
| }
| |
|
| |
| .gallery-content ul {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| list-style-type: none;
| |
| justify-content: center;
| |
| }
| |
|
| |
| .gallery-content img {
| |
| height: 240px;
| |
| max-width: 100%;
| |
| }
| |
|
| |
| #soundtrack, #statistics {
| |
| padding-top: 2em;
| |
| }
| |
|
| |
| #soundtrack a {
| |
| color: cyan;
| |
| }
| |
|
| |
| #soundtrack a:visited {
| |
| color: cyan;
| |
| }
| |
|
| |
| #soundtrack a:hover {
| |
| color: cyan;
| |
| }
| |
| }}
| |
|
| |
| <div class="container">
| |
|
| |
| <div class="top-section">
| |
| <div class="left-panel bg-dark">
| |
| <div class="header-container">
| |
| <div class="header-title center underline">Hoshi "Boomer" Akira</div>
| |
| </div>
| |
|
| |
| <div class="photo-banner">[[File:Akira1.jpg]]</div>
| |
|
| |
| <div class="biography-container">
| |
| <div class="label center underline">Biography</div>
| |
|
| |
| <p> Stuff Stuff Stuff Stuff Stuff .<br><br>
| |
|
| |
| Stuff Stuff Stuff Stuff Stuff <br><br>
| |
|
| |
| Stuff Stuff Stuff Stuff Stuff Stuff </p><br>
| |
|
| |
| <div class="photo-banner mid-banner">[[File:Akira3.jpeg]]</div>
| |
|
| |
| </div>
| |
| </div>
| |
|
| |
| <div class="right-panel bg-light">
| |
| <div class="portrait-image">[[File:Akira2.jpg]]</div>
| |
|
| |
| <table class="info-table">
| |
| <tr>
| |
| <td class="info-table-label">Full Name:</td>
| |
| <td> </td>
| |
| </tr>
| |
| <tr>
| |
| <td class="info-table-label">Position:</td>
| |
| <td> </td>
| |
| </tr>
| |
| <tr>
| |
| <td class="info-table-label">Residence:</td>
| |
| <td> </td>
| |
| </tr>
| |
| <tr>
| |
| <td class="info-table-label">Demeanor:</td>
| |
| <td> </td>
| |
| </tr>
| |
| <tr>
| |
| <td class="info-table-label">Apparent Age:</td>
| |
| <td> </td>
| |
| </tr>
| |
| </table>
| |
|
| |
| <div id="statistics">
| |
| <div class="label center underline">Statistics</div>
| |
| <table class="info-table">
| |
| <tr><td class="info-table-label">:</td><td>⚫⚫⚫⚫</td></tr>
| |
| <tr><td class="info-table-label">:</td><td>⚫⚫⚫⚫⚫</td></tr>
| |
| <tr><td class="info-table-label">:</td><td>⚫⚫⚫⚫</td></tr>
| |
| <tr><td class="info-table-label">:</td><td>⚫⚫⚫⚫</td></tr>
| |
| <tr><td class="info-table-label">:</td><td>⚫⚫⚫⚫</td></tr>
| |
| </table>
| |
| </div>
| |
|
| |
| <div id="soundtrack">
| |
| <div class="label center underline">Soundtrack</div>
| |
| <div class="info-table">
| |
| <center>
| |
| <i>
| |
| [https://www.youtube.com/watch?v=1BpiXrugY1k (Ghost in the Shell )] <br>
| |
| [https://www.youtube.com/watch?v=1wJME0DAUXw (Legends never die)] <br>
| |
| [https://www.youtube.com/watch?v=C0_uarDaKeg (Believer)] <br>
| |
| [https://www.youtube.com/watch?v=24b1HdyEWg4 (For The Glory)] <br>
| |
| [https://www.youtube.com/watch?v=deq4KehwA8w (Survivor)] <br>
| |
| [https://www.youtube.com/watch?v=udlnkIOlnHQ (Warriors )] <br>
| |
| [https://www.youtube.com/watch?v=awiVrcrReWo (Whatever It Takes)] <br>
| |
| [https://www.youtube.com/watch?v=Htu3va7yDMg (The Champion)] <br>
| |
| [https://www.youtube.com/watch?v=b7k0a5hYnSI (Unwritten)] <br>
| |
| [https://www.youtube.com/watch?v=Htu3va7yDMg (The Champion)] <br>
| |
| [https://www.youtube.com/watch?v=gte3BoXKwP0 (Pocketful of Sunshine )] <br>
| |
| [https://www.youtube.com/watch?v=QUQsqBqxoR4 (Brave)] <br>
| |
| [https://www.youtube.com/watch?v=b7k0a5hYnSI (Unwritten)] <br>
| |
| [https://www.youtube.com/watch?v=M81E8cDxkpc (Cannonball )] <br><br>
| |
| </i>
| |
| <b>- Can delete this line? -</b>
| |
| </centeR>
| |
| </div>
| |
| </div>
| |
|
| |
| </div>
| |
| </div>
| |
|
| |
| <div class="section-container bg-dark">
| |
| <div class="label center underline">Gallery</div>
| |
| <div class="gallery-content">
| |
| <ul>
| |
| <li>
| |
| [[File:.jpg]]
| |
| [[File:.jpg]]
| |
| [[File:.jpg]]
| |
| </li>
| |
| </ul>
| |
| <center></center>
| |
| </div>
| |
| </div>
| |
|
| |
| <div class="section-container bg-light">
| |
| <div class="label center underline">Roleplay Hooks</div>
| |
|
| |
| <div class="hooks-content">
| |
| <table class="hooks-table">
| |
| <tr>
| |
| <td class="hook-table-label">Stuff stuff:</td>
| |
| <td>Stuff stuffStuff stuffStuff stuffStuff stuffStuff stuff</td>
| |
| </tr>
| |
| <tr>
| |
| <td class="hook-table-label">Stuff stuff:</td>
| |
| <td>Stuff stuffStuff stuffStuff stuffStuff stuffStuff stuff</td>
| |
| </tr>
| |
| <tr>
| |
| <td class="hook-table-label">Stuff stuff:</td>
| |
| <td>Stuff stuffStuff stuffStuff stuffStuff stuffStuff stuffStuff stuff</td>
| |
| </tr>
| |
| </table>
| |
| </div>
| |
| </div>
| |
|
| |
|
| |
| </div>
| |
|
| |
| [[Category:Characters]][[Category:Active]][[Category:PC]]
| |
