write a reply

Penguins in Spring

options
quote
Penguins in Spring written Apr 5, 2020 19:19:23 GMT
aliasiceguin
pronounsshe (doesn't mind)
31written posts
iceguinearned bits
offlinecurrently
iceguin
New Member
iceguin Avatar
[newclass=.ppBarBG]--ppBarAccent:#485f91;--ppBarProgress:30%;[/newclass]

[nospaces]
[attr="class","ppBarBG"]
[attr="class","ppBarHead"]

Iceguin

[attr="class","ppProgBar"]



[attr="class","ppBarBG"]
  1. Old Friends
  2. Birds and/or Flowers
  3. Thunderstorms / Rainshowers
  4. Rebirth
  5. Desserts
  6. Quiet or Loud
  7. Friendly Faces
  8. Strength
  9. Memories
  10. Hope



[newclass=".ppBarBG li i"]opacity: 0.5[/newclass]
[newclass=".ppBarBG ol"]text-align: left; list-style-type: upper-roman; margin: 10px 70px[/newclass]
last edit on May 3, 2020 19:19:50 GMT by iceguin
options
quote
Penguins in Spring written Apr 5, 2020 19:36:33 GMT
aliasiceguin
pronounsshe (doesn't mind)
31written posts
iceguinearned bits
offlinecurrently
iceguin
New Member
iceguin Avatar
i. old friends [break]
( link to template )



[nospaces][googlefont=Special+Elite|Quicksand:400,700]
[attr="class","polaroid_memories"]

[attr="class","polaroid"]
[attr="class","name"]
The Optimist
[attr="class","detail"]

[attr="class","summary"]
gender Female

group Orphan

face Emma

alignment LG


Summary I don't know whether you have ever seen a map of a person's mind. Doctors sometimes draw maps of other parts of you, and your own map can become intensely interesting, but catch them trying to draw a map of a child's mind, which is not only confused, but keeps going round all the time.
[break][break]
History There are zigzag lines on it, just like your temperature on a card, and these are probably roads in the island, for the Neverland is always more or less an island, with astonishing splashes of colour here and there, and coral reefs and rakish-looking craft in the offing, and savages and lonely lairs, and gnomes who are mostly tailors, and caves through which a river runs, and princes with six elder brothers, and a hut fast going to decay, and one very small old lady with a hooked nose.
[break][break]


[attr="class","polaroid"]
[attr="class","name"]
The Pragmatist
[attr="class","detail"]

[break][break]
Status: reserved

[break]Summary It would be an easy map if that were all, but there is also first day at school, religion, fathers, the round pond, needle-work, murders, hangings, verbs that take the dative, chocolate pudding day, getting into braces, say ninety-nine, three-pence for pulling out your tooth yourself, and so on, and either these are part of the island or they are another map showing through, and it is all rather confusing, especially as nothing will stand still.
[attr="class","summary"]
gender Male

group Orphan

face Ray

alignment CN




[attr="class","polaroid"]
[attr="class","name"]
The Level Head & Bleeding Heart
[attr="class","detail"]

[attr="class","summary"]
gender Male

group Orphan

face Norman

alignment NG


Status: open!

[break]Summary Of course the Neverlands vary a good deal. John's, for instance, had a lagoon with flamingoes flying over it at which John was shooting, while Michael, who was very small, had a flamingo with lagoons flying over it.
[break][break]
History John lived in a boat turned upside down on the sands, Michael in a wigwam, Wendy in a house of leaves deftly sewn together. John had no friends, Michael had friends at night, Wendy had a pet wolf forsaken by its parents, but on the whole the Neverlands have a family resemblance, and if they stood still in a row you could say of them that they have each other's nose, and so forth.
[break][break]




[newclass=".polaroid_memories"]width: 370px; text-align: center; margin: auto; margin-bottom: 50px; margin-top: 30px;[/newclass]
[newclass=".polaroid"]background: #fff; padding: 1em; padding-bottom: 60px; -webkit-box-shadow: 0 0.2em 0.3em rgba(0, 0, 0, .3); -moz-box-shadow: 0 0.2em 0.3em rgba(0,0,0,.3); box-shadow: 0 0.2em 0.3em rgba(0,0,0,.3); transition: all 0.35s; width: 80%; margin-left: 20%; margin-bottom: -70px; overflow: hidden; transform: scale(0.8, 0.8) rotate(-2deg);[/newclass]
[newclass=".polaroid > .detail"]position: relative;[/newclass]
[newclass=".polaroid > .detail > img"]max-width: 100%; height: auto;[/newclass]
[newclass=".polaroid > .detail > div"]position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow-y: auto; background: rgba(33,33,33,0.8); color: #fff; font: 12px / 14px Quicksand, Calibri, Arial, sans-serif; text-align: justify; z-index: 1; padding: 0rem 1rem 1rem 1rem; opacity: 0; transition: all 0.35s; transition-delay: 0s; scrollbar-color: rgba(255,255,255,0.5) transparent; scrollbar-width: thin;[/newclass]
[newclass=".polaroid:hover > .detail > div"]opacity: 1; transition-delay: 1s;[/newclass]
[newclass=".polaroid:nth-of-type(2n+1)"]margin-left: 0%; transform: scale(0.8, 0.8) rotate(6deg);[/newclass]
[newclass=".polaroid:nth-of-type(2n+3)"]transform: scale(0.8, 0.8) rotate(2deg);[/newclass]
[newclass=".polaroid:nth-of-type(2n+4)"]transform: scale(0.8, 0.8) rotate(-5deg);[/newclass]
[newclass=".polaroid:hover"]filter: none; transform: scale(1, 1) rotate(0deg); -webkit-box-shadow: 0 0.4rem 0.6rem rgba(0, 0, 0, .3); -moz-box-shadow: 0 0.4rem 0.6rem rgba(0,0,0,.3); box-shadow: 0 0.4rem 0.6rem rgba(0,0,0,.3); margin-bottom: -15px;[/newclass]
[newclass=".polaroid > .name"]color:#212121; font: 26px / 0.8em Special Elite, Courier New, Courier, serif; position: absolute; bottom: 0px; left: 0px; right: 0px; height: 55px; text-align: center; display: flex; justify-content: center; align-items: center;[/newclass]
[newclass=".detail .summary"]display: flex; justify-content: space-evenly; align-items: center[/newclass]
[newclass=".detail .summary h6"]font-size: 10px; text-align: center; font-weight: normal; margin: 20px 0px; flex-grow: 1; flex-basis: 1rem;[/newclass]
[newclass=".detail .summary h6 b"]display: block; text-transform: uppercase; font-size: 8px; letter-spacing: 1px;[/newclass]
[newclass=".detail > div > b"]display: inline-block; text-transform: uppercase; font-size: 8px; line-height: 8px; padding: 5px; letter-spacing: 1px; border: 2px solid; float: left; margin-right: 5px; clear: both; margin-top: 3px;[/newclass]
[newclass=".detail > div > h5"]text-transform: uppercase; font-size: 10px; text-align: center; margin: 0; margin-bottom: 3px; line-height: 14px; position: relative; vertical-align: middle;[/newclass]
[newclass=".detail > div > h5:before, .detail > div > h5:after"]content: ''; display: inline-block; border: 2px solid; width: 3px; height: 14px; margin-top: -1px; vertical-align: middle;[/newclass]
[newclass=".detail > div > h5:before"]border-right-width: 0px; margin-right: 10px;[/newclass]
[newclass=".detail > div > h5:after"]border-left-width: 0px; margin-left: 10px;[/newclass]
[newclass="::-webkit-scrollbar"]width: 7px; background: transparent;[/newclass]
[newclass="::-webkit-scrollbar-thumb"]background: rgba(255,255,255,0.5);[/newclass]
last edit on Apr 5, 2020 19:36:59 GMT by iceguin
options
quote
Penguins in Spring written May 1, 2020 2:33:28 GMT
aliasiceguin
pronounsshe (doesn't mind)
31written posts
iceguinearned bits
offlinecurrently
iceguin
New Member
iceguin Avatar
ii. birds and/or flowers [break]
the official template post for this bestiary is a w.i.p. as I work out some of the details on this code-monster



[nospaces][break]
[attr="class","bestiarywrap"]
[attr="class","bestiary"]
[attr="class","sidebanner"]

[attr="class","listreveal"]

[PTabbedContent]

[PTab=Avion]
[attr="class","creaturecontent"]

[attr="class","quote"]It casts a colossal shadow across a misty lake... as it soars through the sky...To reach it is no easy task...

Avion


the fifth colossus


[attr="class","imgoverlay"]
[attr="class","bottomright caption"]fig 01. a wanderer's sketch of Avion's lair


[break]Avion is directly east of the shrine, as the sword indicates. Just head east as the cliffside path becomes narrow. When it widens again, the colossus' lair is close.
[attr="class","imgoverlay"]
[attr="class","bottomleft caption"]fig 02. An illustration of the weakpoints of Avion, on the tips of both its wings and the end of its tail.



[/PTab]


[PTab=Boobrie]
[attr="class","creaturecontent"]

Boobrie


shapeshifter of Scottish folklore



[break]A giant, ferocious bird that lives near the water's edge and mercilessly devours any who approach. It's rumoured to transform into a horse and gallop across the water.

[/PTab]


[PTab=Chocobo]

[attr="class","creaturecontent"]

Chocobo




A breed of flightless birds, characterized by their yellow feathers, distinct odor, and the unforgettable chirp, "kweh!" Domesticated for their gentle nature and quick feet, they are often used as a mode of ground transportation.
[break][break]
What creature, fair or foul, has affected the lives of the common man more than the noble chocobo? Though the yellow chocobo is by far the most common, and the only domesticable sort, many other wild breeds of differing hues have been identified. In general, the other colorations of chocobo tend to be quite violent, giving rise to the saying: "Yellow, best for riding; aught else, best be hiding."
[break][break]
Even as tame chocobos are known for their temper, true domestication requires time and expertise. Their curiosity can often get them into trouble, but they are charming nevertheless, and popular throughout Ivalice. As famed naturalist Merlose once wrote: "a little personality goeth a long way."



[/PTab]


[PTab=Eagle]
[attr="class","creaturecontent"]

Eagle




[break]Eagles are large birds of prey primarily found across the globe and are classified under the bird family Accipitridae.
[break][break]
Eagles play an important role to the Assassin Brotherhood, in that many of the Order's outfits and weapons bear resemblance to eagles in their details, and the birds tend to perch on the Viewpoints which the Assassins use to navigate their surroundings and perform Leaps of Faith from. In this regard, the Assassins dubbed the sixth sense that belonged to some of their members as "Eagle Vision".

[/PTab]


[PTab=Flut Flut]
[attr="class","creaturecontent"]

Flut Flut




[break]The flut flut is a rather large bird, somewhat resembling, in shape, to an ostrich, and its later Jak 3 equivalent, the leaper lizard. It has a round head, two very large eyes, a combination of both a beak and a mouth, two relatively small feathered arms used for gliding, hooved feet, and a long bony tail with a prominent, vibrant tail fan.
[break][break]
The flut flut has two main attacks, a charge attack where it will headbutt forward, and an aerial attack, where while air-borne, will charge down with its claws releasing a purple-colored cloud.
[break][break]
Due to the flut flut's large legs, it has incredible jumping power, coupled with its wings which it uses for gliding long distances.

[/PTab]


[PTab=Giant Crow]
[attr="class","creaturecontent"]


[break]

Giant Crow


The Giant Crow is a mysterious entity that transports the Chosen Undead from the end of the Undead Asylum to Firelink Shrine in Lordran.

[/PTab]


[PTab=Griffin]
[attr="class","creaturecontent"]

The griffin looks like a combination of a ferocious cat and a giant bird. It usually inhabits primeval highlands and builds its nests on unreachable mountain summits. The griffin preys on large mammals and, being a highly territorial creature, fiercely defends its hunting grounds. When the first colonists appeared and trade routes expanded, griffins were known to attack settlers and merchants in defense of their territory. Griffins are tough opponents and their strength should not be underestimated. Obstinate and aggressive, they make deadly use of their ability to fly during combat, swooping down on their enemies, knocking them to the ground and ripping them to shreds with their claws and beak.
[break]

[/PTab]


[PTab=The Hierophant]
[attr="class","creaturecontent"]

[break][break]
[attr="class","quote"]
Transcendence faith immortality / in mortality
[break]Rifts crafted, dangerous potential
[break]A foundation for faith & violence
[break]A loss of self, a narrow path traveled
[break]--Extracts from the Monoliths



[/PTab]


[PTab=Sand Vulture]
[attr="class","creaturecontent"]

Sand Vulture


The bird cage of Azad was famed throughout Persia, often described as one of the wonders of the world. However, not even the Sultan's cherished bird collection escaped transformation by the Sands of Time.
[break]

[/PTab]

[PTab=The Shrieker]
[attr="class","creaturecontent"]



Deep within the heart of the Weald stands a gigantic tree that towers above all other trees, and hidden within the gnarled and twisted branches of this tree is the Shrieker's Nest. Like the Noble Raven depicted on our family’s Coat of Arms, this poor creature has seen better days, for the corruption that plagues the estate has twisted this feathered bird into a feathered fiend. Despite being corrupted, this feathered fiend is still a Raven at heart and has an eye for everything that glitters and shines. The Nest of the Shrieker is decorated with all the shiny and glittering Trinkets it has stolen from our Trinkets Chest or taken from the dead bodies of our fallen heroes. Reclaiming these items will not be easy, for the Shrieker will defend its Nest from any intruders. But if Shrieker feels that it is not worth its life to protect his hoard of treasures, it will abandon its nest and escape to live another day, free to steal more of our rare and valuable Trinkets.

[/PTab]


[PTab=Suzaku]
[attr="class","creaturecontent"]

Suzaku



The Zhu Que (朱雀) Vermilion Bird is one of the Four Symbols of the Chinese constellations (Si Xiang) along with White Tiger, Xuanwu and Azure Dragon. According to Wu Xing, the Taoist five-elemental system, it represents the fire element, the direction south and the season summer correspondingly. Thus, it is sometimes called the Vermilion Bird of the South and it is also known as Suzaku in Japan and Jujak in Korea. Occasionally confused with Feng Huang, although this confusion does make some sense when one is aware that non-Han variations of the Four Symbols consider the Feng Huang and the Suzaku as the same creature. Suzaku is an elegant and noble bird in both appearance and behavior, it is very selective in what it eats and where it perches, with its feathers in many different hues of Vermilion.

[/PTab]


[/PTabbedContent={tabs: side; tabvalign: top; tabgap: 0; }]



[newclass=".bestiary h1, .bestiary h2, .bestiary h3, .bestiary h4, .bestiary h5, .bestiary h6"]margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;[/newclass]
[newclass=".bestiary"]height: 430px; position: relative; background-color: #F5E8DA; color: #3D302D; overflow: hidden; border: 1px solid #3D302D; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;[/newclass]
[newclass=".bestiarywrap"]display: block; margin: auto; width: 550px; position: relative; background-color: #BD8B75; padding: 4px; border: 1px solid #3D302D;[/newclass]
[newclass=".bestiary *"]box-sizing: border-box;[/newclass]
[newclass=".bestiary .sidebanner"]position: absolute; z-index: 3; top: 0px; bottom: 0px; left: 0px; width: 120px; background-image: url('https://i.imgur.com/c7pzeOw.png'); background-size: cover; background-position: center; border-right: 5px solid #BD8B75;[/newclass]
[newclass=".bestiary .sidebanner::before"]content: ''; background-color: #EB9249; opacity: 0.4; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0;[/newclass]
[newclass=".bestiary .sidebanner::after"]content: ''; position: absolute; display: block; top: 10px; left: 10px; bottom: 10px; right: -5px; border: 2px dotted #F5E8DA; border-right-width: 0px;[/newclass]
[newclass=".bestiary h1"]font: bold 28px / 18px Crimson Text, Times, serif; text-align:left; z-index:1; font-variant: small-caps; text-align: right; opacity: 0.93;[/newclass]
[newclass=".bestiary h2"]font: 10px Montserrat, Arial, sans-serif; text-transform: uppercase; text-align: right; opacity: 0.6; letter-spacing: 0.5px;[/newclass]
[newclass=".bestiary .creaturecontent"]position: absolute; top: 0px; bottom: 0px; right: 0px; width: 100%; padding: 20px; overflow-y: auto; font: 12px / 1.4em Open Sans, Arial, sans-serif; text-align: justify; scrollbar-width: thin; scrollbar-color: #BD8B75 transparent;[/newclass]
[newclass=".bestiary .creaturecontent::after"]content: '';display: block;height: 15px;[/newclass]
[newclass=".bestiary .listreveal"]position: absolute; z-index: 4; transform: rotate(-45deg); transform-origin: 50% 50%; background-color: #BD8B75; width: 30px; height: 30px; border-radius: 4px; border: 2px solid #F5E8DA; left: 105px; top: 20%; color: #F5E8DA;[/newclass]
[newclass=".bestiary .listreveal::before"]content: '+'; display:block; transform: rotate(45deg); transform-origin: 50% 50%; font: bold 26px / 28px Montserrat, Arial, sans-serif; line-height: 28px; text-align: center;[/newclass]
[newclass=".bestiary .creaturecontent b img"]box-shadow: 1px 2px 4px #3D302D;[/newclass]
[newclass="table.PT_table"]border: none;[/newclass]
[newclass=".bestiary .listreveal + table .PT_Tabs_holder"]position: absolute; width: 430px !important; top: 0; bottom: 0; right: 430px; transition: 0.4s all; margin: 0px; opacity: 0.8; z-index: 2; display: block; overflow-y: auto; background-color: #F5E8DA; scrollbar-width: thin; scrollbar-color: #BD8B75 transparent;[/newclass]
[newclass=".bestiary .listreveal:hover + table .PT_Tabs_holder, .PT_Tabs_holder:hover"]opacity: 1!important; right: 0px!important;[/newclass]
[newclass=".bestiary .PT_spots"]position: absolute !important; z-index: 1; top: 0px; left: 120px; right: 0px; bottom: 0px; background-color: transparent;[/newclass]

[newclass=".bestiary .quote"]quotes: '\201c' '\201d'; position: relative; font-family: Crimson Text; font-style: italic; font-size: 18px; line-height: 1em; width: 80%; margin: auto; text-indent: 25px; text-align: left;[/newclass]
[newclass=".bestiary .quote::before"]content: open-quote; top: 0px; left: -5px; position: absolute; font-size: 80px; line-height: 40px; display: block; color: #fff; z-index: -1; font-style: normal;[/newclass]
[newclass=".bestiary .caption"]font: 10px Open Sans, Arial, sans-serif; letter-spacing: 0.5px;[/newclass]
[newclass=".bestiary .caption i"]font: italic bold 1.4em Crimson Text, Times, serif;[/newclass]

[newclass=".bestiary .imgoverlay"]position:relative; line-height: 0;[/newclass]
[newclass=".bestiary .bottomright"]position: absolute; bottom: 5px; right: 5px; text-align: right;[/newclass]
[newclass=".bestiary .bottomleft"]position: absolute; bottom: 5px; left: 5px; text-align: left;[/newclass]
[newclass=".bestiary .topright"]position: absolute; top: 5px; right: 5px; text-align: right;[/newclass]
[newclass=".bestiary .topleft"]position: absolute; top: 5px; left: 5px; text-align: left;[/newclass]

[newclass="nullelem"]} .bestiary td[class^="PT_tabs"] { font: 18px / 28px Crimson Text, Times, serif; text-transform: uppercase; transition: 0.4s all; cursor: pointer; [/newclass]
[newclass=".bestiary .PT_tabs_selected"]background-color: transparent; opacity: 0.6;[/newclass]
[newclass=".bestiary .PT_tabs_selected_hover"]background-color: #BD8B75;[/newclass]
[newclass=".bestiary .PT_tabs_hover"]background-color: #BD8B75;[/newclass]
[newclass=".bestiary .PT_Tabs_holder"]counter-reset: best-numerals;[/newclass]
[newclass=".bestiary .PT_Tabs_holder td"]counter-increment: best-numerals; width: 430px; text-align: left; padding: 4px 30px !important[/newclass]
[newclass=".bestiary .PT_Tabs_holder td::before"]content: counter(best-numerals, upper-roman); display: inline-block; border: 2px solid; min-width: 28px; text-align: center; margin-right: 5px;[/newclass]


[newclass=".bestiary .creaturecontent::-webkit-scrollbar, .PT_Tabs_holder::-webkit-scrollbar"]width: 10px; border: none; background-color: transparent;[/newclass]
[newclass=".bestiary .creaturecontent::-webkit-scrollbar-track, .PT_Tabs_holder::-webkit-scrollbar-track"]background: transparent;[/newclass]
[newclass=".bestiary .creaturecontent::-webkit-scrollbar-thumb, .PT_Tabs_holder::-webkit-scrollbar-thumb"]background-color: #BD8B75; border-radius: 20px; border: 2px solid #F5E8DA;[/newclass]

[googlefont=Crimson+Text:400,400italic,700,700italic|Montserrat|Open+Sans:400,700]
last edit on Sept 4, 2023 18:47:47 GMT by iceguin
options
quote
Penguins in Spring written May 3, 2020 19:25:16 GMT
aliasiceguin
pronounsshe (doesn't mind)
31written posts
iceguinearned bits
offlinecurrently
iceguin
New Member
iceguin Avatar
iii. thunderstorms / rainshowers [break]
so this app template is also not getting posted in the template board right away because I need to consolidate a whole lot of hard-coded colors to make it easilly editable 8')

[break]

[nospaces]
[attr="class","in-the-rain"]
[attr="class","texture"]
[attr="class","hues"]

[PTabbedContent][PTab=X]
[attr="class","covercontent"]

Raziel of the Autumn Court
Head merchant of the Golden Coast


Played by Iceguin



[/PTab][PTab=+]
[attr="class","appcontent"]

[attr="class","appimg"]

[b]LAST EXILE,[/b] Dio Eraclea @tag


[attr="class","summary"]

gender unidentified


age limitless


sexuality asexual


faction the autumn court


occupation appropriator of wealth




[attr="class","smaller approw"]

the person


[attr="class","smaller listbox"]


Positive Traits


trait 1

trait 2

trait 3


Negative Traits


trait 1

trait 2, but a bit longer

trait 3


Likes


trait 1

trait 2

trait 3


Dislikes


trait 1

trait 2

trait 3



[attr="class","freeform"]

Personality



mercilessempathetic


ineptcapable


untrustworthyloyal



A certain king had a beautiful garden, and in the garden stood a tree which bore golden apples. These apples were always counted, and about the time when they began to grow ripe it was found that every night one of them was gone. The king became very angry at this, and ordered the gardener to keep watch all night under the tree. The gardener set his eldest son to watch; but about twelve o’clock he fell asleep, and in the morning another of the apples was missing.



[attr="class","approw"]

their story


[attr="class","freeform"]

The Watch

Then the second son was ordered to watch; and at midnight he too fell asleep, and in the morning another apple was gone. Then the third son offered to keep watch; but the gardener at first would not let him, for fear some harm should come to him: however, at last he consented, and the young man laid himself under the tree to watch.

The Thief

As the clock struck twelve he heard a rustling noise in the air, and a bird came flying that was of pure gold; and as it was snapping at one of the apples with its beak, the gardener’s son jumped up and shot an arrow at it. But the arrow did the bird no harm; only it dropped a golden feather from its tail, and then flew away. The golden feather was brought to the king in the morning, and all the council was called together. Everyone agreed that it was worth more than all the wealth of the kingdom: but the king said, ‘One feather is of no use to me, I must have the whole bird.’




[/PTab][/PTabbedContent={tabs: side; tabvalign: top; tabgap: 0; }]


[newclass=".in-the-rain"]box-sizing: border-box; width: 450px; height: 562px; margin: auto; background: #0F2027; color: #f3f3f3; border: 1px solid rgb(15, 32, 39); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow: hidden; font: 400 12px / 1.3em Jost, Arial, sans-serif;[/newclass]
[newclass=".in-the-rain h1, .in-the-rain h2, .in-the-rain h3, .in-the-rain h4, .in-the-rain h5, .in-the-rain h6"]margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;[/newclass]
[newclass=".in-the-rain *"]box-sizing: border-box;[/newclass]
[newclass=".in-the-rain .hues"]position:relative; display: flex; justify-content: center; align-items: center; z-index:0; height:100%; background: linear-gradient(340deg, rgba(15, 32, 39, 0.92), rgba(32, 58, 67, 0.92), rgba(44, 83, 100, 0.92));[/newclass]
[newclass=".in-the-rain .texture"]height:100%; background-image: url('https://i.imgur.com/SMUV4RR.jpg');[/newclass]
[newclass=".in-the-rain .covercontent"]position: relative; width: 200px; height: 250px; color: #f3f3f3; border: 1px solid #f3f3f3; padding: 16px; background-color: rgba(243, 243, 243,0.03); box-shadow: 2px 2px 3px rgba(15, 32, 39, 0.6), inset 2px 2px 3px rgba(15, 32, 39, 0.6); display: flex; justify-content: space-evenly; align-items: center; flex-direction: column;[/newclass]
[newclass=".in-the-rain .covercontent h1"]font: 500 28px / 0.85em Playfair Display, Times, serif; word-break: break-word; text-align: left; text-shadow: 1px 2px .06em rgb(15, 32, 39);[/newclass]
[newclass=".in-the-rain .covercontent h1 b"]display: block; margin-top: 12px; font: 400 10px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; width: 80%; opacity: 0.8;[/newclass]
[newclass=".in-the-rain .covercontent h1::after"]content: ''; display: block; position: absolute; left:20%; right: 20%; height: 2px; background-color: rgb(15, 32, 39); margin-top: 12px;[/newclass]
[newclass=".in-the-rain .covercontent h2"]font: 400 10px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; margin-left:20%; width: 80%; text-align: right; opacity: 0.8; text-shadow: 2px 2px 3px rgb(15, 32, 39);[/newclass]

[newclass=".in-the-rain .appcontent"]position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; justify-content: space-evenly; padding: 20px; padding-top: 110px;[/newclass]
[newclass=".in-the-rain .appcontent .appimg"]border-radius: 100%; position: absolute; top: 10px; right: 10px; right: 40px; width: 100px; height: 100px; background-size: cover;[/newclass]
[newclass=".in-the-rain .appcontent .appimg::before, .in-the-rain .appcontent .appimg::after"]content: ''; display: block; position: absolute; border: 10px solid rgb(243, 243, 243); border-radius: 100%; pointer-events: none;[/newclass]
[newclass=".in-the-rain .appcontent .appimg::before"]top: -20px; bottom: -20px; left: -20px; right: -20px; border-width: 10px; opacity: 0.2;[/newclass]
[newclass=".in-the-rain .appcontent .appimg::after"]top: -80px; bottom: -80px; left: -80px; right: -80px; border-width: 30px; opacity: 0.1;[/newclass]
[newclass=".in-the-rain .appcontent .appimg > *"]display: block; border-radius: 100%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display: flex; justify-content: center; align-items: center; font: 400 10px / 1em Jost, Arial, sans-serif !important; padding: 10px; background-color: rgba(15, 32, 39, 0.82); opacity: 0;[/newclass]
[newclass=".in-the-rain .appcontent .appimg > *:hover"]opacity: 1;[/newclass]
[newclass=".in-the-rain .appcontent .summary"]margin-top: 20px; display: flex; justify-content: space-evenly; align-items: center; right: 130px; position: absolute; left: 0; top: 0; flex-wrap: wrap; padding: 0px 20px; height: 70px;[/newclass]
[newclass=".in-the-rain .appcontent .summary h3"]text-align: center; flex-basis: 26%; flex-grow: 1; margin-top: 7px; line-height: 1em;[/newclass]
[newclass=".in-the-rain .appcontent .summary h3 b"]display: block; font: 700 10px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: .5px;[/newclass]
[newclass=".in-the-rain .appcontent .approw"]display: flex; flex-grow: 3; margin-top: 10px;[/newclass]
[newclass=".in-the-rain .appcontent .approw > *"]margin-left: 10px;[/newclass]
[newclass=".in-the-rain .appcontent .approw > *:first-child"]margin-left: 0px;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div"]background-color: rgba(32, 58, 67, 0.6); flex-grow: 3; position: relative; font-family: Open Sans, Arial, sans-serif; font-size: 11px; line-height: 1.2em;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div > div"]position: absolute; top: 0; bottom: 0; left: 0; right: 0; padding: 15px; overflow-y: auto; text-align: justify; scrollbar-color: rgba(243, 243, 243,0.2) transparent; scrollbar-width: thin;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div > div::-webkit-scrollbar"]width: 6px; border: none; background-color: transparent;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div > div::-webkit-scrollbar-track"]background: transparent;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div > div::-webkit-scrollbar-thumb"]background-color: rgba(243, 243, 243,0.2); border-radius: 20px;[/newclass]
[newclass=".in-the-rain .appcontent .approw > div > div::after"]content: ''; display: block; height: 15px;[/newclass]
[newclass=".in-the-rain .appcontent .approw > h1"]width: 35px; position: relative; border-right: 2px solid rgb(15, 32, 39);[/newclass]
[newclass=".in-the-rain .appcontent .approw > h1 b"]transform: rotate(-90deg); transform: rotate(-90deg); display: block; position: absolute; bottom: 15px; left: 25px; transform-origin: bottom left; white-space: nowrap; font: 400 12px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; opacity: 0.6;[/newclass]
[newclass=".in-the-rain .smaller"]flex-grow: 2!important;[/newclass]
[newclass=".in-the-rain .approw h2"]font: 700 10px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: .5px; color: #85a2a7; padding: 5px;[/newclass]
[newclass=".in-the-rain .approw h2:first-child"]padding-top: 0;[/newclass]
[newclass=".in-the-rain .approw h4]position: relative; border-bottom: 4px solid rgba(15, 32, 39); display: flex; justify-content: space-between; margin-bottom: 5px;[/newclass]
[newclass=".in-the-rain .approw h4 b"]display: inline-block; font: 400 10px / 1em Jost, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; opacity: 0.8; text-align: right;[/newclass]
[newclass=".in-the-rain .approw h4 > div"]position: absolute; display: block; left: 0; bottom: -4px; height: 4px; background-color: #f3f3f3;[/newclass]
[newclass=".in-the-rain .approw h6]margin-bottom: 2px;[/newclass]
[newclass=".in-the-rain .approw h6::before]content: '+'; color: #85a2a7; font-weight: 700; margin-right: 3px;[/newclass]
[newclass=".in-the-rain hr"]border: none; border-bottom: 2px solid rgb(15, 32, 39); width: 40%; margin: 10px auto 5px auto;[/newclass]

[newclass=".in-the-rain .PT_Tabs_holder i"]position: absolute; top: 0; right: 0; z-index: 1; font-style: normal; width: 30px; line-height: 30px; text-align: center; font-weight: bold; font-size: 10px; border-radius: 4px; margin: 3px; background-color: rgb(32, 58, 67);[/newclass]
[newclass=".in-the-rain .PT_Tabs_holder b"]position: absolute; right: 100px; top: 250px; height: 50px; width: 50px; border-radius: 100%; background: #f3f3f3; color: rgb(32, 58, 67); text-align:center; box-shadow: 1px 1px 5px 0 rgba(15, 32, 39, 0.25); z-index: 1; transition: 0.4s transform;[/newclass]
[newclass=".in-the-rain .PT_tabs b:hover, .in-the-rain .PT_tabs_hover b:hover"]cursor: pointer; transform: rotate(90deg);[/newclass]
[newclass=".in-the-rain .PT_tabs b::after, .in-the-rain .PT_tabs_hover b::after"]content: ""; opacity: 0; position: absolute; top: 0px; left: 0px; right: 0; bottom: 0; border: 4px solid rgba(243, 243, 243, 0.6); border-radius: 100%; animation-name: ripple; animation-duration: 3s; animation-delay: 0s; animation-iteration-count: infinite; animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1); z-index: -1;[/newclass]
[newclass=".in-the-rain .PT_tabs b::before, .in-the-rain .PT_tabs_hover b::before"]opacity: 0; position: absolute; top: 0px; left: 0px; right: 0; bottom: 0; content: ""; border: 4px solid rgba(243, 243, 243, 0.3); border-radius: 100%; animation-name: ripple; animation-duration: 3s; animation-delay: 0.6s; animation-iteration-count: infinite; animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1); z-index: -1;[/newclass]
[newclass="nullelem"]} @keyframes ripple { from { opacity: 1; transform: scale3d(0.9, .9, 1); } to { opacity: 0; transform: scale3d(1.6, 1.6, 1); } [/newclass]

[newclass=".in-the-rain .PT_spots"]background-color: transparent; z-index: -1; display: flex!important; justify-content: center; align-items: center; position: absolute!important; top: 0px; left: 0px; bottom: 0px; right: 0px; transition: 0.6s all ease 0s;[/newclass]
[newclass="nullelem"]} .in-the-rain td[class^="PT_tabs"] { font: 400 30px / 46px Jost, Arial, sans-serif; text-transform: uppercase; transition: 0.4s all; cursor: pointer; } .in-the-rain td[class^="PT_tabs"] *, .in-the-rain div[class^="PT_spots"] * { transition: 0.6s all ease 0s; } .in-the-rain td[class*="PT_tabs_selected"] { opacity: 0; pointer-events: none; cursor: auto; } .in-the-rain div.PT_spots[style*="none"] { opacity: 0; pointer-events: none; left: -450px!important; right: 450px!important;[/newclass]
[newclass=".in-the-rain table.PT_table"]border: none;[/newclass]
[newclass=".in-the-rain .PT_table > tbody > tr > td:first-of-type"]width:0px !important;[/newclass]
[newclass=".in-the-rain table.PT_table tbody td"]padding: 0px;[/newclass]


[googlefont=Jost:400,700|Playfair+Display:500|Open+Sans:400,700]
last edit on May 3, 2020 22:18:57 GMT by iceguin
Reply