header { padding:0.75rem; text-align:center; }
header a { display:inline-block; padding:0.375rem; margin:0.375rem; }

.flex { display:flex; flex-wrap:wrap; margin:0 -0.375rem; padding:0; }
.flex.hidden { display:none; }
.flex .box { display:flex; flex-wrap:wrap; width:100%; }
.flex .box.hidden { display:none; }

.ti { position:relative; display:inline-block; margin:0 0.1rem; padding:0; width:24px; height:24px; line-height:24px; cursor:default; background-image:url('https://pokemon.gameinfo.io/images/icons-sprite.png'); }
.ti .param { position:absolute; bottom:-10px; left:0 ;right:0; font-size:0.6em; text-shadow:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; font-weight:600; color:#fff; text-align:center; }
.ti-bug { background-position:-24px 0; }
.ti-dark { background-position:-48px 0; }
.ti-dragon { background-position:0 -24px; }
.ti-electric { background-position:-24px -24px; }
.ti-fairy { background-position:-48px -24px; }
.ti-fighting { background-position:-72px -24px; }
.ti-fire { background-position:0 -48px; }
.ti-flying { background-position:-24px -48px; }
.ti-ghost { background-position:-48px -48px; }
.ti-grass { background-position:-72px -48px; }
.ti-ground { background-position:0 -72px; }
.ti-ice { background-position:-24px -72px; }
.ti-normal { background-position:-48px -72px; }
.ti-poison { background-position:-72px -72px; }
.ti-psychic { background-position:0 -96px; }
.ti-rock { background-position:-24px -96px; }
.ti-steel { background-position:-48px -96px; }
.ti-water { background-position:-72px -96px; }

.types { margin:0.375rem; }
.types span { display:inline-block; padding:0.375rem 0.75rem; margin:0.375rem; cursor:default; background-color:rgba(0,0,0,0.05); }
.types .ti { margin:0; padding:0; background-color:transparent; }

.listing .search { position:sticky; top:0; padding:0 0.75rem 0.75rem 0.75rem; background-color:#fff; z-index:1; }
.listing .search .pod { position:relative; margin:0 auto; max-width:300px; }
.listing .search .pod .mi { position:absolute; top:0.5rem; right:-0.375rem; padding:0.375rem; cursor:pointer; }
.listing .search .pod .mi.hidden { display:none; }

.sw .label { font-size:0.7em; }



/*.listing .poke { margin-bottom:2.5rem; }
.listing .poke > div { text-align:center; }
.listing .poke .name { font-size:1.5em; }
.listing .poke .info { justify-content:center; }
.listing .poke .info > div { padding:0.75rem; align-self:center; }
.listing .poke .info > div:first-child { line-height:0; font-size:0; }
.listing .poke .info > div:last-child { }
.listing .poke .info > div h5 { margin:0 0 0.5rem 0; font-size:1.35em; }

*/

.flex .box { width:50%; }
.flex .box .poke { width:100%; margin:0.375rem; padding:0.375rem; text-align:center; }

.poke .image { font-size:0; line-height:0; }

@media only screen and (min-width:400px){ 
	.flex .box { width:33.3333%; }
}
@media only screen and (min-width:600px){ 
	.flex .box { width:25%; }
}
@media only screen and (min-width:800px){ 
	.flex .box { width:20%; }
}



.typecombo-form .types span { cursor:pointer; }
.typecombo-form .types span.on { background-color:#3fbe92; color:#fff; }
.typecombo-form .trigger { text-align:center; }
.typecombo-results {}
.typecombo-results h5 { font-size:1.25rem; }
.typecombo-results > div { margin:1.5rem; text-align:center; }

.typecombo-results .pair { display:inline-block; margin:0.375rem; padding:0.375rem; }
.typecombo-results .pair .val { font-size:1.2em; font-family:'Open Sans Condensed',sans-serif; }

/*@media only screen and (min-width:480px){
	.listing .poke .info { display:flex; }
}*/



.dmaxadv .typecombo-results .flex { flex-wrap:wrap; }

.dmaxadv .poke { margin:0.375rem; padding:0.375rem; }
.dmaxadv .poke .exclusive,
.dmaxadv .poke .exclusive span { display:none; }
.dmaxadv .poke.exclusive-shield .exclusive,
.dmaxadv .poke.exclusive-sword .exclusive { display:block; }
.dmaxadv .poke.exclusive-shield span.shield,
.dmaxadv .poke.exclusive-sword span.sword { display:inline; }
.dmaxadv .poke .name { font-size:1.2em; }
.dmaxadv .typecombo-results > div { margin:0.375rem; }

.poke .special, .poke .special > div { display:none; }
.poke.legendary .special,
.poke.legendary .special .legendary,
.poke.ultra-beast .special,
.poke.ultra-beast .special .ultra-beast,
.poke.mythical .special,
.poke.mythical .special .mythical { display:block; }

/*.poke.legendary { background-color:rgba(255,234,87,0.25); }
.poke.ultra-beast { background-color:rgba(255,118,87,0.25); }*/


