MediaWiki:Gadget-ms-Tardis.css

/* ============================
   Tardis.css v. 2.0
   
   Month of last major change: Feb 2024

   This page styles custom elements
   which exist only here at Tardis. 
   If the base selector is unique to 
   Tardis, you'll find the styling here.
   ============================ */


/*  ======================
    TOP-OF-PAGE BANNERS
    which identify the type
    of article or give other
    important messages about
    the article as a whole
    =======================
    Clearly owes a debt to
    memoryalpha.fandom.com,
    who were riffin' off of
    en.wikipedia
    =======================
 
    +++++++++++++++++++++++
    Base frame
    +++++++++++++++++++++++ */
div#article-type { 
    border: 1px solid var(--accent-1);
    padding: 5px;
    letter-spacing: .5px;
    text-align: left;
    min-height: 55px;
    min-width: 528.5px;
    margin: 0px 0px 10px 0px;
}   
div#article-type p {
    margin-left: 205px;
    line-height: 11px;
    font-size: 11px;
    text-align: left;
    font-weight: normal;
    font-style: normal;
}
div#type-title {
    margin-left: 205px;
    font-size: 18pt;
    line-height: 16pt;
}

/* +++++++++++++++++++
   Various article types
   +++++++++++++++++++ */

div.type-realworld {
    margin: auto auto auto auto;
    top: 0px;
    max-height: 55px;
    background: url(https://tardis.wiki/w/images/Tardis_Images/d/d8/SmallClapper.jpg) no-repeat;
    z-index: 5;
}
div.type-nc {
    background: url(https: //tardis.wiki/w/images/Tardis_Images/f/f1/Journal200px.png) no-repeat;
    z-index: 5;
}
div.type-disambig {
    max-height: 55px;
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/Transferring.jpg) no-repeat;
    z-index: 5; 
}
div.type-inuse {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/e/e0/Inuse200px.jpg) no-repeat;
    z-index: 5;
}
div.type-update {
    margin-left: 180px;
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/37/Update200px.jpg) no-repeat;
    z-index: 5;
}
div.type-cleanup {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/5/58/Thirteen_repairing_timeship.jpg) no-repeat;
}
div.type-listy {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/3a/Explain_explain_Journey%27s_End.jpg) no-repeat;
}
div.type-delete {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/6b/Delete200px.jpg) no-repeat;
    z-index: 5;
}
div.type-oou {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/63/Oou200px.jpg) no-repeat;
    z-index: 5;
}
div.type-rename {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/1/1e/Rename200px.jpg) no-repeat;
    z-index: 5;
}
div.type-merge {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/9/99/Merging_Tremaster.jpg);
    background-repeat: no-repeat;
    background-size: 200px 200px;
    background-position: 0 0;
    z-index: 5;
}
div.type-spoiler {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/7f/Spoiler200px.jpg) no-repeat;
    z-index: 5;
}
div.type-conjecture {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c3/Conjecture200px.jpg) no-repeat;
    z-index: 5;
}
div.type-talk {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/b/b4/Talk200px.jpg) no-repeat;
    z-index: 5;
}
div.type-unprod {
    background: rgba(var(--contrast-color-1--rgb),0.4) url(https: //tardis.wiki/w/images/Tardis_Images/f/f2/Unprod.png) no-repeat;
    z-index: 5;
}
div.type-doctorwhich {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/WhichDoctor.jpg) no-repeat;
    z-index: 5;
}
div.type-nonfiction {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/2/26/Nonfiction.png) no-repeat;
    z-index: 5;
}
div.type-prefix {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/d/d5/Prefix.png) no-repeat;
    z-index: 5;
    background-size: 200px 90px;
    background-position: left top;
}
div.type-demonym {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c6/Demonym200px.jpg) no-repeat;
    z-index: 5;
    background-position: 0px -20px
}

/*  ===============
    STUBS
    =============== */
    
