raziya type race code

[sc=bg][sc=ch][br][br][br][/sc][sc=b]
[sc=title]THIS IS A TITLE![/sc]
[sc=sub][img]https://i.imgur.com/7ifXTPW.gif[/img]a type race lead by Raziya[img]https://i.imgur.com/7ifXTPW.gif[/img][/sc]
[hr]
[sc=dialogue][sc=icon][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Joyous.png[/img][/sc][sc=textbox][color=#8080F8]RAZI:[/color] this is some testing text! some words of encouragement or something welcoming! up to three lines (4 on mobile)[/sc][/sc]
[sc=tabbed_interface horizontal]
[ul]
[li]intro[/li]
[li]members[/li]
[li]egg chart[/li]
[li]items & pairs[/li]
[li]showcase[/li]
[li]mascots[/li]
[li]tips & tricks[/li]
[/ul][
][sc=tab-active]intro post! also some testing text and bbcode stuff
[b]bold[/b] | [i]italics[/i] | [u]underline[/u] | [tip=hello world!]tooltip[/tip] | [url=https://www.youtube.com/watch?v=w8j17QJZxEo]link[/url]
[progress=80/100]progress[/progress]
[display=display panel]hi[/display]
[hide=hidebox]hello[/hide][/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] members tab! includes a table of all our beloved members![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Inspired.png[/img][/sc]
[table]
[tr]
 [th=2x1]user[/th]
 [th=2x1]hunt[/th]
[/tr]
[tr]
 [td=2x1]username[/td]
 [td=2x1][pkmn=][/td]
[/tr]
[tr]
  [td=2x1]username[/td]
 [td=2x1][pkmn=][/td]
[/tr]
[/table][/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] egg chart for this type race![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Shouting.png[/img][/sc]
egg chart goes here![/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] available items and pairs provided by our teammates![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Happy.png[/img][/sc]
[table]
[tr]
[th=3x1]user[/th]
[th=3x1]pairs[/th]
[th=3x1]items[/th]
[/tr]
[tr]
[td=3x1]username[/td]
[td=3x1]pairs[/td]
[td=3x1]items[/td]
[/tr]
[tr]
[td=3x1]username[/td]
[td=3x1]pairs[/td]
[td=3x1]item[/td]
[/tr]
[/table][/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] our hatched specials![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Surprised.png[/img][/sc]
hatched specials![/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] our mascots that will lead us this type race![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Determined.png[/img][/sc]
mascots yay[/sc][

][sc=tab][sc=tt][color=#8080F8]RAZI:[/color] tips, tricks and other linkie dinkies to help you this type race![/sc][sc=it][img]https://raw.githubusercontent.com/PMDCollab/SpriteCollab/master/portrait/0012/0000/0001/Worried.png[/img][/sc]
any tips, tricks and resources here[/sc][/sc]
[/sc][sc=che][br][br][br][/sc][sc=credit][pit="[img]https://i.ibb.co/yWFDY75/shiny-gigantamax-butterfree.gif[/img]"]code by [url=https://pfq.link/@J3dF]union[/url], for [url=https://pfq.link/@J-Vg]raziya's[/url] use only
→ shiny butterfree sprites from [url=https://sprites.pmdcollab.org/]pmd sprite repository[/url]
→ shiny gigantamax butterfree sprite icon by union
→ official butterfree background and hgss sprites used
→ checkered dividers by [url=https://www.tumblr.com/selysie/772273199883878400/%F0%9D%9C%97%E0%AD%A7-%F0%93%88%92-texture-dividers-%E3%85%A4?source=share]selysie[/url]
→ kanto gym badge divider by [url=https://www.tumblr.com/saradika-graphics/746856099275309056/hi-i-dunno-if-you-already-did-some-of-them-but?source=share]saradika-graphics[/url][/pit][/sc][/sc]

[style]

@font-face {
font-family: PMD;
src: url(https://static.tumblr.com/h6qd8ql/azlorriwa/pokemon-md-full-version.woff);
font-weight: normal;
font-style: normal;
}

@font-face {
  font-family: 'Modak';
  src: url(https://fonts.gstatic.com/s/modak/v20/EJRYQgs1XtIEskMA-hQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Cal Sans';
  src: url(https://fonts.gstatic.com/s/calsans/v1/fdN99sWUv3gWqXxqqRBctFs.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

hr {
    border-style: none;
    border-width: 0px;
    margin-top: -10px;
    margin-bottom: -10px;
}

hr:after {
    display: flex;
    background-color: none;
    content: url(https://i.imgur.com/6Fm2vru.png);
    justify-content: center;
    filter: hue-rotate(-25deg);
}

.bg {
background-image: url("https://i.imgur.com/yYIwqzU.png");
background-size: 100% auto;
padding: 5px;
}

.ch {
background-image: url("https://64.media.tumblr.com/cba0b1c5d0743c39b50c1286527decc4/4bd9f0e88cc96821-3d/s2048x3072/7ef22e2a2bbda19c1aca89f4334267de332ac4f0.pnj");
background-size: 100% auto;
background-repeat: no-repeat;
position: relative;
bottom: 5px;
z-index: 3;
}

.b {
background-color: #00000050;
border: 2px solid #504185;
position: relative;
z-index: 2;
margin-top: -30px;
}

.title {
font-family: 'Modak';
font-size: 3.5em;
color: #f9e9ea;
text-align: center;
text-shadow: -1.5px 0 #6e667e, 0 1.5px #6e667e, 1.5px 0 #6e667e, 0 -1.5px #6e667e;
line-height: 0.8;
margin-top: -10px;
}

.sub {
font-family: 'Cal Sans';
text-align: center;
color: #f9e9ea;
text-shadow: 0px 0px 5px #000;
font-size: 1.2em;
margin-top: -35px;
}

.dialogue {
width: 95%;
border: 2px solid #333333;
background-color: #f9e9ea90;
margin: auto;
padding: 5px;
padding-top: 10px;
padding-bottom: 0px;
}

.icon {
width: 110px;
height: 110px;
border: 2px solid #333333;
box-shadow: 0px 0px 5px #000;
display: inline-block;

@media only screen and (max-width: 1024px) {
width: 90px;
height: 90px;
}

img {
width: 110px;
}
}

.it {
width: 110px;
height: 110px;
border: 2px solid #333333;
position: relative;
bottom: 339px;
right: 7px;
margin-bottom: -246px;

@media only screen and (max-width: 460px) {
width: 90px;
height: 90px;
bottom: 308.5px;
right: 13px;
margin-bottom: -216px;
}

@media only screen and (max-width: 493px) {
bottom: 311px;
}

img {
width: 110px;
}
}

.textbox {
font-family: PMD;
width: 76%;
margin-left: 5px;
display: inline-block;
border: 2px solid #333333;
background-color: #f9e9ea;
box-shadow: 0px 0px 5px #000;
height: 100px;
padding: 5px;
font-size: 30px;
color: #000;
position: relative;
bottom: 10px;

@media only screen and (max-width: 1024px) {
width: 67%;
height: 90px;
font-size: 20px;
bottom: 5px;
}
}

.tt {
font-family: PMD;
width: 78%;
display: inline-block;
text-align: left;
margin-left: 5px;
border: 2px solid #333333;
background-color: #f9e9ea;
height: 100px;
padding: 5px;
font-size: 30px;
color: #000;
position: relative;
bottom: 226px;
left: 56px;

@media only screen and (max-width: 1024px) {
width: 72.3%;
height: 90px;
font-size: 20px;
bottom: 212.7px;
left: 46px;
}

@media only screen and (max-width: 493px) {
bottom: 214.5px;
}
}

.tabbed_interface>ul {
background: none;
margin-top: -30px;
margin-left: 5px;
margin-right: 5px;
}

.tabbed_interface>ul li {
cursor: pointer;
font-family: 'Cal Sans';
margin-top: 5px;
text-align: center;
margin-left: 5px;
padding: 5px;
border: 2px solid #333333;
background-color: #f9e9ea;
color: #000;
transition: .3s;
}

.tabbed_interface>ul>li.tab-active {
border: 2px solid #ff9fa3;
background: #796580;
color: #78bb74;
text-decoration: underline double;
}

.tabbed_interface>div  {
font-family: 'Cal Sans';
margin-left: 10px;
margin-right: 10px;
margin-top: 10px;
border: 2px solid #333333;
background-color: #f9e9ea;
text-align: center;
padding: 10px;
color: #000;
box-shadow: 0px 0px 5px #000;
}

a {
color: #000;
}

table {
    margin: auto;
    width: 100%;
    border: none;
    border-collapse: separate;
    th, td {
        text-align: center;
        padding: 3px;
        border-radius: 0px;
        border: 2px solid #3d2241;
        font-weight: normal;
        }
    th {
        background-color: #81e47a;
        color: #000;
        }
    td {
        background-color: #8d73a0;
        color: #fff;
        }
        }

div.tooltip_content {
    padding: 5px;
    width: auto;
    background-color: #f9e9ea;
    color: #000;
    border: 2px solid #3d2241;
    border-radius: 0px;
    font-size: 16px;
    box-shadow: 0px 0px 3px #000;
}

div.tooltip_content:before {
content: url("https://textbox.skytemple.org/assets/Icons/Text%20Bubble.png");
margin-right: 5px;
}

.bbcode_tooltip {
    border-bottom: 1px dotted #000;
    cursor: help;
}

.expbar {
    background: none;
    border-radius: 0px;
    border: 4px double #3d2241;
    color: #fff;
    >span {
    font-size: 16px;
    font-weight: normal;
    padding: 2px;
    }
    >div {
    margin: 3px;
    background: #796580;
    border-right: 1px solid #796580;
        }
    }

 .panel {
    background: none;
    margin: auto;
    box-shadow: none;
    border: none;
		&>h3 {
			&>a {
			color: #fff;
			text-decoration: none;
			font-weight: normal;
			}
			font-weight: normal;
			text-align: center;
			background: #796580;
			font-size: 16px;
			border-radius: 0px;
			border: 4px double #3d2241;
			color: #fff;
		}
		&>div {
		background: #3d2241;
        display: block;
        padding: 4px;
        color: #fff;
        border: none;
        border-top: none;
		}
	}

.che {
background-image: url("https://64.media.tumblr.com/cba0b1c5d0743c39b50c1286527decc4/4bd9f0e88cc96821-3d/s2048x3072/7ef22e2a2bbda19c1aca89f4334267de332ac4f0.pnj");
background-size: 100% auto;
background-repeat: no-repeat;
position: relative;
top: 5px;
margin-top: -35px;
transform: rotate(180deg);
}

.credit {
margin-right: 5px;
margin-bottom: -20px;
text-align: right;
user-select: none;
position: relative;
bottom: 20px;
width: auto;
height: auto;

    div.tooltip_content {
    font-family: PMD;
    width: 90%;
        bottom: 0px;
        margin-left: 10px;
        font-size: 20px;
        padding: 5px;
        border: 2px solid #3d2241;
        background: #3d2241;
        color: #fff;
        text-align: left;
        box-shadow: 0px 0px 3px #fff;
    }
    .bbcode_tooltip {
    border-bottom: none;
    }

a {
color: #fff;
}
}
[/style]