MediaWiki:Fandomdesktop.css

.ambox { background-color: #282828; border-bottom-color: #383838; border-right-color: #383838; border-top-color: #383838; border-collapse: collapse; font-size: 95%; margin: 0 auto 2px auto; width: 80%; }

.ambox-gray { border-left-color: #383838; }

.ambox.ambox-tiny { font-size: 90%; margin: 2px 0; width: auto; }

.ambox + .ambox { margin-top: -2px; }

.ambox-text { padding: 0.25em 0.5em; }

.ambox-image { padding: 2px 0px 2px 0.5em; text-align: center; width: 60px; }

.ambox-tiny .ambox-image { padding: 2px 0.5em; text-align: left; width: auto; }

/* Ambox colors */ .ambox-blue { border-left: 10px solid #1e90ff; }

.ambox-red { border-left: 10px solid #b22222; }

.ambox-orange { border-left: 10px solid #f28500; }

.ambox-yellow { border-left: 10px solid #f4c430; }

.ambox-purple { border-left: 10px solid #9932cc; }

.ambox-gray { border-left: 10px solid #bba; }

.ambox-green { border-left: 10px solid #228b22; }

/* Ambox small text */ .amsmalltext { font-size: smaller; margin-left:0.8em; margin-top:0.5em; } /**************************** /* Flexbox main page styles * /****************************/ .fmp-portal-row { display: flex; flex-flow: row nowrap; margin: 0; align-items: self-start; justify-content: space-around; text-align: center; font-family: 'Marcellus', Roboto, sans-serif; text-transform: uppercase; color: #000000; font-weight: bold; max-width: 100%; }

.fmp-portal-row div { flex: 0 1 auto; margin: 4px; }

@media only screen and (max-width: 1000px) { .fmp-portal-row { flex-flow: row wrap; }	.fmp-portal-row > div { max-width: 100px; } }

.fmp-portal-icon a img { width: 100%; min-width: 50px; max-width: 150px; height: auto; }

.fmp p img { height: auto; }

.fmpsections { width: 100%; overflow: hidden; display: flex; flex-flow: row wrap; }

.fmpsection { flex-basis: 100%; }

.fmpblock { margin: 0.3125rem; padding: 0.125rem 0.875rem 0.875rem 0.875rem; flex: 1 0 auto; text-align: center; }

.fmpblock.noresize { flex: 0 0 auto; }

.fmpblock.box { border: none; background: rgba(244, 247, 255, 0.9); color: #000000; margin: 0.3125rem; padding: 0.125rem 1.25rem 1rem 1.25rem; }

.fmpblock div.slideboxlightshow, .fmpblock div.slideboxlightshow a, .fmpblock img { max-width: 100%; height: auto; }

.fmpblock .heading.main { border-bottom: none; background: #6e7174 linear-gradient(to right, #b7bdc4, #242424, #b7bdc4) no-repeat center center; background: linear-gradient(to right, #c7d1d9, #71797d, #c7d1d9) no-repeat center bottom / 100% 4px, #6e7174 linear-gradient(to right, #b7bdc4, #242424, #b7bdc4) no-repeat center center; font-family: 'Marcellus', Roboto, sans-serif; text-transform: uppercase; color: #ffffff; font-size: 175%; text-align: center; margin: -0.125rem -1.25rem 0.5rem -1.25rem; padding: 0.125rem 1.25rem 0.5rem 1.25rem; }

.fmpblock .heading { border-bottom: none; background: #6e7174 linear-gradient(to right, #b7bdc4, #242424, #b7bdc4) no-repeat center center; background: linear-gradient(to right, #c7d1d9, #71797d, #c7d1d9) no-repeat center bottom / 100% 4px, #6e7174 linear-gradient(to right, #b7bdc4, #242424, #b7bdc4) no-repeat center center; font-family: 'Marcellus', Roboto, sans-serif; text-transform: uppercase; color: #ffffff; font-size: 175%; text-align: center; margin: -0.125rem -1.25rem 0.5rem -1.25rem; padding: 0.125rem 1.25rem 0.5rem 1.25rem; }

.fmpblock .subheading { border-bottom: none; background: linear-gradient(to right, transparent, #8b9599, transparent) no-repeat center bottom / 100% 1px; font-family: 'Roboto Condensed', sans-serif; font-weight: bold; text-transform: uppercase; color: #000000; text-align: center; margin: 1rem 0 0.5rem 0; padding: 0 0 0.5rem 0; }

.fmpblock .links { font-family: 'Roboto Condensed', sans-serif; font-weight: bold; text-transform: uppercase; text-align: center; }

.fmpblock .links ul { display: flex; flex-flow: column nowrap; text-align: center; margin: 0 -10px 0 -10px; padding: 0; }

.fmpblock .links ul li { list-style: none; flex: 1 0 auto; margin: 0; padding: 2px 10px; }

.fmpblock .nowrapitems span { white-space: nowrap; }

.fmpblock .iconlinks { display: flex; flex-flow: row wrap; justify-content: center; align-items: flex-start; font-family: 'Roboto Condensed', sans-serif; font-weight: bold; text-transform: uppercase; text-align: center; margin: -10px -10px 0 -10px; padding: 0; }

.fmpblock .iconlinks .iconlink { display: flex; flex-flow: column nowrap; align-items: center; border: none; background: transparent; margin: 0; padding: 10px; flex: 0 0 15em; }

.fmpblock .iconlinks .iconlink .icon { display: flex; flex-flow: column nowrap; justify-content: stretch; min-width: 100px; width: 100%; height: 100px; }

.fmpblock .iconlinks .iconlink .icon a { display: flex; flex-flow: column nowrap; justify-content: flex-end; align-items: center; flex: 0 0 100%; }

.fmpblock .iconlinks .iconlink .text { color: #000000; width: 100%; text-align: center; }

.fmpblock .iconlinks .iconlink .text a, .fmpblock .iconlinks .iconlink .text a:link, .fmpblock .iconlinks .iconlink .text a:visited { color: #000000 !important; display: block; width: auto; }

.fmpblock .videos { margin: 0 auto; overflow: hidden; text-align: center; }

.fmpblock .videos .video { display: inline-block; margin: 0 5px; }

display: flex; flex-flow: column nowrap; }
 * 1) fmptwitter {

display: flex; flex-flow: column nowrap; flex: 0 0 410px; }
 * 1) fmptwitter .body,
 * 2) fmptwitter .body .twitter-timeline-wrapper {

width: auto !important; height: auto !important; flex: 0 0 400px; }
 * 1) fmptwitter .body .twitter-timeline-wrapper iframe {

@media (min-width: 820px) { .fmpsections .fmpsection { display: flex; flex-flow: column nowrap; flex-basis: 50%; max-width: 50%; }

.fmpsections .fmpsectiongroup { display: flex; flex-flow: column nowrap; flex-basis: 50%; max-width: 50%; }

.fmpsections .fmpsectiongroup .fmpsection { flex-basis: auto; flex-grow: 1; max-width: 100%; }

#fmptwitter .body, #fmptwitter .body .twitter-timeline-wrapper, #fmptwitter .body .twitter-timeline-wrapper iframe { flex: 1 0 auto; } }

@media (min-width: 1440px) { .fmpsections .fmpsectiongroup { display: flex; flex-flow: row wrap; flex-basis: 66.667%; max-width: 66.667%; }

.fmpsections .fmpsection { display: flex; flex-flow: column nowrap; flex-basis: 33.333%; max-width: 33.333%; }

.fmpsections .fmpsectiongroup .fmpsection.fullwhenwide { width: auto; flex-basis: 100%; flex-grow: 0; max-width: 100%; }

.fmpsections .fmpsectiongroup .fmpsection.halfwhenwide { width: auto; flex-basis: 50%; flex-grow: 0; max-width: 50%; } }

.fmpexamples { display: flex; align-items: self-start; }

.fmpexample { margin: 0 3em; text-align: center; }

.fmpexample.narrow { width: 5em; }

.fmpexample.medium { width: 10em; }

.fmpexample.wide { width: 15em; }

.fmpexample .body { margin: -5px; }

.fmpexample.medium .body { display: flex; flex-flow: row wrap; }

.fmpexample.medium .body .fmpsection { display: flex; flex-flow: column nowrap; flex-basis: 50%; }

.fmpexample.medium .body .fmpsectiongroup { display: flex; flex-flow: column nowrap; flex-basis: 50%; }

.fmpexample.medium .body .fmpsectiongroup .fmpsection { flex-basis: 100%; }

.fmpexample.wide .body { display: flex; flex-flow: row wrap; }

.fmpexample.wide .body .fmpsectiongroup { display: flex; flex-flow: row wrap; flex-basis: 66.667%; }

.fmpexample.wide .body .fmpsection { display: flex; flex-flow: column nowrap; flex-basis: 33.333%; }

.fmpexample.wide .body .fmpsectiongroup .fmpsection.fullwhenwide { width: auto; flex-basis: 100%; }

.fmpexample.wide .body .fmpsectiongroup .fmpsection.halfwhenwide { width: auto; flex-basis: 50%; }