.stub-type,
#stub-type {
    float: left;
    margin-right: 12px;
    margin-top: 5px;
}
.stub-type + .stub-type + .stub-type,
#stub-type + .stub-type + .stub-type,
#stub-type + #stub-type + .stub-type,
#stub-type + #stub-type + #stub-type,
#stub-type + .stub-type + #stub-type,
.stub-type + #stub-type + .stub-type,
.stub-type + #stub-type + #stub-type,
.stub-type + .stub-type + #stub-type {
	clear: left;
}

/*  This is for the small, right-floating 
    boxes, like DisconNav   */
    
div#inline-box-rt {
    float: right;
    padding: 10px;
    text-align: center;
    border: 1px solid var(--accent-1);
    width: 250px;
    margin: 10px;
    line-height: 1.1em;
    font-size: .8em;
    font-weight: 400;
    font-style: normal;
    background-color: transparent ;
    color: #fff;
}

/*  This is for the small, left-floating 
    boxes, like section cleanup   */
    
div#inline-box {
    float: left;
    padding: 10px;
    text-align: center;
    border: 1px solid var(--accent-7);
    width: 250px;
    margin: 10px 14px 10px 10px;
    line-height: 1.1em;
    font-size: .8em;
    font-weight: 400;
    font-style: normal;
    background-color: transparent;
    color: var(--text-color);
}

div#inline-box p,
div#inline-box-rt p {
    line-height: .9em;
    font-size: .8em;
    font-weight: normal;
    font-style: normal;
    color: var(--text-color-2);
}
/*  DIVs used in "messages" (as in the delete temp) */
div.warning {
	background-color: #401F22;
	border: 1px solid #660000;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
	color: #FF0000;
	font-weight: bold;
	margin: 2em 0 1em;
	padding: .5em 1em;
	margin-top: auto;
    margin-bottom: auto;
	text-align: justify;
}
div.header-notice,
.copyright-notice {
	background-color: transparent;
	border: 1px solid var(--accent-1);
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
	color: #000;
	padding: .5em 1em;
    margin: auto;
    width: 80%;
    line-height: 110%;
    font-size: 95%;
	text-align: justify;
}
div.header-notice table {
    background-color: transparent;
	padding: 1px;
}
div.notice {
	background-color: #401F22;
	border: 1px solid #CC0000;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
	color: #FFFFFF;
	margin: 2em 10% 1em 10%;
	padding: .5em 1em;
	text-align: justify;
	font-size: smaller;
}
div.header-notice#fa {
    width: auto;
	font-size: inherit;
}
div.notice p,
div.header-notice p,
div.warning p {
	line-height: 120%;
}
div span.msg-title {
    display: block;
	width: 100%;
	color: #FFD942;
	text-align: center;
	font-size: 150%;
	font-weight: bold;
	border-bottom: 1px solid #666;
}
.tr-tit {
    font-family: "Maven Pro","Nunito","Rubik",sans-serif!important;
    font-weight: bold;
}
/*  ============
    Wikipediainfo
    and Image links tags
    ============

    This puts {{wikipediainfo}} 
    on the top left side of the page */

#wikipedia-info,
.wikipedia-info,
div#wikipedia-info {
    float: left;
    margin-right: 5px;
    margin-top: 15px;
}
/*  This places {{protect}} and {{lock}} 
    underneath {{wikipediainfo}} in case 
    they're ever on the same page together. */
.protect,
div#protect {
    float: left;
    margin-right: 5px;
    margin-top: 15px;
}
.type-of-article,
div#type-of-article {
    float: left;
    margin-right: 5px;
    margin-top: 15px;
}
/*  =======================
    SHORTCUTS
    the little boxes that say
    T: WHATEVER
    in the upper right hand corner
    of pages
    =======================
    Base style probably originated
    at en.wikipedia, but has spread
    to some of the larger Wikia
    wikis like Wookiee, The Vault and MA
    ======================== */

