MediaWiki:InfoboxColours.css

/* -  PORTABLE INFOBOXES -

=-=-=-=-=-=-=-=-=  Themes =-=-=-=-=-=-=-=-=

/* =================  Individuals ================= */

/* Gryffindor; reds */ .pi-theme-gryffindor .pi-image, .pi-theme-gryffindor .pi-title, .pi-theme-gryffindor .pi-navigation { background-color: #AA0000; } .pi-theme-gryffindor .pi-header { background-color: #EE5555; } .pi-theme-gryffindor .pi-key-val { background-color: #F9F9F9; } /* Slytherin; greens */ .pi-theme-slytherin .pi-image, .pi-theme-slytherin .pi-title, .pi-theme-slytherin .pi-navigation { background-color: #337147; } .pi-theme-slytherin .pi-header { background-color: #5AB577; } .pi-theme-slytherin .pi-key-val { background-color: #F9F9F9; } /* Ravenclaw; light blues */ .pi-theme-ravenclaw .pi-image, .pi-theme-ravenclaw .pi-title, .pi-theme-ravenclaw .pi-navigation { background-color: #6596BF; } .pi-theme-ravenclaw .pi-header { background-color: #94C7D1; } .pi-theme-ravenclaw .pi-key-val { background-color: #F9F9F9; } /* Hufflepuff; golds */ .pi-theme-hufflepuff .pi-image, .pi-theme-hufflepuff .pi-title, .pi-theme-hufflepuff .pi-navigation { background-color: #AC8751; } .pi-theme-hufflepuff .pi-header { background-color: #DFCAA0; } .pi-theme-hufflepuff .pi-key-val { background-color: #F9F9F9; } /* Hogwarts staff; golds/purples */ .pi-theme-hogwarts-staff .pi-image, .pi-theme-hogwarts-staff .pi-title, .pi-theme-hogwarts-staff .pi-navigation { background-color: #800080; } .pi-theme-hogwarts-staff .pi-header { background-color: #FFD700; } .pi-theme-hogwarts-staff .pi-key-val { background-color: #F9F9F9; } /* Ilvermorny; cranberry on blue */ .pi-theme-ilvermorny .pi-image, .pi-theme-ilvermorny .pi-title, .pi-theme-ilvermorny .pi-navigation { background-color: #631F38; } .pi-theme-ilvermorny .pi-header { background-color: #6D94A5; } .pi-theme-ilvermorny .pi-key-val { background-color: #F9F9F9; } /* Order of the Phoenix; tangerines */ .pi-theme-phoenix .pi-image, .pi-theme-phoenix .pi-title, .pi-theme-phoenix .pi-navigation { background-color: #BB6331; } .pi-theme-phoenix .pi-header { background-color: #DD8450; } .pi-theme-phoenix .pi-key-val { background-color: #F9F9F9; } /* Wizards; browns */ .pi-theme-wizard .pi-image, .pi-theme-wizard .pi-title, .pi-theme-wizard .pi-navigation { background-color: #321; } .pi-theme-wizard .pi-header { background-color: #653; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-wizard .pi-key-val { background-color: #F9F9F9; } /* Dark wizards; greens */ .pi-theme-dark-wizard .pi-image, .pi-theme-dark-wizard .pi-title, .pi-theme-dark-wizard .pi-navigation { background-color: #4D5D53; } .pi-theme-dark-wizard .pi-header { background-color: #738678; } .pi-theme-dark-wizard .pi-key-val { background-color: #F9F9F9; } /* MOM individuals; purples */ .pi-theme-mom .pi-image, .pi-theme-mom .pi-title, .pi-theme-mom .pi-navigation { background-color: #9966CC; } .pi-theme-mom .pi-header { background-color: #C9A0DC; } .pi-theme-mom .pi-key-val { background-color: #F9F9F9; } /* Death Eaters; greens */ .pi-theme-death-eater .pi-image, .pi-theme-death-eater .pi-title, .pi-theme-death-eater .pi-navigation { background-color: #406B2E; } .pi-theme-death-eater .pi-header { background-color: #8DB878; } .pi-theme-death-eater .pi-key-val { background-color: #F9F9F9; } /* Muggles; greys */ .pi-theme-muggle .pi-image, .pi-theme-muggle .pi-title, .pi-theme-muggle .pi-navigation { background-color: #999999; } .pi-theme-muggle .pi-header { background-color: #CCCCCC; } .pi-theme-muggle .pi-key-val { background-color: #F9F9F9; } /* Individuals; greys */ .pi-theme-individual .pi-image, .pi-theme-individual .pi-title, .pi-theme-individual .pi-navigation { background-color: #999999; } .pi-theme-individual .pi-header { background-color: #CCCCCC; } .pi-theme-individual .pi-key-val { background-color: #F9F9F9; } /* Daily Propheteers; tangerines-in-semi-reverse */ .pi-theme-daily-prophet .pi-image, .pi-theme-daily-prophet .pi-title, .pi-theme-daily-prophet .pi-navigation { background-color: #CC9966; } .pi-theme-daily-prophet .pi-header { background-color: #F9D3A5; } .pi-theme-daily-prophet .pi-key-val { background-color: #F9F9F9; } /* Gringotts; black-and-yellow */ .pi-theme-gringotts .pi-image, .pi-theme-gringotts .pi-title, .pi-theme-gringotts .pi-navigation { background-color: #000000; } .pi-theme-gringotts .pi-header { background-color: #DA0; } .pi-theme-gringotts .pi-key-val { background-color: #F9F9F9; } /* Quidditch players; darker blues */ .pi-theme-quidditch-player .pi-image, .pi-theme-quidditch-player .pi-title, .pi-theme-quidditch-player .pi-navigation { background-color: #808080; } .pi-theme-quidditch-player .pi-header { background-color: #708090; } .pi-theme-quidditch-player .pi-key-val { background-color: #F9F9F9; } /* Snatchers; crimsons */ .pi-theme-snatcher .pi-image, .pi-theme-snatcher .pi-title, .pi-theme-snatcher .pi-navigation { background-color: #6B342E; } .pi-theme-snatcher .pi-header { background-color: #A66159; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-snatcher .pi-key-val { background-color: #F9F9F9; } /* Spirits; dark greys */ .pi-theme-spirit .pi-image, .pi-theme-spirit .pi-title, .pi-theme-spirit .pi-navigation { background-color: #222; } .pi-theme-spirit .pi-header { background-color: #515151; } .pi-theme-spirit .pi-key-val { background-color: #F9F9F9; } /* Giants; mustards */ .pi-theme-giant .pi-image, .pi-theme-giant .pi-title, .pi-theme-giant .pi-navigation { background-color: #8B4513; } .pi-theme-giant .pi-header { background-color: #CD853F; } .pi-theme-giant .pi-key-val { background-color: #F9F9F9; } /* Goblins; green/grey */ .pi-theme-goblin .pi-image, .pi-theme-goblin .pi-title, .pi-theme-goblin .pi-navigation { background-color: #50404D; } .pi-theme-goblin .pi-header { background-color: #009966; } .pi-theme-goblin .pi-key-val { background-color: #F9F9F9; } /* Vampires; red/black */ .pi-theme-vampire .pi-image, .pi-theme-vampire .pi-title, .pi-theme-vampire .pi-navigation { background-color: #000000; } .pi-theme-vampire .pi-header { background-color: #800000; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-vampire .pi-key-val { background-color: #F9F9F9; } /* Centaurs; browns */ .pi-theme-centaur .pi-image, .pi-theme-centaur .pi-title, .pi-theme-centaur .pi-navigation { background-color: #630; } .pi-theme-centaur .pi-header { background-color: #8B4513; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-centaur .pi-key-val { background-color: #F9F9F9; } /* House-elves; lemons */ .pi-theme-house-elf .pi-image, .pi-theme-house-elf .pi-title, .pi-theme-house-elf .pi-navigation { background-color: #FFCC66; } .pi-theme-house-elf .pi-header { background-color: #F5F5DC; } .pi-theme-house-elf .pi-key-val { background-color: #F9F9F9; } /* Convicts; greys */ .pi-theme-convict .pi-image, .pi-theme-convict .pi-title, .pi-theme-convict .pi-navigation { background-color: #483C32; } .pi-theme-convict .pi-header { background-color: #A9A9A9; } .pi-theme-convict .pi-key-val { background-color: #F9F9F9; } /* Portraits; green/grey */ .pi-theme-portrait .pi-image, .pi-theme-portrait .pi-title, .pi-theme-portrait .pi-navigation { background-color: #797A59; } .pi-theme-portrait .pi-header { background-color: #CCCCCC; } .pi-theme-portrait .pi-key-val { background-color: #F9F9F9; } /* St Mungo's employees; seafoam greens */ .pi-theme-st-mungo-employee .pi-image, .pi-theme-st-mungo-employee .pi-title, .pi-theme-st-mungo-employee .pi-navigation { background-color: #40826D; } .pi-theme-st-mungo-employee .pi-header { background-color: #ADDFAD; } .pi-theme-st-mungo-employee .pi-key-val { background-color: #F9F9F9; } /* St Mungo's patients; ketchup-on-yellow-mustard */ .pi-theme-st-mungo-patient .pi-image, .pi-theme-st-mungo-patient .pi-title, .pi-theme-st-mungo-patient .pi-navigation { background-color: #721616; } .pi-theme-st-mungo-patient .pi-header { background-color: #FFFF14; } .pi-theme-st-mungo-patient .pi-key-val { background-color: #F9F9F9; } /* Durmstrang individuals; ketchup-on-mustard */ .pi-theme-durmstrang .pi-image, .pi-theme-durmstrang .pi-title, .pi-theme-durmstrang .pi-navigation { background-color: #A52A2A; } .pi-theme-durmstrang .pi-header { background-color: #DDAA00; } .pi-theme-durmstrang .pi-key-val { background-color: #F9F9F9; } /* Beauxbatons individuals; indigos */ .pi-theme-beauxbatons .pi-image, .pi-theme-beauxbatons .pi-title, .pi-theme-beauxbatons .pi-navigation { background-color: #3E2E6F; } .pi-theme-beauxbatons .pi-header { background-color: #A0A0DB; } .pi-theme-beauxbatons .pi-key-val { background-color: #F9F9F9; } /* Veela individuals; lavender on light grey */ .pi-theme-veela .pi-image, .pi-theme-veela .pi-title, .pi-theme-veela .pi-navigation { background-color: #A0A0DB; } .pi-theme-veela .pi-header { background-color: #CCCCCC; } .pi-theme-veela .pi-key-val { background-color: #F9F9F9; } /* Hags; de-saturated indigos */ .pi-theme-hag .pi-image, .pi-theme-hag .pi-title, .pi-theme-hag .pi-navigation { background-color: #50404D; } .pi-theme-hag .pi-header { background-color: #8B8589; } .pi-theme-hag .pi-key-val { background-color: #F9F9F9; } /* Squibs; indigo on light grey */ .pi-theme-squib .pi-image, .pi-theme-squib .pi-title, .pi-theme-squib .pi-navigation { background-color: #483C50; } .pi-theme-squib .pi-header { background-color: #CCCCCC; } .pi-theme-squib .pi-key-val { background-color: #F9F9F9; } /* Pets; greys */ .pi-theme-pet .pi-image, .pi-theme-pet .pi-title, .pi-theme-pet .pi-navigation { background-color: #5B5B5B; } .pi-theme-pet .pi-header { background-color: #CDCCC0; } .pi-theme-pet .pi-key-val { background-color: #F9F9F9; } /* Creatures; greys */ .pi-theme-creature .pi-image, .pi-theme-creature .pi-title, .pi-theme-creature .pi-navigation { background-color: #999999; } .pi-theme-creature .pi-header { background-color: #CCCCCC; } .pi-theme-crature .pi-key-val { background-color: #F9F9F9; }

/* =-=-=-=-=-=-=-=-=  Things and places =-=-=-=-=-=-=-=-= */ /* Locations; greys */ .pi-theme-location .pi-image, .pi-theme-location .pi-title, .pi-theme-location .pi-navigation { background-color: #999999; } .pi-theme-location .pi-header { background-color: #CCCCCC; } .pi-theme-location .pi-key-val { background-color: #F9F9F9; } /* Objects; grey-on-yellow */ .pi-theme-object .pi-image, .pi-theme-object .pi-title, .pi-theme-object .pi-navigation { background-color: #999999; } .pi-theme-object .pi-header { background-color: #DFCAA0; } .pi-theme-object .pi-key-val { background-color: #F9F9F9; } /* Spells; burnt umber */ .pi-theme-spell .pi-image, .pi-theme-spell .pi-title, .pi-theme-spell .pi-navigation { background-color: #A00; } .pi-theme-spell .pi-header { background-color: #A00; } /* technically doesn't have headers; setting to same color as title and navigation */ .pi-theme-spell .pi-key-val { background-color: #F9F9F9; } /* Wands; chocolates */ .pi-theme-wand .pi-image, .pi-theme-wand .pi-title, .pi-theme-wand .pi-navigation { background-color: #630; } .pi-theme-wand .pi-header { background-color: #DEB887; } .pi-theme-wand .pi-key-val { background-color: #F9F9F9; } /* Broomsticks; greys */ .pi-theme-broomsticks .pi-image, .pi-theme-broomsticks .pi-title, .pi-theme-broomsticks .pi-navigation { background-color: #999999; } .pi-theme-broomsticks .pi-header { background-color: #CCCCCC; } .pi-theme-broomsticks .pi-key-val { background-color: #F9F9F9; } /* Potions; brighter greens */ .pi-theme-potion .pi-image, .pi-theme-potion .pi-title, .pi-theme-potion .pi-navigation { background-color: #32CD32; } .pi-theme-potion .pi-header { background-color: #90EE90; } .pi-theme-potion .pi-key-val { background-color: #F9F9F9; } /* Plants; greys */ .pi-theme-plant .pi-image, .pi-theme-plant .pi-title, .pi-theme-plant .pi-navigation { background-color: #999999; } .pi-theme-plant .pi-header { background-color: #CCCCCC; } .pi-theme-plant .pi-key-val { background-color: #F9F9F9; } /* (In-universe) Books; seafoam greens */ .pi-theme-iu-book .pi-image, .pi-theme-iu-book .pi-title, .pi-theme-iu-book .pi-navigation { background-color: #458B74; } .pi-theme-iu-book .pi-header { background-color: #73B9A2; } .pi-theme-iu-book .pi-key-val { background-color: #F9F9F9; } /* (In-universe) Publishers; greys */ .pi-theme-iu-publisher .pi-image, .pi-theme-iu-publisher .pi-title, .pi-theme-iu-publisher .pi-navigation { background-color: #999999; } .pi-theme-iu-publisher .pi-header { background-color: #CCCCCC; } .pi-theme-iu-publisher .pi-key-val { background-color: #F9F9F9; } /* (In-universe) Albums; greys */ .pi-theme-iu-album .pi-image, .pi-theme-iu-album .pi-title, .pi-theme-iu-album .pi-navigation { background-color: #999999; } .pi-theme-iu-album .pi-header { background-color: #CCCCCC; } .pi-theme-iu-album .pi-key-val { background-color: #F9F9F9; } /* (In-universe) Songs; greys */ .pi-theme-iu-song .pi-image, .pi-theme-iu-song .pi-title, .pi-theme-iu-song .pi-navigation { background-color: #999999; } .pi-theme-iu-song .pi-header { background-color: #CCCCCC; } .pi-theme-iu-song .pi-key-val { background-color: #F9F9F9; } /* Newspaper articles; greens */ .pi-theme-newspaper-article .pi-image, .pi-theme-newspaper-article .pi-title, .pi-theme-newspaper-article .pi-navigation { background-color: #458B74; } .pi-theme-newspaper-article .pi-header { background-color: #73B9A2; } .pi-theme-newspaper-article .pi-key-val { background-color: #F9F9F9; } /* (In-universe) Periodicals; greens */ .pi-theme-iu-periodical .pi-image, .pi-theme-iu-periodical .pi-title, .pi-theme-iu-periodical .pi-navigation { background-color: #458B74; } .pi-theme-iu-periodical .pi-header { background-color: #73B9A2; } .pi-theme-iu-periodical .pi-key-val { background-color: #F9F9F9; } /* Food and beverages; grey on wheat */ .pi-theme-food .pi-image, .pi-theme-food .pi-title, .pi-theme-food .pi-navigation { background-color: #999999; } .pi-theme-food .pi-header { background-color: #DFCAA0; } .pi-theme-food .pi-key-val { background-color: #F9F9F9; } /* Letters; greens */ .pi-theme-letter .pi-image, .pi-theme-letter .pi-title, .pi-theme-letter .pi-navigation { background-color: #458874; } .pi-theme-letter .pi-header { background-color: #73B9A2; } .pi-theme-letter .pi-key-val { background-color: #F9F9F9; } /* Decrees; sky-on-ice */ .pi-theme-decree .pi-image, .pi-theme-decree .pi-title, .pi-theme-decree .pi-navigation { background-color: #1E90FF; } .pi-theme-decree .pi-header { background-color: #87CEEB; } .pi-theme-decree .pi-key-val { background-color: #F9F9F9; } /* Organisations; greys */ .pi-theme-organisation .pi-image, .pi-theme-organisation .pi-title, .pi-theme-organisation .pi-navigation { background-color: #999999; } .pi-theme-organisation .pi-header { background-color: #CCCCCC; } .pi-theme-organisation .pi-key-val { background-color: #F9F9F9; } /* Schools; greys */ .pi-theme-school .pi-image, .pi-theme-school .pi-title, .pi-theme-school .pi-navigation { background-color: #999999; } .pi-theme-school .pi-header { background-color: #CCCCCC; } .pi-theme-school .pi-key-val { background-color: #F9F9F9; } /* Houses; greys */ .pi-theme-house .pi-image, .pi-theme-house .pi-title, .pi-theme-house .pi-navigation { background-color: #999999; } .pi-theme-house .pi-header { background-color: #CCCCCC; } .pi-theme-house .pi-key-val { background-color: #F9F9F9; } /* Classes; magenta-on-sky */ .pi-theme-class .pi-image, .pi-theme-class .pi-title, .pi-theme-class .pi-navigation { background-color: #800080; } .pi-theme-class .pi-header { background-color: #6596BF; } .pi-theme-class .pi-key-val { background-color: #F9F9F9; } /* Quidditch teams; greys */ .pi-theme-quidditch-team .pi-image, .pi-theme-quidditch-team .pi-title, .pi-theme-quidditch-team .pi-navigation { background-color: #999999; } .pi-theme-quidditch-team .pi-header { background-color: #CCCCCC; } .pi-theme-quidditch-team .pi-key-val { background-color: #F9F9F9; } /* Quidditch fouls; greys */ .pi-theme-quidditch-foul .pi-image, .pi-theme-quidditch-foul .pi-title, .pi-theme-quidditch-foul .pi-navigation { background-color: #999999; } .pi-theme-quidditch-foul .pi-header { background-color: #CCCCCC; } .pi-theme-quidditch-foul .pi-key-val { background-color: #F9F9F9; } /* Quidditch tournaments; greys */ .pi-theme-quidditch-tournament .pi-image, .pi-theme-quidditch-tournament .pi-title, .pi-theme-quidditch-tournament .pi-navigation { background-color: #999999; } .pi-theme-quidditch-tournament .pi-header { background-color: #CCCCCC; } .pi-theme-quidditch-tournament .pi-key-val { background-color: #F9F9F9; } /* Events; sunflower yellows */ .pi-theme-event .pi-image, .pi-theme-event .pi-title, .pi-theme-event .pi-navigation { background-color: #DDAA00; } .pi-theme-event .pi-header { background-color: #FFD700; } .pi-theme-event .pi-key-val { background-color: #F9F9F9; } /* Battles; greys */ .pi-theme-battle .pi-image, .pi-theme-battle .pi-title, .pi-theme-battle .pi-navigation { background-color: #999999; } .pi-theme-battle .pi-header { background-color: #CCCCCC; } .pi-theme-battle .pi-key-val { background-color: #F9F9F9; } /* Families; chocolates */ .pi-theme-family .pi-image, .pi-theme-family .pi-title, .pi-theme-family .pi-navigation { background-color: #321; } .pi-theme-family .pi-header { background-color: #654; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-family .pi-key-val { background-color: #F9F9F9; } /* Ailments; greys */ .pi-theme-ailment .pi-image, .pi-theme-ailment .pi-title, .pi-theme-ailment .pi-navigation { background-color: #999999; } .pi-theme-ailment .pi-header { background-color: #CCCCCC; } .pi-theme-ailment .pi-key-val { background-color: #F9F9F9; } /* Horcruxes; jungle greens */ .pi-theme-horcrux .pi-image, .pi-theme-horcrux .pi-title, .pi-theme-horcrux .pi-navigation { background-color: #006600; } .pi-theme-horcrux .pi-header { background-color: #339933; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-horcrux .pi-key-val { background-color: #F9F9F9; } /* Hallows; plum-on-dark-grey */ .pi-theme-hallow .pi-image, .pi-theme-hallow .pi-title, .pi-theme-hallow .pi-navigation { background-color: #322; } .pi-theme-hallow .pi-header { background-color: #655; color:#FFF } /* Originally, this infobox had dark lettering for its section headers, but they were unreadable. CzechOut changed them for the benefit of readers' eyes. */ .pi-theme-hallow .pi-key-val { background-color: #F9F9F9; } /* Official post; grey */ .pi-theme-iop .pi-horizontal-group-item.pi-data-value { text-align: center; }

/* =-=-=-=-=-=-=-=  Real world =-=-=-=-=-=-=-= */ /* OOU person (not actors); greys */ .pi-theme-oou-person .pi-image, .pi-theme-oou-person .pi-title, .pi-theme-oou-person .pi-navigation { background-color: #999999; } .pi-theme-oou-person .pi-header { background-color: #CCCCCC; } .pi-theme-oou-person .pi-key-val { background-color: #F9F9F9; } /* OOU Actors; greys */ .pi-theme-oou-actor .pi-image, .pi-theme-oou-actor .pi-title, .pi-theme-oou-actor .pi-navigation { background-color: #999999; } .pi-theme-oou-actor .pi-header { background-color: #CCCCCC; } .pi-theme-oou-actor .pi-key-val { background-color: #F9F9F9; } /* Trading Card Game; greys */ .pi-theme-trading-card .pi-image, .pi-theme-trading-card .pi-title, .pi-theme-trading-card .pi-navigation { background-color: #999999; } .pi-theme-trading-card .pi-header { background-color: #CCCCCC; } .pi-theme-trading-card .pi-key-val { background-color: #F9F9F9; } /* Video games; indigo-on-sky */ .pi-theme-video-game .pi-image, .pi-theme-video-game .pi-title, .pi-theme-video-game .pi-navigation { background-color: #3E2E6F; } .pi-theme-video-game .pi-header { background-color: #6596BF; } .pi-theme-video-game .pi-key-val { background-color: #F9F9F9; } /* Soundtracks; greens */ .pi-theme-soundtrack .pi-image, .pi-theme-soundtrack .pi-title, .pi-theme-soundtrack .pi-navigation { background-color: #458B74; } .pi-theme-soundtrack .pi-header { background-color: #73B9A2; } .pi-theme-soundtrack .pi-key-val { background-color: #F9F9F9; } /* OOU book; yellow-on-grey */ .pi-theme-oou-book .pi-image, .pi-theme-oou-book .pi-title, .pi-theme-oou-book .pi-navigation { background-color: #FFD700; } .pi-theme-oou-book .pi-header { background-color: #DFCAA0; } .pi-theme-oou-book .pi-key-val { background-color: #F9F9F9; } /* Films; greys */ .pi-theme-film .pi-image, .pi-theme-film .pi-title, .pi-theme-film .pi-navigation { background-color: #999999; } .pi-theme-film .pi-header { background-color: #CCCCCC; } .pi-theme-film .pi-key-val { background-color: #F9F9F9; } /* Plays; greys */ .pi-theme-play .pi-image, .pi-theme-play .pi-title, .pi-theme-play .pi-navigation { background-color: #999999; } .pi-theme-play .pi-header { background-color: #CCCCCC; } .pi-theme-play .pi-key-val { background-color: #F9F9F9; }