MediaWiki:Infobox.css

/* General Infobox styling */ .portable-infobox { border: none; border-radius: 0 !important; } .portable-infobox.pi-background { background-color: #f2f2f2; } .theme-fandomdesktop-dark .portable-infobox.pi-background { background-color: #3a3a3a; } .portable-infobox .pi-border-color { border-color: transparent; } .portable-infobox .pi-secondary-background.pi-title { font-family: 'Circular Std', sans-serif; } .portable-infobox .pi-navigation a { color:white !important; } .portable-infobox .pi-navigation { font-family: 'Circular Std', sans-serif; } aside.portable-infobox h2 { text-align:center; box-shadow: 0 -3px 7px 0 #002ED1 inset, 0 -11px 9px 4px #0070F6 inset, 0 3px 3px 0 #0070F6 inset,0 4px 10px 1px #C6ECFF inset, 0 4px 5px 0 #0063FF inset; color:#ffffff; background:#229DFA; font-size:larger; } aside.portable-infobox .pi-group .pi-header, .pi-secondary-background, .pi-navigation { text-align:center; font-weight:bold; color:#ffffff; box-shadow: 0 -3px 7px 0 #000049 inset, 0 -11px 9px 4px #0001CB inset, 0 3px 3px 0 #0001CB inset,0 4px 10px 1px #339BFC inset, 0 -32px 28px -17px white inset; background:#000BDF; } aside.portable-infobox.pi-theme-red h2 { box-shadow:0 -3px 7px 0 #D00A08 inset, 0 -11px 9px 4px #F20C0C inset, 0 3px 3px 0 #F20C0C inset, 0 4px 10px 1px #FA2424 inset, 0 4px 5px 0 #FE4D4D inset; background:#FF6B60; } aside.portable-infobox.pi-theme-red .pi-group .pi-header, aside.portable-infobox.pi-theme-red .pi-secondary-background, aside.portable-infobox.pi-theme-red .pi-navigation { box-shadow: 0 -3px 7px 0 #FE5555 inset, 0 -11px 9px 4px #EA6E6E inset, 0 3px 3px 0 #EA6E6E inset,0 4px 10px 1px #F58383 inset, 0 -32px 28px -17px white inset; background:#FE4D4D; } aside.portable-infobox.pi-theme-green h2 { box-shadow:0 -3px 7px 0 #1C6909 inset, 0 -11px 9px 4px #10B821 inset, 0 3px 3px 0 #04C518 inset, 0 4px 10px 1px #0FF026 inset, 0 4px 5px 0 #008B8B inset; background:#28CE1C; } aside.portable-infobox.pi-theme-green .pi-group .pi-header, aside.portable-infobox.pi-theme-green .pi-secondary-background, aside.portable-infobox.pi-theme-green .pi-navigation { box-shadow: 0 -3px 7px 0 #013506 inset, 0 -11px 9px 4px #006B0A inset, 0 3px 3px 0 #028C0F inset,0 4px 10px 1px #00CE13 inset, 0 -32px 28px -17px white inset; background:#008000; } aside.portable-infobox.pi-theme-darkred h2 { box-shadow:0 -3px 7px 0 #5A0808 inset, 0 -11px 9px 4px #850404 inset, 0 3px 3px 0 #850404 inset, 0 4px 10px 1px #A91010 inset, 0 4px 5px 0 #db2929 inset; background:#E31414; } aside.portable-infobox.pi-theme-darkred .pi-group .pi-header, aside.portable-infobox.pi-theme-darkred .pi-secondary-background, aside.portable-infobox.pi-theme-darkred .pi-navigation { box-shadow: 0 -3px 7px 0 #5A0808 inset, 0 -11px 9px 4px #850404 inset, 0 3px 3px 0 #850404 inset,0 4px 10px 1px #A91010 inset, 0 -32px 28px -17px #C80C0C inset; background:#E31414; } aside.portable-infobox.pi-theme-lavender h2 { box-shadow: 0 -3px 7px 0 #6B6B90 inset, 0 -11px 9px 4px #8B8BB0 inset, 0 3px 3px 0 #8B8BB0 inset,0 4px 10px 1px #BFBFE2 inset, 0 -32px 28px -17px #b586e2 inset; background:#CCCCFF; } aside.portable-infobox.pi-theme-lavender .pi-group .pi-header, aside.portable-infobox.pi-theme-lavender .pi-secondary-background, aside.portable-infobox.pi-theme-lavender .pi-navigation { box-shadow: 0 -3px 7px 0 #6B6B90 inset, 0 -11px 9px 4px #8B8BB0 inset, 0 3px 3px 0 #8B8BB0 inset,0 4px 10px 1px #BFBFE2 inset, 0 -32px 28px -17px #b586e2 inset; background:#CCCCFF; } aside.portable-infobox.pi-theme-gray h2 { box-shadow:0 -3px 7px 0 #747478 inset, 0 -11px 9px 4px #9A9A9F inset, 0 3px 3px 0 #9A9A9F inset, 0 4px 10px 1px #C5C5CB inset, 0 4px 5px 0 #DADAE4 inset; background:#F9F9F9; } .pi-theme-gray > h2 { color:black !important; } aside.portable-infobox.pi-theme-gray .pi-group .pi-header, aside.portable-infobox.pi-theme-gray .pi-secondary-background, aside.portable-infobox.pi-theme-gray .pi-navigation { box-shadow: 0 -3px 7px 0 #424242 inset, 0 -11px 9px 4px #585858 inset, 0 3px 3px 0 #585858 inset,0 4px 10px 1px #707070 inset, 0 -32px 28px -17px #7D7D7D inset; background:#8E8E8E; } aside.portable-infobox.pi-theme-lightblue h2 { box-shadow:0 -3px 7px 0 #56b4d4 inset, 0 -11px 9px 4px #64bdda inset, 0 3px 3px 0 #72c5df inset, 0 4px 10px 1px #80cce3 inset, 0 4px 5px 0 #80cce3 inset; background:#99d9ea; } aside.portable-infobox.pi-theme-lightblue .pi-group .pi-header, aside.portable-infobox.pi-theme-lightblue .pi-secondary-background, aside.portable-infobox.pi-theme-lightblue .pi-navigation { box-shadow: 0 -3px 7px 0 #76D4F4 inset, 0 -11px 9px 4px #89E2FF inset, 0 3px 3px 0 #A2E9FF inset,0 4px 10px 1px #B7EEFF inset, 0 -32px 28px -17px #B7EEFF inset; background:#D1F5FF; } aside.portable-infobox.pi-theme-lightgreen h2 { box-shadow:0 -3px 7px 0 #538B0F inset, 0 -11px 9px 4px #79BB28 inset, 0 3px 3px 0 #79BB28 inset, 0 4px 10px 1px #8DD337 inset, 0 4px 5px 0 #8EF80B inset; background:#8AEC11; } aside.portable-infobox.pi-theme-lightgreen .pi-group .pi-header, aside.portable-infobox.pi-theme-lightgreen .pi-secondary-background, aside.portable-infobox.pi-theme-lightgreen .pi-navigation { box-shadow: 0 -3px 7px 0 #538B0F inset, 0 -13px 17px 4px #79BB28 inset, 0 3px 7px 0 #79BB28 inset,0 4px 10px 1px #8DD337 inset, 0 4px 5px 0 #8EF80B inset; background:#8AEC11; } aside.portable-infobox.pi-theme-brown h2 { box-shadow:0 -3px 7px 0 #472C10 inset, 0 -11px 9px 4px #633505 inset, 0 3px 3px 0 #633505 inset, 0 4px 10px 1px #864D11 inset, 0 4px 5px 0 #A65A0B inset; background:#964E02; } aside.portable-infobox.pi-theme-brown .pi-group .pi-header, aside.portable-infobox.pi-theme-brown .pi-secondary-background, aside.portable-infobox.pi-theme-brown .pi-navigation { box-shadow: 0 -3px 7px 0 #7D4410 inset, 0 -13px 17px 4px #804915 inset, 0 3px 7px 0 #804915 inset,0 4px 10px 1px #955A23 inset, 0 4px 5px 0 #976231 inset; background:#B87333; } aside.portable-infobox.pi-theme-teal h2 { box-shadow:0 -3px 7px 0 #0C4444 inset, 0 -11px 9px 4px #056B6B inset, 0 3px 3px 0 #056B6B inset, 0 4px 10px 1px #128D8D inset, 0 4px 5px 0 #13C2C2 inset; background:teal; } aside.portable-infobox.pi-theme-teal .pi-group .pi-header, aside.portable-infobox.pi-theme-teal .pi-secondary-background, aside.portable-infobox.pi-theme-teal .pi-navigation { box-shadow: 0 -3px 7px 0 #031d3e inset, 0 -13px 17px 4px #042b3a inset, 0 3px 7px 0 #031d3e inset, 0 4px 10px 1px #049494 inset, 0 4px 5px 0 #099494 inset; background: #054950; } aside.portable-infobox.pi-theme-orange h2 { box-shadow:0 -3px 7px 0 #f26f00 inset, 0 -11px 9px 4px #ffae03 inset, 0 3px 3px 0 #ffa301 inset, 0 4px 10px 1px #ff9700 inset, 0 4px 5px 0 #ff8a00 inset; background:darkorange; } aside.portable-infobox.pi-theme-orange .pi-group .pi-header, aside.portable-infobox.pi-theme-orange .pi-secondary-background, aside.portable-infobox.pi-theme-orange .pi-navigation { box-shadow: 0 -3px 7px 0 #FF9738 inset, 0 -13px 17px 4px #FFCD23 inset, 0 3px 7px 0 #FFDD38 inset,0 4px 10px 1px #FFCD38 inset, 0 4px 5px 0 #FFB838 inset; background:darkorange; } aside.portable-infobox.pi-theme-mint h2 { box-shadow: 0 -3px 7px 0 #6bb169 inset, 0 -11px 9px 4px #5f9c5c inset, 0 3px 3px 0 #5f9c5c inset, 0 4px 10px 1px #98e095 inset, 0 4px 5px 0 #8ef58b inset; background: #73c57a; } aside.portable-infobox.pi-theme-mint .pi-group .pi-header, aside.portable-infobox.pi-theme-mint .pi-secondary-background, aside.portable-infobox.pi-theme-mint .pi-navigation { box-shadow: 0 -3px 7px 0 #79A778 inset, 0 -13px 17px 4px #94CA91 inset, 0 3px 7px 0 #94CA91 inset,0 4px 10px 1px #ADE6AB inset, 0 4px 5px 0 #A3FAA0 inset; background:#A2F49F; } aside.portable-infobox.pi-theme-purple h2 { box-shadow:0 -3px 7px 0 #5C2D97 inset, 0 -11px 9px 4px #593EBB inset, 0 3px 3px 0 #593EBB inset, 0 4px 10px 1px #D7D7F4 inset, 0 4px 5px 0 #603CBC inset; background:#6B5FCC; } aside.portable-infobox.pi-theme-purple .pi-group .pi-header, aside.portable-infobox.pi-theme-purple .pi-secondary-background, aside.portable-infobox.pi-theme-purple .pi-navigation { box-shadow: 0 -3px 7px 0 #351C41 inset, 0 -13px 17px 4px #662389 inset, 0 3px 7px 0 #662389 inset,0 4px 10px 1px #7869CE inset, 0 4px 5px 0 #FAFAFA inset; background:#6B2697; } aside.portable-infobox.pi-theme-pink h2 { box-shadow:0 -3px 7px 0 #D65370 inset, 0 -11px 9px 4px #ED577A inset, 0 3px 3px 0 #ED577A inset, 0 4px 10px 1px #F36888 inset, 0 4px 5px 0 #F7849F inset; background:#F992A3; } aside.portable-infobox.pi-theme-pink .pi-group .pi-header, aside.portable-infobox.pi-theme-pink .pi-secondary-background, aside.portable-infobox.pi-theme-pink .pi-navigation { box-shadow: 0 -3px 7px 0 #F889A3 inset, 0 -13px 17px 4px #EB9AAD inset, 0 3px 7px #EB9AAD inset,0 4px 10px 1px #F3A8BA inset, 4px 5px 0 #FDFDFD inset; background:#F7849F; } aside.portable-infobox.pi-theme-yellow h2 { text-align:center; box-shadow: 0 -3px 7px 0 #c8b700 inset, 0 -11px 9px 4px #ffd505 inset, 0 3px 3px 0 #fee50f inset,0 4px 10px 1px #fefad5 inset, 0 4px 5px 0 #ffe300 inset; color:#ffffff; background:#feeb4b; } aside.portable-infobox.pi-theme-yellow .pi-group .pi-header, aside.portable-infobox.pi-theme-yellow .pi-secondary-background, aside.portable-infobox.pi-theme-yellow .pi-navigation { text-align: center; font-weight: normal; color: #ffffff; box-shadow: 0 -3px 7px 0 #ad7901 inset, 0 -11px 9px 4px #fbdd00 inset, 0 3px 3px 0 #fffc00 inset, 0 4px 10px 1px #fcff4b inset, 0 -32px 28px -17px #fdde25 inset; background: #f5cd00; } .pi-background.pi-theme-lightblue.pi-layout-stacked nav a, aside.portable-infobox.pi-theme-lightblue .pi-group .pi-header{ color:#002f52 !important; }

.pi-item-spacing.pi-secondary-background.pi-secondary-font { font-family: 'Circular Std', sans-serif; }

/* Data settings */ .portable-infobox .pi-data { padding: 4px; } .portable-infobox .pi-data:nth-child(odd) { background-color: #f2f2f2; } .portable-infobox .pi-data:nth-child(even) { background-color: #e6e6e6; } .theme-fandomdesktop-dark .portable-infobox .pi-data:nth-child(odd) { background-color: #3a3a3a; } .theme-fandomdesktop-dark .portable-infobox .pi-data:nth-child(even) { background-color: #484848; } .portable-infobox .pi-data .pi-data-label { font-family: 'Source Serif Pro', serif; font-weight: normal; } .portable-infobox .pi-data .pi-data-value { font-family: 'Source Sans Pro', sans-serif; }