div.shortcut {
    float: right;
    background: transparent;
    border: 1px solid var(--accent-4);
    padding: 0.65em;
    margin: 10px 10px 10px 10px;
    text-align: center;
    font-size: smaller;
    font-weight: bold;
    width: auto;
}

/*  ===============
    TIMELINE
    =============== */

.timeline a: visited,
.timeline a: link {
    color: #ccdfff
} 
.timeline a: hover {
    color: #fff9d4;
    background: none;
}

.timeline {
    color: #fff;
    background: #012c57;
    background: -moz-linear-gradient(top,  #012c57 0%, #012c57 35%, #4e7dab 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#012c57), color-stop(35%,#012c57), color-stop(100%,#4e7dab));
    background: -webkit-linear-gradient(top,  #012c57 0%,#012c57 35%,#4e7dab 100%);
    background: -o-linear-gradient(top,  #012c57 0%,#012c57 35%,#4e7dab 100%);
    background: -ms-linear-gradient(top,  #012c57 0%,#012c57 35%,#4e7dab 100%);
    background: linear-gradient(top,  #012c57 0%,#012c57 35%,#4e7dab 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#012c57', endColorstr='#4e7dab',GradientType=0 );
    overflow: visible;
    border-color: transparent;
    text-align: center;
    font-size: 0.85em;
    float: right;
    clear: right;
    width: 250px!important;
    min-width: 250px!important;
    margin-bottom: 10px;
    margin-right: 10px;
}

/*  =========================
    SPECIAL STYLES
    mainly used in template design
    =========================
    These designs are all unique
    to tardis.wikia.com and were
    created by CzechOut
    ========================= */

#editpage-specialchars,
#glow {
    background-color: transparent;
	border: 1px solid var(--accent-1);
	padding: .5em 1em;
    margin: auto;
    width: 95%;
    line-height: 110%;
    font-size: 95%;
	text-align: justify;
       -moz-box-shadow: -0px 0px 40px var(--accent-4);
    -webkit-box-shadow: -0px 0px 40px var(--accent-4);
        -ms-box-shadow: -0px 0px 40px var(--accent-4);
         -o-box-shadow: -0px 0px 40px var(--accent-4);
            box-shadow: -0px 0px 40px var(--accent-4);
}
#quote-nom {
    background-color: transparent;
	border: 1px solid var(--accent-1);
	margin-right: 260px; 
	padding: .5em 1em;
	vertical-align: middle;
    margin-left: auto;
    margin-right: auto;
    line-height: 110%;
    font-size: 95%;
	text-align: justify;
       -moz-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
    -webkit-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
        -ms-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
         -o-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
            box-shadow: inset -0px 0px 25px #e5c076 4px;
}
#license {
    background-color: transparent;
    border: solid 2px #8495b3;
    border-radius: 14px;
    margin: auto;
    padding: .5em 1em;
    width: 80%;
    line-height: 110%;
    font-size: 95%;
    font-family: "Rubik";
    text-align: left;
    position: relative;
    left: -1px;
}
#license + #license {
    margin-top: 7.04px;
}
#license h1 {
    margin-top: 11.62px;
}
#license h1:after {
    border-bottom: solid 4px #1a2e53;
    border-bottom: solid 2px #6f8cc1;
    margin-top: 10px;
}
#license a img {
    position: relative;
    top: -2.82px;
}
.smw-editpage-help,
#box  {
    font-weight: normal;
    background-color: var(--primary-9);
    border: 1px solid var(--primary-3);
    color: inherit;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    padding: 16px;
    margin-top: 13px;
    margin-bottom: 25px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 21px;
    font-size: 95%;
}

#box-rt  {
    font-weight: normal;
    background-color: transparent;
    border: 2px solid var(--accent-1);
    color: #000;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    padding: 10px;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: auto;
    margin-right: auto;
    font-size: 95%;
}

