MediaWiki:Card.css

/* For card pages*/ .cards_img { position: relative; width: 644px; height: 432px; overflow: hidden; border-radius: 12px; left: 0.5%; } .cards_img a img { width: 100%; height: auto; transform: translate(0, -23.355px); } .card_icons { position: absolute; max-width: 620px; margin: auto; } .attribute_icon { position: absolute; left: 574.8px; top: -424px; } .band_icon { position: absolute; left: 8px; top: -425px; } .cards_frame { position: absolute; left: 0; top: -0.5%; } /* For Template:CardImages */ /*for cards with 2 arts */ .cardimg a img { position: relative; left: -56px; width: 257px; height: 193px; } /*for cards with 1 art */ .cardimg_1 a img { position: relative; left: 0; width: 290px; height: 203px; object-fit: cover; } /* Template:Event2 */ .eventcard a img { position: relative; left: -64px; width: 293px; height: 220px; } .eventcard1 a img { position: relative; left: 0; width: 330px; height: 248px; object-fit: cover; transform: translate(0, -14px); } /* Template:CardGallery -> DreamFes Pages */ .dreamfes a img { position: relative; left: 0; width: 330px; height: 248px; }

/* Special birthday! Card List*/ /*centered character*/ .bdaycardimg a img { position: relative; left: -52.5px; width: 240px; height: 180px; } /*left aligned character*/ .bdaycardimg-left a img { position: relative; left: 0; width: 240px; height: 180px; } /*right aligned character*/ .bdaycardimg-right a img { position: relative; left: -85px; width: 240px; height: 180px; }

/******* Drop Shadows *******/ .drop-shadow_kasumi {filter: drop-shadow(0 0 0.2rem #f52);} .drop-shadow_tae {filter: drop-shadow(0 0 0.2rem #07d);} .drop-shadow_rimi {filter: drop-shadow(0 0 0.2rem #f5b);} .drop-shadow_saaya {filter: drop-shadow(0 0 0.2rem #fc1);} .drop-shadow_arisa {filter: drop-shadow(0 0 0.2rem #a6d);} .drop-shadow_ran {filter: drop-shadow(0 0 0.2rem #e02);} .drop-shadow_moca {filter: drop-shadow(0 0 0.2rem #0ca);} .drop-shadow_himari {filter: drop-shadow(0 0 0.2rem #f99);} .drop-shadow_tomoe {filter: drop-shadow(0 0 0.2rem #b03);} .drop-shadow_tsugumi {filter: drop-shadow(0 0 0.2rem #fe8);} .drop-shadow_aya {filter: drop-shadow(0 0 0.2rem #f8b);} .drop-shadow_hina {filter: drop-shadow(0 0 0.2rem #5de);} .drop-shadow_chisato {filter: drop-shadow(0 0 0.2rem #fea);} .drop-shadow_maya {filter: drop-shadow(0 0 0.2rem #9d8);} .drop-shadow_eve {filter: drop-shadow(0 0 0.2rem #dbf);} .drop-shadow_yukina {filter: drop-shadow(0 0 0.2rem #818);} .drop-shadow_sayo {filter: drop-shadow(0 0 0.2rem #0ab);} .drop-shadow_lisa {filter: drop-shadow(0 0 0.2rem #d20);} .drop-shadow_ako {filter: drop-shadow(0 0 0.2rem #d08);} .drop-shadow_rinko {filter: drop-shadow(0 0 0.2rem #bbb);} .drop-shadow_kokoro {filter: drop-shadow(0 0 0.2rem #fe2);} .drop-shadow_kaoru {filter: drop-shadow(0 0 0.2rem #a3c);} .drop-shadow_hagumi {filter: drop-shadow(0 0 0.2rem #f92);} .drop-shadow_kanon {filter: drop-shadow(0 0 0.2rem #4df);} .drop-shadow_misaki {filter: drop-shadow(0 0 0.2rem #069);} .drop-shadow_mashiro {filter: drop-shadow(0 0 0.2rem #67c);} .drop-shadow_touko {filter: drop-shadow(0 0 0.2rem #e66);} .drop-shadow_nanami {filter: drop-shadow(0 0 0.2rem #e74);} .drop-shadow_tsukushi {filter: drop-shadow(0 0 0.2rem #e78);} .drop-shadow_rui {filter: drop-shadow(0 0 0.2rem #698);} .drop-shadow_rei {filter: drop-shadow(0 0 0.2rem #c00);} .drop-shadow_rokka {filter: drop-shadow(0 0 0.2rem #ae2);} .drop-shadow_masuki {filter: drop-shadow(0 0 0.2rem #eb4);} .drop-shadow_reona {filter: drop-shadow(0 0 0.2rem #f9b);} .drop-shadow_chiyu {filter: drop-shadow(0 0 0.2rem #0bf);} .drop-shadow_default {filter: drop-shadow(0 0 0.2rem #f37);}

/*Template:CardIcon*/ .icon_container { position: relative; width: auto; display: inline-block; }

.icon_img { display: block; width: auto; height: auto; }

.icon_overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0; transition: .5s ease; background-color: transparent; }

.icon_container:hover .icon_overlay { opacity: 1; }