Profile
<!-- Originally released under the Unlicense : https://toyhou.se/12377766 --> <!-- legend of colors: cover: 466995 cover text: 4be9af > the pages are a linear gradient from [pages] to [pages shadow] pages: f7f2eb pages shadow: E5DFD7 pages text: 342121 --> <!-- book --> <div class="p-3"> <div class="m-auto" style="width:800px; min-height:100px;"> <div class="row no-gutters" style="position: relative;"> <div class="col-6 pl-2" style="height:30px; overflow: hidden; position: absolute; z-index: 4; left: 0px; top: 8px;"> <ul class="nav"> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#pfour"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link ml-1" data-toggle="tab" href="#pthree"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link ml-1" data-toggle="tab" href="#ptwo"> <p style="visibility: hidden;">xxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link ml-1" data-toggle="tab" href="#pone"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> </ul> </div> <div class="col-6" style="height:30px; overflow: hidden; position: absolute; z-index: 4; right: 0; top: 8px;"> <ul class="nav"> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#pone"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#ptwo"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#pthree"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> <li class="nav-item"> <a class="nav-link" data-toggle="tab" href="#pfour"> <p style="visibility: hidden;">xxxxxxxxxx</p> </a> </li> </ul> </div> </div> <div class="tab-content"> <!-- cover --> <div class="show active tab-pane p-1 py-2" id="pcover" style="color: #342121; position: relative;"> <div style="background: #466995; position: absolute; bottom: 0; right: 0; width: 400px; height:95%; z-index: 1; border-radius: 0px 10px 10px 0; border-width: 0; border-style:solid; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4);"> <div class="justify-content-center"> <h1 class="text-light" style="text-align: center; color: #4be9af; margin-top: 40px; font-size: 2.5em; font-family: 'Times New Roman'; text-shadow: 2px 2px 4px rgba(255, 255, 255, .6), -2px -2px 4px rgba(0, 0, 0, 0.7);">Botanical <br>Journal</h1> </div> </div> <div class="row no-gutters mx-2 justify-content-center"> <div class="col-6 px-3" style="height:20px;"> <br> </div> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">trivia</div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">history</div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">aesthetic</div> <div class="col" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">relations</div> </div> </div> </div> <div class="row mx-2" style="min-height: 500px;"> <div class="col bg-muted invisible"> </div> <div class="col border-secondary" style="background: #f7f2eb; border-radius: 0 0 10px 0;"> </div> </div> </div> <!-- page 1 --> <div class="tab-pane p-1 py-2 show" id="pone" style="color: #342121; background: #466995; box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="row no-gutters mx-2 justify-content-center"> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> </div> </div> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">trivia</div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0; border-width: 1px 1px 0px 1px; border-color: white;">history</div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">aesthetic</div> <div class="col " style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">relations</div> </div> </div> </div> <!-- pages --> <div class="row mx-2" style="min-height: 500px; position: relative;"> <!-- page shadow (3d effect) --> <!-- page 1a --> <div class="col border-secondary" style="background-image: linear-gradient(to right, #f7f2eb 90%, #E5DFD7); box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <div class="row no-gutters"> <div class="col-3 mr-2" style="background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/38678906_ercuf5Gsna1ziYz.png); background-size: cover; background-repeat: no-repeat; background-repeat: no-repeat; background-position: center;"> <br> </div> <div class="col-4"> <p><span class="text-uppercase">name: </span>All Star <br><span class="text-uppercase">age: </span>21 <br><span class="text-uppercase">species: </span>Music</p> <p><span class="text-uppercase">Sex:</span> Toast <br><span class="text-uppercase">Gender:</span> Shrek</p> </div> <div class="col pr-3"> <p class="mb-2"><i class="fas fa-quote-left mr-1"></i>Somebody once told me the world is gonna roll me I ain't the sharpest tool in the shed<i class="fas fa-quote-right ml-1"></i></p> </div> </div> <hr style="border-top: 2px dashed black; opacity: 20%;"> <h4>Description</h4> <div class="float-right" style="background-image: url(https://i.imgur.com/yK89yLd.png); background-size: contain; background-repeat: no-repeat; width: 80px; height: 160px;"> <br> </div> <p>She was looking kind of dumb with her finger and her thumb In the shape of an "L" on her forehead</p> <p>Well the years start coming and they don't stop coming Fed to the rules and I hit the ground running <br>Didn't make sense not to live for fun Your brain gets smart but your head gets dumb</p> </div> </div> <!-- divider --> <div style="background-color: lightgrey; width:1px;"> <br> </div> <!-- page 1b --> <div class="col border-secondary" style="background-image: linear-gradient(to right, #f7f2eb 30%, #E5DFD7); border-radius: 0 0 10px 0; box-shadow: 7px 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <div> <h4>Personality</h4> <p>So much to do, so much to see <br>So what's wrong with taking the back streets?</p> <p>Hey now, you're an all-star, get your game on, go play Hey now, you're a rock star, get the show on, get paid And all that glitters is gold Only shooting stars break the mold</p> </div> <div class="row"> <div class="col"> <p>you could put some text here if you wanted</p> </div> <div class="col-3 mx-3" style="background-image: url(https://i.imgur.com/p8nZZp4.png); background-size: contain; background-repeat: no-repeat; background-position: center; height: 120px; width: 120px;"> <br> </div> </div> <hr style="border-top: 2px dashed black; opacity: 20%;"> <div class="row"> <div class="col"> <h5>Positive traits</h5> <ul> <li>You'll never know if you don't go</li> </ul> </div> <div class="col"> <h5>Negative traits</h5> <ul> <li>You'll never shine if you don't glow</li> </ul> </div> </div> </div> </div> </div> </div> <!--page2 --> <div class="tab-pane p-1 py-2 show" id="ptwo" style="color: #342121; background: #466995; box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="row no-gutters mx-2 justify-content-center"> <!-- tabs --> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">trivia</div> </div> </div> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">history</div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">aesthetic</div> <div class="col " style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">relations</div> </div> </div> </div> <!-- pages --> <div class="row mx-2" style="min-height: 500px; position: relative;"> <!-- page 2a --> <div class="col border-secondary" style="background-image: linear-gradient(to right, #f7f2eb 80%, #E5DFD7); box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <div> <h5><u>Past</u></h5> <p>It's a cool place and they say it gets colder You're bundled up now, wait 'til you get older But the meteor men beg to differ Judging by the hole in the satellite picture The ice we skate is getting pretty thin The water's getting warm so you might as well swim My world's on fire, how about yours? That's the way I like it and I'll never get bored</p> </div> <div class="row"> <div class="col" style="vertical-align: bottom; position: relative;"> <div style="position: absolute; bottom: 0;"> <h5><u>Present</u></h5> </div> </div> <div class="col-6 mr-3" style="background-image: url(https://i.imgur.com/v4Pzlvf.png); background-size: contain; background-repeat: no-repeat; background-position: center; height: 100px;"> <br> </div> </div> <p>Hey now, you're an all-star, get your game on, go play Hey now, you're a rock star, get the show on, get paid All that glitters is gold Only shooting stars break the mold Hey now, you're an all-star, get your game on, go play Hey now, you're a rock star, get the show, on get paid And all that glitters is gold Only shooting stars</p> </div> </div> <div style="background-color: lightgrey; width:1px;"> </div> <!-- page 2b --> <div class="col order-secondary" style="background-image: linear-gradient(to right, #f7f2eb 40%, #E5DFD7); border-radius: 0 0 10px 0; box-shadow: 6px 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <div class="float-left mr-1" style="background-image: url(https://i.imgur.com/L1Pvzrc.png); background-size: contain; background-repeat: no-repeat; background-position: left; height: 130px; width: 100px;"> <br> </div> <p>Well, the years start coming and they don't stop coming Fed to the rules and I hit the ground running Didn't make sense not to live for fun Your brain gets smart but your head gets dumb So much to do, so much to see So what's wrong with taking the back streets? You'll never know if you don't go (go!) You'll never shine if you don't glow</p> <hr style="border-top: 2px dashed black; opacity: 20%;"> <h5><u>Future?</u></h5> <p>Hey now you're an all star keep you game on go play</p> <br> <div class="row"> <div class="col"> <p>you could put some text here if you wanted</p> </div> <div class="col-3 mx-3" style="background-image: url(https://i.imgur.com/33Fey1K.png); background-size: contain; background-position: center; height: 80px; width: 120px;"> <br> </div> </div> </div> </div> </div> </div> <!-- page3 --> <div class="tab-pane p-1 py-2" id="pthree" style="color: #342121; background: #466995; box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="row no-gutters mx-2 justify-content-center"> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4);width: 30px; border-radius: 10px 10px 0 0;">history</div> <div class="col" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">trivia</div> </div> </div> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col mr-1" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">aesthetic</div> <div class="col" style="background: #f7f2eb; box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">relations</div> </div> </div> </div> <!-- pages --> <div class="row mx-2" style="min-height: 500px; position: relative;"> <!-- page 3a --> <div class="col border-secondary" style="background-image: linear-gradient(to right, #f7f2eb 70%, #E5DFD7); box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <!-- moodboard container --> <div> <!-- moodboard --> <div class="row no-gutters"> <!-- 1 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 2 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 3 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <div class="w-100" style="margin-bottom: 8px;"></div> <!-- 4 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 5 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 6 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <div class="w-100" style="margin-bottom: 8px;"></div> <!-- 7 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 8 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> <!-- 9 --> <div class="col"><a href="https://unsplash.com/@monstercritic" target="_blank"> <div class="card" style="background: url(https://images.unsplash.com/photo-1490750967868-88aa4486c946?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80); background-size: cover; background-repeat: no-repeat; background-position: center; width:110px; height:110px;"></div></a></div> </div> </div> <!-- moodboard container end --> <hr style="border-top: 2px dashed black; opacity: 20%;"> <!-- palette --> <div style="display: flex; justify-content: center;"><i class="fas fa-star fa-3x" style="color: #defebc;"></i> <i class="fas fa-star fa-3x" style="color: #a3f89c;"></i> <i class="fas fa-star fa-3x" style="color: #2dee84;"></i> <i class="fas fa-star fa-3x" style="color: #4b434a;"></i> <i class="fas fa-star fa-3x" style="color: #292833;"></i> </div> </div> </div> <div style="background-color: lightgrey; width:1px;"> </div> <!-- page 3b --> <div class="col order-secondary" style="background-image: linear-gradient(to right, #f7f2eb 30%, #E5DFD7); border-radius: 0 0 10px 0; box-shadow: 5px 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <div> <h5>Design notes</h5> <p>wow woohoo here goes the design notes</p> <p>really interesting stuff you know, like, umm</p> <p>you could also put outfits here or something or just objects they carry around a lot like glasses or bags. you should be able to remove columns as you like</p> </div> <hr style="border-top: 2px dashed black; opacity: 20%;"> <div class="container px-2 justify-content-center"> <div class="row no-gutters" style="width: 100%;"> <div class="col" style="background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/33774782_6GdRShZ5hDVE4dD.png); background-repeat: no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center; height: 180px;"> </div> <div class="col mx-2" style="background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/37442412_Mzq1Cw8tWBKSXZ3.png); background-repeat: no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center; height: 180px;"> </div> <div class="col" style="background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/33657417_6V6DXv5B35ypmp3.png); background-repeat: no-repeat; background-size: cover; background-repeat: no-repeat; background-position: center; height: 180px;"> </div> </div> </div> </div> </div> </div> </div> <!-- page4 --> <div class="tab-pane p-1 py-2" id="pfour" style="color: #342121; background: #466995; box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="row no-gutters mx-2 justify-content-center"> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> <br> </div> <div class="col bg-light mr-1" style="box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">aesthetic</div> <div class="col bg-light mr-1" style="box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">history</div> <div class="col bg-light " style="box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0;">trivia</div> </div> </div> <div class="col-6 px-3" style="height:20px;"> <div class="row text-center" style="height:40px;"> <div class="col mr-1" style="width: 32px;"> </div> <div class="col mr-1" style="width: 32px;"> </div> <div class="col mr-1" style="width: 32px;"> </div> <div class="col bg-light" style="box-shadow: 3px 3px 7px -1px rgba(0,0,0,0.4); width: 30px; border-radius: 10px 10px 0 0; border-width: 1px 1px 0 1px; border-color: white;">relations</div> </div> </div> </div> <!-- pages --> <div class="row mx-2" style="min-height: 500px; position: relative;"> <!-- page 4a --> <div class="col border-secondary" style="background-image: linear-gradient(to right, #f7f2eb 60%, #E5DFD7); box-shadow: 0 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <!-- relbox 1 --> <div class="card float-left mx-2" style="background: url(https://f2.toyhou.se/file/f2-toyhou-se/users/admin?6?0); background-size: cover; background-repeat: no-repeat; background-position: center; height:100px; width:100px;"> </div> <div class="px-2"> <p class="m-0"><a class="text-primary" href="#">Name</a> - <span class="text-muted">tagline</span></p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip</p> </div> <!-- end relbox 1 --> <hr style="border-top: 2px dashed black; opacity: 20%;"> <!-- relbox 2 --> <div class="card float-left mx-2" style="background: url(https://f2.toyhou.se/file/f2-toyhou-se/users/admin?6?0); background-size: cover; background-repeat: no-repeat; background-position: center; height:100px; width:100px;"> </div> <div class="px-2"> <p class="m-0"><a class="text-primary" href="#">Name</a> - <span class="text-muted">tagline</span></p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip</p> </div> <!-- end relbox 2 --> <hr style="border-top: 2px dashed black; opacity: 20%;"> </div> </div> <div style="background-color: lightgrey; width:1px;"> </div> <!-- page 4b --> <div class="col order-secondary" style="background-image: linear-gradient(to right, #f7f2eb 20%, #E5DFD7); border-radius: 0 0 10px 0; box-shadow: 4px 6px 8px -1px rgba(0, 0, 0, 0.4);"> <div class="py-3" style="height: 100%; overflow-y: auto; overflow-x: hidden;"> <!-- relbox 3 --> <div class="card float-left mx-2" style="background: url(https://f2.toyhou.se/file/f2-toyhou-se/users/admin?6?0); background-size: cover; background-repeat: no-repeat; background-position: center; height:100px; width:100px;"> <br> </div> <div class="px-2"> <p class="m-0"><a class="text-primary" href="#">Name</a> - <span class="text-muted">tagline</span></p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip</p> </div> <!-- end relbox 3 --> <hr style="border-top: 2px dashed black; opacity: 20%;"> <!-- relbox 4 --> <div class="card float-left mx-2" style="background: url(https://f2.toyhou.se/file/f2-toyhou-se/users/admin?6?0); background-size: cover; background-repeat: no-repeat; background-position: center; height:100px; width:100px;"> </div> <div class="px-2"> <p class="m-0"><a class="text-primary" href="#">Name</a> - <span class="text-muted">tagline</span></p> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip</p> </div> <!-- end relbox 4 --> <hr style="border-top: 2px dashed black; opacity: 20%;"> <div style="background-image: url(https://i.imgur.com/QXUZZ18.png); background-size: contain; background-repeat: no-repeat; background-position: right; height: 60px;"> </div> </div> </div> </div> </div> </div> </div> </div> <!-- made by helliots for karp -->
Botanical
Journal
trivia
history
aesthetic
relations
trivia
history
aesthetic
relations
trivia
history
aesthetic
relations
history
trivia
aesthetic
relations
aesthetic
history
trivia
relations