#box-lt  {
    font-weight: normal;
    background-color: transparent;
    border: 1px solid var(--accent-1);
    color: #000;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    padding: 10px;
    margin: 25px auto 25px auto;
    font-size: 95%;
}
#th {
    font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif;
    font-size: 1.8em;
    line-height: 1.2em;
    font-style: italic;
    color: #000;
    font-weight: bold;
}
.error, #error { 
    color: #000;
    font-weight: bold;
} 
.error, #error,
#tech, .tech  {
    width: 95%;
    font-weight: normal;
    background-color: transparent;
    border: 1px solid var(--accent-1);
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    padding: 10px;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: auto;
    margin-right: auto;
    font-size: 95%;
}
:root.theme-dark #tech,
:root.theme-dark .tech {
    border-color: #1a2e53!important;
    background-color: #081d3f!important;
}
:root.theme-dark .ns-3 #tech + #tech {
    background-color: #132b55!important;
}

#mainpage-highlight { 
    margin-bottom: 15px;
    padding: 5px;
    background-color: transparent;
    border: 1px solid #e5c076;
}
#crewtop { 
    background: transparent;
       -moz-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
    -webkit-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
        -ms-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
         -o-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
            border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
    border: 3px solid var(--accent-1);
    clear: both;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    padding: 10px;
    font-size: .90em;
    line-height: .95em;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
#crew { 
    background: transparent;  
    -webkit-border-radius: 0px 0px 10px 10px;
       -moz-border-radius: 0px 0px 10px 10px;
        -ms-border-radius: 0px 0px 10px 10px;
         -o-border-radius: 0px 0px 10px 10px;
            border-radius: 0px 0px 10px 10px;
    clear: both;
    width: auto;
    padding: 11px;
    border: 2px solid var(--accent-1);
    margin-left: auto;
    margin-right: auto;
    font-size: 0.80em;
    line-height: .90em;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
:root.theme-dark .skin-timeless #crewtop,
:root.theme-dark .skin-timeless #crew {
    background: var(--primary-25);
    border-color: var(--contrast-color-3); /* var(--primary-21) */
    box-shadow: 22vw 0 22vw var(--primary-24) inset;
}
:root.theme-dark .skin-timeless #crewtop tr > td:only-child > hr {
    border-color: var(--primary-7);
}

#crew p {
	margin-bottom: 0px;
}
.stitched {
    padding: 5px 10px;
    margin: 10px;
    line-height: 100%;
    border: 1px solid var(--accent-1);
    -webkit-border-radius: 10px 0px 0px 10px;
       -moz-border-radius: 10px 0px 0px 10px;
        -ms-border-radius: 10px 0px 0px 10px;
         -o-border-radius: 10px 0px 0px 10px;
            border-radius: 10px 0px 0px 10px;
    font-weight: normal;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
.key, #key {
    font-size: .9em;
    background-color: inherit; 
    border: 1pt outset var(--accent-1);
    text-align: center; 
    vertical-align: middle; 
    padding: 2px;
    margin: 2px;
    font-weight: bold;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
#block {
    display: block;
    height: 30px;
    width: 100px;
    border: 1px solid var(--accent-1);
    margin: 5px;
}

/* Dabtag and mosbox */
.dabtag,
#dabtag {
    border: 2px solid var(--accent-1);
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
         -o-border-radius: 0;
        -ms-border-radius: 0;
            border-radius: 0;
    overflow: hidden;
    font-size: 0.80em;
    line-height: .95em;
    display: inline-block;
    width: 276px; /* this is precise width of two stub tags */
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 17px!important; /*overrides the div.dabtag elsewhere */
    float: left;
    line-height: 130%;
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    clear: left;
}
.dabtag, #dabtag {
    padding-top: 1px;
    background: none;
    border: 2px solid var(--accent-1);
    width: 274px;
    border-radius: 3px 3px 8px 4px;
}


/*improves formatting on smaller screen sizes*/
.dabtag + p, #dabtag + p {
    word-wrap: normal;
}

#mosbox {
    font-family: "Maven Pro","Nunito","Rubik",sans-serif;
    text-transform: none;
    letter-spacing: 0px;
    line-height: 120%;
    word-break: normal;
    font-size: 16px; 
    word-wrap: break-word;
}
#mos-summary {
    font-style: italic;
    margin: 25px;
    border-bottom: 2px solid #b0b0b0;
    font-size: 150%;
    padding: 10px;
    font-weight: normal;
    line-height: 150%;
    font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif;
}
.mosheadcolor {
    color: #000;
}
.moscolor { 
    color: #000;
}

/* ==============
   DPL formats 
   ============== */

.dpl3 {
    vertical-align: top;
    width: 100%;
    margin: 0 auto;
}

/* ==========================
   Equally sized table widths
   ========================== */
   
table.twelve-equal-columns,
table.eight-equal-columns,
table.five-equal-columns,
table.four-equal-columns {
  table-layout: fixed;
  width: 100%!important; /*!important is necassary*/
}
td.twelve-equal-columns {
	width: 8.33333333333333%;
}
td.eight-equal-columns {
	width: 12.5%;
}
td.five-equal-columns {
  width: 20%;
}
td.four-equal-columns {
  width: 25%;
}

/* ======================
   Collapsible navfoboxes 
   ====================== */
   /*using : has() would improve this template but it doesn't work on Firefox yet. De-comment this selector when https: //developer.mozilla.org/en-US/docs/Web/CSS/: has#browser_compatibility says that firefox support exists */
.collapsible-navfobox aside: has(div.mw-collapsed) {
	margin-bottom: 1px;
}
.collapsible-navfobox h2: has(div.mw-collapsed) {
	padding: 0px!important;
	border-top: none!important;
}
.collapsible-navfobox nav: has(div.mw-collapsed) {
	padding-top: 0px!important;
}
.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3): has(div.mw-collapsed) {
	margin-top: 0px;
}
/* Firefox workaround */
@media all and (min--moz-device-pixel-ratio: 0) {
	.collapsible-navfobox aside {
		margin-bottom: 1px;
	}
	.collapsible-navfobox h2 {
		padding: 0px!important;
		border-top: none!important;
	}
	.collapsible-navfobox nav {
		padding-top: 0px!important;
	}
	.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3) {
		margin-top: 0px;
	}
}

/* NWLH */
.NWLH a.external {
	background: none;
	padding-right: 0;
}

/* making the last tab default for some tabbed galleries in infoboxes */
.default-last-tab .wds-tabs .wds-tabs__tab: first-child {
	order: 9999;
}

/* {{Pullout}} */
.pullout-wrapper {
	float: right;
	display: flex;
    margin-top: 8px;
    margin-bottom: 12.6px;
    position: relative;
    z-index: 20;
}
.pullout-handle {
	background-color: var(--accent-2);
	border-radius: 24px 0px 0px 24px;
	width: 40px;
	height: 56px;
	padding-left: 14px;
	font-size: 2em;
	color: var(--primary-1);
	transition: background-color 1s, width 1s;
}
.pullout-handle: hover {
	background-color: var(--accent-1);
	width: 55px;
}
.pullout-content {
	border: 1px solid var(--accent-1);
}
.pullout-content div#article-type {
    margin: 0px;
    max-width: 38em;
}
.pullout-left-arrow {
	display: none;
}

@media screen and (min-width: 851px) {
    .pullout-content div#article-type {
    	min-width: 47vw;
        max-width: 54.82em;
        position: relative;
        border-right: solid 1em var(--accent-26);
    }
    
    .mw-parser-output:has(.dabtag) > .pullout-wrapper > .pullout-content div#article-type {
        max-width: unset;
    }
    
}

/* {{subpage tabs}} */
/* see also: Template:Subpage tabs/styles.css for non-colour styles */
.subpage-tabs-main {
	border: 2px solid var(--accent-2);
	color: var(--alt-text-color);
}
.subpage-tabs-tab {
	background-color: var(--accent-6);
}
.subpage-tabs-main a, .subpage-tabs-main a: visited, .subpage-tabs-main a: hover, .subpage-tabs-main a: hover: visited {
	color: var(--alt-text-color);
}

.RW-box {
	border: 1px solid var(--accent-1);
	padding: 5px;
	margin-top: 2px;
}

/* =====================
   CSS for wip templates 
   ===================== */
/* content warning templates on [[User: Bongolium500/Sandbox 9]]*/
div.type-trigger {
    background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/79/Trigger_Template_200px.jpg) no-repeat;
    z-index: 5;
}
   
/* recent releases homepage module */
div.mainpage-box-recent div.recent-release-box {
	border: var(--accent-1) 2px solid;
	background: var(--primary-2);
	margin: 3px;
	border-radius: 25px;
}
div.mainpage-box-recent {
	border: var(--accent-1) 2px solid;
	background: var(--accent-1);
	border-radius: 28px;
}
.mainpage-box-recent .read-more-button {
	background: var(--accent-1);
	color: var(--primary-1);
	padding: 7px 50px 5px 50px;
	border-radius: 15px;
	transition: background 0.5s, color 0.5s;
	transition-timing-function: ease;
}
.mainpage-box-recent .read-more-button: hover {
	background: var(--accent-3);
	color: var(--primary-2);
}
.mainpage-box-recent .floatright,
.mainpage-box-recent .floatleft {
	margin: 0px;
}
.mainpage-box-recent .floatright img {
	border-radius: 0px 24px 24px 0px;
}
.mainpage-box-recent .floatleft img {
	border-radius: 24px 0px 0px 24px;
}
.mainpage-box-recent p {
	margin-bottom: 10px;
	display: inherit!important; /*required to get the paragraph under the read more button to show up. This is needed so that the button has some space before the bottom of the box. */
}
.mainpage-box-recent p+p {
	margin-top: 12px;
}

/* adapted from https: //stackoverflow.com/a/37120036 by Jacob G under CC-BY-SA 4.0 */
.horizontal-line {
	background: linear-gradient(transparent 42.5%, var(--accent-1) 42.5%, var(--accent-1) 57.5%, transparent 57.5%);
	padding: 5px;
	width: 35px;
	display: inline-flex;
	margin: 0px 5px;
}

/* {{TriggerImage}} */
.trigger {
	position: relative;
}
.trigger p.trigger-warning {
	position: absolute;
	width: 180px;
	text-align: center;
	padding: 15px 0;
	z-index: 0;
}
.trigger a.image {
	padding: 55px 0;
	z-index: 1;
	position: relative;
	border: var(--accent-1) 2px solid;
}
.trigger img {
	visibility: hidden;
}

/* [[User:Bongolium500/The Faceless Ones (TV story)/Home media]] */
.home-media-timeline-table {
	float: left;
	min-width: 320px;
	margin-right: 20px !important;
}
.home-media-easytimeline-wrapper {
	margin-left: 330px;
}
.home-media-easytimeline-wrapper .mw-collapsible-toggle {
	float: left;
}
.home-media-nav-table th a,
.home-media-release-table th a,
.home-media-features-table th a {
	color: var(--alt-text-color);
	text-decoration: underline;
}
.home-media-nav-table {
	float: right;
	clear: right;
}
.home-media-features-table {
	width: 100%;
}
.home-media-features-table .home-media-features-table-center {
	float: center;
}
.home-media-features-table .home-media-features-table-right {
	float: right;
}
.home-media-age-ratings-table {
	float: right;
	clear: right;
}
.compact-section-toc {
	text-align: center;
	width: 50%;
	word-wrap: break-word;
	border: 1px solid var(--accent-1);
	padding: 10px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	font-size: 95%;
}
.back-box {
	float: right;
	border: 1px solid var(--accent-1);
	padding: 0.65em;
	margin: 10px 10px 10px 10px;
	text-align: center;
	font-size: smaller;
	font-weight: bold;
}