MediaWiki:Theme-light.css

From Tardis Wiki, the free Doctor Who reference
(Redirected from CSS:LIGHT)
Clear your cache often around here

After changes are made to this site's CSS or Javascript, you have to bypass your browser's cache to see the changes. You can always do this by going to your browser's preferences panel. But many browsers also offer keyboard shortcuts to save you that trouble. The following shortcuts work in the versions of the browsers that Tardis currently supports. They may not work in earlier versions.

  • Firefox: hold down Shift while performing a page reload.
  • Opera offers no default keyboard shortcut, but you can create a custom keyboard shortcut with the value Clear disk cache
  • Safari users should simultaneously hold down + Option + E. You may need to enable the Develop menu first
  • Chrome: press Ctrl + F5 or Shift + F5 while performing a page reload.
/* LIGHT MODE V 1.0 */
/* Designed principally by [[User:SOTO]] */

:root {
	--H-1: 222deg;
    --H-2: 224deg;
    --H-3: 214deg;
    --H-4: 19deg;
    --H-5: 198deg;
    --H-6: 236deg;
    --H-7: 218deg;
    --H-7b: 217deg;
    --H-8: 228deg;
	--text-color: #0e191a;
	--text-color-2: #44474e;
	--text-color-3: #24201e;
	--text-color-4: #182546;
	--text-color-5: #101420;
	--text-color-6: #313950;
	--text-color-7: #1a233c;
	--text-color-8: #546785;
	--text-color-9: #3b4c65;
	--text-color-10: #232734;
	--primary-1: #fff4ef;
	--primary-2: #90a2bf;
	--primary-3: #4f6087;
	--primary-4: #bec9da; /*up for grabs*/
	--primary-5: #f5dfd4;
	--primary-6: #ddd8d5;
	--primary-7: #ebe3e0;
	--primary-8: #777f95;
	--primary-9: #304275;
	--primary-10: #fbeeeb; /*f7e5e0*/
    --primary-11: #fbeeea; /*ebdbd6*/
    --primary-12: #f7eeeb; /*ddc6bf*/
    --primary-13: #e3d6d2;
    --primary-14: #f3e1d9;
	--primary-15: #e3d1c8;
	--primary-16: #d9c9c1;
	--primary-17: #2e4074;
	--primary-18: #e9e0dc;
	--primary-19: #2d417a;
	--primary-20: #22397a;
	--primary-21: #f3e1d9;
	--primary-22: #224a75;
	--primary-23: #091c50;
	--primary-24: #454a72;
	--primary-25: #5c6080;
	--primary-26: #6d739b;
	--primary-27: #464d6a; /* 424667 */
	--primary-28: #40445f;
    --primary-29: #7c82a9; /* review */
	--primary-30: #3a4069; /* review */
	--primary-31: #f0e6e0;
	--primary-32: #334989;
	--accent-1: #556375;
	--accent-2: #47639E;
	--accent-3: #46619b;
	--accent-4: #334671;
	--accent-5: #324b83;
	--accent-6: #506593;
    --accent-7: #2a498a;
	--accent-8: #324268;
    --accent-9: #425278;
    --accent-10: #3d5c7d;
    --accent-11: #27394c;
	--accent-12: #5b6a8e;
	--accent-13: #3b4660;
	--accent-14: #264a70;
	--accent-15: #858da7;
	--accent-16: #7793b1;
	--accent-17: #303a4c;
	--accent-18: #354d91;
	--accent-19: #3e577a;
	--accent-20: #435981;
	--accent-21: #485875;
	--accent-22: #515f87;
	--accent-23: #8daadd;
	--accent-24: #8aa7da;
	--accent-25: #90a1c8;
	--accent-26: #5a6a8d;
	--accent-27: #637099;
	--accent-28: #404c7c;
	--accent-29: #394870;
	--alt-text-color: #ffffff;
	--alt-text-color-2: #e9ebf1;
	--alt-text-color-3: #bec7d9;
    --alt-text-color-4: #dadfe8;
	--contrast-color-1: #6b778f;
	--contrast-color-1--rgb: 107,119,143;
	--contrast-color-2: #2d2724;
	--contrast-color-3: #687a99;
	--contrast-color-4: #737f92;
    --contrast-color-5: #687a99;
    --contrast-color-6: #bec7d9;
    --contrast-color-7: #4a628c;
    --contrast-color-8: #b8c2d4;
    --contrast-color-9: #3f4a5c;
    --contrast-color-10: #cdc7c5;
    --contrast-color-11: #aeafba;
    --contrast-color-12: #a5a6b7;
    --contrast-color-13: #a0a2b1;
    --contrast-color-14: #717381;
    --contrast-color-15: #212e42;
    --contrast-color-16: #030d3a;
    --contrast-color-17: #535676;
    --contrast-color-18: #3c4854;
    --contrast-color-19: #b9b0ad;
    --contrast-color-20: #b3bed7;
    --contrast-color-21: #c0c6d2;
    --contrast-color-22: #d9dce3;
    --contrast-color-23: #dadde5;
	--border-shade: #ffffff;
	--border-shade-2: #002c91;
	--background-contrast-shade: #e0e0e2;
	--background-contrast-shade-2: #d2d2d2; /*exclusive to light mode #799be9*/
	    --integrate-sections: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--primary-25);
		--subtle-shadow-1: drop-shadow(-12.04px -3.3px 17.7px #06173561);
		--subtle-shadow-2: drop-shadow(-2.04px -3.3px 17.7px #06173561);
		--subtle-shadow-3: drop-shadow(-2.04px -0.3px 17.7px #06173561);
		--stub-tab: -3.5px -1px 0 5px var(--primary-7),3.7px -1px 0 5px var(--primary-7),-3.5px -1px 0 7px var(--contrast-color-11),3.7px -1px 0 7px var(--contrast-color-11)!important;
		--sidebar-dropdown-1: 0 0 0 7px var(--primary-10), -2.8px 0.4px 0 11px #9aa2b0, 6px -1.6px 0 10px #9aa2b0, -4px 2.4px 0 11px #828b9d, 6px 2.4px 0 10px #9aa2b0, -20px 0 0 0 #828b9d;
		--sidebar-dropdown-1b: -26.78px 56px 0 -4px #828b9d, -14.2px 54px 0 -4px #9aa2b0, 18px 65px 0 -4px #828b9d, 17px 78px 0 -4px #9aa2b0, 17px 56px 0 -4px #828b9d;
		--category-box-1: 0 12px 0 0 #4e6795, -73px 0 0 0 #2b4778 inset, 0 -10px 0 0 #415b87, 0 -35px 0 #4b699b, -240px 8px 0 #77849bd6, 30px 0 0 #7685a3, 30px -20px 0 #374764d9, -222px -15px 12px 20px #486293d9, -30px -37px 0 #335eb9, -30px -37px 0 #516891, 68.4em -47px 0 #6f88b3;
		--category-box-2: -99em 3.12em #2d4670e3, -69.6em 1.92em #3a5a91e3, -99em 1.396em 0 -1.26em #243654b0, 0 -0.91em 0 #7187a9d6 inset, -105em 2.09em 0 #7187a9d6;
		
		--category-box-5: box-shadow: 0 12px 0 0 #7383a0, 0 28px 0 #d2c6c0, -73px 0 0 0 #8b9ebe inset, 0 -10px 0 0 #6f87ae, 0 -19px 0 #f1e8e4, 0 -30px 0 #6c7fa2, 0 -33px 0 #a0b3d6!important;
	
}

#menus-cover {
	background-position-x: 298.394em;
    opacity: .69;
    filter: brightness(0.99) hue-rotate(226deg) contrast(1.1) blur(.45px);
}

#mw-header-container {
    background: var(--accent-9);
    outline: solid 3px var(--TEXT-B-H2);
    box-shadow: 0 8px 0 0 var(--text-color-8);
}
.skin-timeless.mediawiki {
    box-shadow: 1px 5px 0 1px var(--TEXT-B-H2) inset;
}
.skin-timeless #mw-content {
    background: #e9dfda; /*SOTO: needs variable*/
    border-color: #e5dfdc; /*SOTO: needs variable*/
    filter: var(--subtle-shadow-1);
    /* box-shadow: -2px 0 0 6px var(--primary-7),-2px 0 0 9px var(--primary-3); */
    box-shadow: -2px 0 0 6px var(--primary-7),-2px 0 0 9px var(--primary-3), 8px 0 0 1px var(--accent-28), -12px 0 0 1px var(--accent-21), 8px 9px 0 1px var(--accent-28), -12px 9px 0 1px var(--accent-21);
}

#mw-header-container::after {
    content: " ";
    display: block;
    height: 6px;
    width: 100vw;
    /* background: var(--accent-17); */
    background: var(--accent-8);
    position: fixed;
    bottom: -1px;
    margin-right: -120.6882vw;
    box-shadow: 0 -3px 0 0 var(--accent-8), 0 4px 0 0 var(--accent-8);
}

.skin-timeless:not(.action-edit) .mw-parser-output {
    position: relative;
    right: -3px;
    top: -5px;
}
.skin-timeless:not(.action-edit) .mw-body#content { /* Redundancy? */
    margin-left: -2px;
}
.skin-timeless.ns-6 .mw-body#content {
    position: relative;
    left: 1px;
}
.skin-timeless a, .skin-timeless .mw-parser-output a.external, .skin-timeless .mw-parser-output a.extiw {
    color: var(--primary-20);
}
.skin-timeless .mw-headline a {
    color: var(--primary-19);
}
.skin-timeless h2 .mw-headline a,
.skin-timeless h3 .mw-headline a {
    color: var(--primary-30);
    border-bottom: solid 2px var(--primary-29);
}
.skin-timeless h2 .mw-headline a:hover,
.skin-timeless h3 .mw-headline a:hover {
    color: var(--primary-9);
    border-bottom-color: var(--primary-20);
    text-decoration: none;
}
#mw-site-navigation .timeless-logo img {
    filter: drop-shadow(-1.04px 0px 3.9px #213250) saturate(.8364) brightness(1.37) opacity(0.93) hue-rotate(338deg);
}
#mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk {
    border-top-right-radius: 1px;
    border-bottom-right-radius: 1px;
    left: 4.5px;
    /* background: var(--contrast-color-10);
    border-color: var(--primary-7); */
    border-color: var(--contrast-color-5);
    background: var(--primary-31);
    filter: var(--subtle-shadow-1);
}

.skin-timeless .mw-parser-output > h2 {
    border-color: var(--contrast-color-15);
    color: var(--contrast-color-18);
    font-weight: 700;
    margin-left: -0.0068em;
    top: 1px;
}
.skin-timeless .mw-parser-output > h2 .mw-headline {
    margin-left: -1px; 
}

.skin-timeless .mw-parser-output > h2:after {
    border: 2.88px solid var(--primary-6);
}

.mw-editsection a {
    color: var(--accent-28);
    font-weight: bold;
}

.skin-timeless .mw-parser-output > h3 {
    margin-left: 0.1428em;
    font-weight: 700;
    font-size: 1.298648rem;
    color: var(--primary-27);
}
.skin-timeless .mw-parser-output > h3 + h4 {
    /* margin-top: -13.12px; */
}
.skin-timeless .mw-parser-output > h4 {
    color: var(--accent-8);
    left: 2px;
}
.skin-timeless .mw-parser-output > h5, .skin-timeless .mw-parser-output > h6 {
    color: var(--accent-8);
}
.skin-timeless .mw-parser-output > h3, .mw-parser-output > h4,
.skin-timeless .mw-parser-output > h5, .mw-parser-output > h6 {
    border-color: var(--contrast-color-16);
}

div#inline-box {
    background: var(--primary-7);
    border: 1px solid var(--accent-5);
}

@media screen and (min-width: 1100px) {
	#mw-site-navigation .sidebar-chunk,
	#mw-related-navigation .sidebar-chunk {
    	border-color: var(--contrast-color-13);
	      -moz-box-shadow: var(--integrate-sections);
	   -webkit-box-shadow: var(--integrate-sections);
	        -o-box-shadow: var(--integrate-sections);
	       -ms-box-shadow: var(--integrate-sections);
	           box-shadow: var(--integrate-sections);
	}
	#mw-site-navigation .sidebar-chunk {
    	left: 10.5px;
	}
}

#mw-site-navigation .sidebar-chunk h3,
#mw-related-navigation .sidebar-chunk h3 {
    color: var(--contrast-color-17);
    font-weight: bold;
    letter-spacing: .435px;
    padding-bottom: 6px;
    border-bottom-color: var(--contrast-color-19)!important;
}
#mw-site-navigation .sidebar-chunk h3 a,
#mw-related-navigation .sidebar-chunk h3 a {
    font-weight: 500;
}
#mw-site-navigation .sidebar-chunk a,
#mw-related-navigation .sidebar-chunk a {
	color: var(--text-color-4);
}
#mw-site-navigation .sidebar-chunk#site-navigation a {
	color: var(--text-color-2);
}

#mw-related-navigation .sidebar-chunk#page-tools .mw-inputbox-centered .mw-ui-input {
      -moz-box-shadow: 0 0 0 2.9px #8c8fa7,0 0 0 5.19px var(--primary-8), 6px 39px 20px -10px var(--contrast-color-23);
   -webkit-box-shadow: 0 0 0 2.9px #8c8fa7,0 0 0 5.19px var(--primary-8), 6px 39px 20px -10px var(--contrast-color-23);
        -o-box-shadow: 0 0 0 2.9px #8c8fa7,0 0 0 5.19px var(--primary-8), 6px 39px 20px -10px var(--contrast-color-23);
       -ms-box-shadow: 0 0 0 2.9px #8c8fa7,0 0 0 5.19px var(--primary-8), 6px 39px 20px -10px var(--contrast-color-23);
           box-shadow: 0 0 0 2.9px #8c8fa7,0 0 0 5.19px var(--primary-8), 6px 39px 20px -10px var(--contrast-color-23);
}
#mw-related-navigation .sidebar-chunk#page-tools .mw-inputbox-centered .mw-ui-button {
    /* background: #9098ac; */
    background: #5e6985; /*SOTO: new variables*/
    border: solid 2px var(--primary-8);
     -moz-box-shadow: 0 0 0 2.06px #d9d9db, -21px 0 20px #45506e inset, 14px 4px 20px #7180a9 inset; /*SOTO: new variables*/
  -webkit-box-shadow: 0 0 0 2.06px #d9d9db, -21px 0 20px #45506e inset, 14px 4px 20px #7180a9 inset;
       -o-box-shadow: 0 0 0 2.06px #d9d9db, -21px 0 20px #45506e inset, 14px 4px 20px #7180a9 inset;
      -ms-box-shadow: 0 0 0 2.06px #d9d9db, -21px 0 20px #45506e inset, 14px 4px 20px #7180a9 inset;
          box-shadow: 0 0 0 2.06px #d9d9db, -21px 0 20px #45506e inset, 14px 4px 20px #7180a9 inset;
    color: #dfe0e5; /*SOTO: new variables*/
}
.ns-8 .sidebar-chunk#page-tools .mw-inputbox-centered {
    top: 22.23em;
    left: -5.3px;
}

#t-contributions a {
    color: var(--text-color-8);
}
#ca-nstab-user a,
#ca-nstab-user + #ca-talk a,
#ca-talk.selected a,
 #ca-addsection a {
    color: var(--text-color-9)!important;
}
#ca-nstab-user.selected a,
#ca-nstab-user + #ca-talk.selected a {
    color: var(--text-color-8)!important;
}

.skin-timeless ul#filetoc,
.skin-timeless .toc,
.skin-timeless .toccolours,
.skin-timeless .mw-warning {
	background: var(--accent-12);
    border-color: var(--primary-8);
    margin-right: -0.601em;
    margin-top: 0.81em;
    margin-left: 0.74em;
}
.skin-timeless .smw-callout-warning {
    background: var(--primary-7);
    border-left: solid 6px #c5a570;
}
.skin-timeless .ns-talk .toc {
    filter: saturate(1.45);
}
.skin-timeless .mw-body .toctitle {
    border-bottom: solid 3.4px var(--contrast-color-8);
}
.skin-timeless #filetoc {
    background: var(--accent-29)!important;
    border: none!important;
    outline: solid 5px var(--accent-19);
    filter: var(--subtle-shadow-3);
}
.skin-timeless .toc ul {
    background: var(--primary-3);
    box-shadow: 0 10px 0 20px var(--primary-3);
    border-radius: 0 0 10px 10px;
}

.skin-timeless .gallery {
	margin-bottom: 20.4px;
	margin-left: 5.008px;
}

.skin-timeless div.mw-edit-longpagewarning,
.skin-timeless div.mw-editinginterface,
.skin-timeless div.mw-warning-with-logexcerpt {
    background-color: var(--primary-6);
}
.skin-timeless div.mw-warning-with-logexcerpt p,
.skin-timeless div.mw-warning-with-logexcerpt a {
    color: #32466a!important;
    filter: none!important;
}
.skin-timeless div.mw-warning-with-logexcerpt p strong,
.skin-timeless div.mw-warning-with-logexcerpt p span[style] {
    color: var(--text-color-2);
    font-weight: 600!important;
}
.skin-timeless .toctogglelabel {
    color: var(--primary-1);
    font-size: 1.052em; /* 16.832px at normal font size */
}

.skin-timeless .mw-dismissable-notice,
.skin-timeless #localNotice {
    background: var(--primary-7);
    border-color: var(--accent-22);
    color: var(--text-color-2);
    margin-bottom: 0.7522em;
}
.skin-timeless .mw-dismissable-notice a, .skin-timeless #localNotice a,
.skin-timeless .mw-dismissable-notice a:visited, .skin-timeless #localNotice a:visited {
    color: var(--primary-9);
}

.skin-timeless #mw-content:has(.usermessage) .mw-dismissable-notice,
.skin-timeless #mw-content:has(.usermessage) #localNotice {
     background: var(--primary-11);
}
.skin-timeless .usermessage {
     background: var(--primary-18);
     border-color: var(--primary-3);
}


.skin-timeless #subpage-talk {
    filter: saturate(0.58);
}
.skin-timeless .mw-parser-output > #subpage-article ~ .pullout-wrapper,
.skin-timeless .mw-parser-output > .content-table-wrapper:first-child ~ .pullout-wrapper {
      -moz-box-shadow: -20px 0 0 0 var(--primary-7) inset;
   -webkit-box-shadow: -20px 0 0 0 var(--primary-7) inset;
        -o-box-shadow: -20px 0 0 0 var(--primary-7) inset;
       -ms-box-shadow: -20px 0 0 0 var(--primary-7) inset;
           box-shadow: -20px 0 0 0 var(--primary-7) inset;
}
.skin-timeless .pullout-handle {
   	background-color: var(--accent-27);
}
.skin-timeless .portable-infobox .pi-title,
.skin-timeless .portable-infobox .pi-title p {
    background: var(--accent-21);
}
.skin-timeless .pullout-wrapper ~ .portable-infobox .pi-title,
.skin-timeless .pullout-wrapper ~ .portable-infobox .pi-title p {
   	background: var(--accent-26);   
}

.skin-timeless .portable-infobox:nth-of-type(n+2),
.skin-timeless .collapsible-navfobox .portable-infobox {
    border-color: #415c84;
}
.skin-timeless .portable-infobox:nth-of-type(n+2) .pi-header {
    background: #42556d;
}
.skin-timeless .portable-infobox .pi-header + .pi-header {
    background: #556988; /*677893*/
}
.skin-timeless .portable-infobox .pi-header + .pi-header ~ .pi-header:nth-of-type(3) {
    background: #677893; /*8797af*/
}
.skin-timeless .portable-infobox .pi-header + .pi-header ~ .pi-header:nth-of-type(4) {
    background: #8390a5; /*8da0b7*/
}
.skin-timeless .portable-infobox + .portable-infobox:nth-of-type(3) .pi-header:first-of-type {
    background: #627795;
}

.skin-timeless table.wikitable, .skin-timeless #smwtable, .skin-timeless table.smwtable {
    border: solid 3px var(--primary-3);
    outline: solid 3px var(--primary-30);
    box-shadow: 0 0 0 4px var(--primary-25), 0 0 0 7px var(--primary-3), 0px 0 0 8px #0b1f42, 1px 0 0 9px var(--primary-5), -9px 21px 15px 2px var(--primary-6), -12px 12px 15px -2px var(--primary-6), 0px 3px 20px 6px var(--primary-5), 63px 62px 30px -30px var(--primary-7);
    border-radius: 7px;
    font-size: 0.875em;
    margin-top: 26.4px;
}
.skin-timeless h3 + .content-table-wrapper table.wikitable,
.skin-timeless h3 + .content-table-wrapper #smwtable,
.skin-timeless h3 + .content-table-wrapper table.smwtable {
    top: -11.42px;
}
.skin-timeless h2 + h3 + .content-table-wrapper table.wikitable,
.skin-timeless h2 + h3 + .content-table-wrapper #smwtable,
.skin-timeless h2 + h3 + .content-table-wrapper table.smwtable {
    top: -9.42px;
    margin-top: 34.4px;
}
.skin-timeless table.wikitable > tr > th, .skin-timeless table.wikitable > * > tr > th,
.skin-timeless #smwtable tr > th, .skin-timeless table.smwtable > * > tr > th {
    background: #566891; /*SOTO: assign variable*/
}
.skin-timeless .wikitable > tr > th, .wikitable > tr > td,
.skin-timeless .wikitable > * > tr > td {
    background: #e7d9d3;
    border-color: var(--contrast-color-12);
    font-size: 1.04em;
}
.skin-timeless table.wikitable tbody tr:hover td a, .skin-timeless #smwtable tbody tr:hover td a,
.skin-timeless table.smwtable tbody tr:hover td a, .skin-timeless table.wikitable tbody tr:hover td,
.skin-timeless #smwtable tbody tr:hover td, .skin-timeless table.smwtable tbody tr:hover td {
    background: #425576; /*SOTO: assign variable*/
}
.skin-timeless table.wikitable .row-red td,
.skin-timeless div#block.row-red {
    background: #af6f6d!important;
}
.skin-timeless table.wikitable .row-red.hover td {
    background: #9e5755!important;
}
.skin-timeless table.wikitable .row-red.hover td a {
    background: #8d4442!important;
}
.skin-timeless table.wikitable .row-yellow td,
.skin-timeless div#block.row-yellow {
    background: #e6c69b!important;
}
.skin-timeless table.wikitable .row-yellow.hover td {
    background: #ecdab2 !important;
    color: black;
}
.skin-timeless table.wikitable .row-yellow.hover td a {
    background: #fad8ab !important;
    color: black;
}

.skin-timeless #crewtop,
.skin-timeless #crew {
    background: var(--primary-1);
    border-color: var(--accent-12);
    margin-bottom: 0.91em;
}
.skin-timeless #crewtop {
    box-shadow: 12vw 0 22vw #c7c0bc inset;
}
.skin-timeless #crew {
    border: solid 3px var(--accent-9)!important;
    background: #ddd2ce;
    box-shadow: -7vw 15vw 22vw -11vw #e3d8d2 inset;
    margin-bottom: -2.8em;
    color: var(--text-color-6);
}
.skin-timeless #crewtop tr > td:only-child > hr {
    border-color: var(--contrast-color-3);
}

.skin-timeless ul.gallery {
    background: var(--primary-5)!important;
    box-shadow: 17.8vw 12vw 10vw inset var(--primary-16)!important;
    outline: solid 2px var(--border-shade);
    margin-left: -12px;
    position: relative;
    left: -2px;
    top: -1px;
}
.skin-timeless li.gallerybox {
    /* border-color: var(--primary-28); */
    border-color: var(--accent-11);
    outline: solid 2px var(--primary-31);
    position: relative;
    left: 6px;
    top: -2px;
}

.skin-timeless table.navbox {
    background: #353343;
}
.skin-timeless .navbox-group {
    background: #706b9b;
}

.skin-timeless blockquote {
    background: var(--primary-7);
    box-shadow: 1px 1px 2px var(--contrast-color-16), 1px 2px 3px var(--contrast-color-16), 2px 1px 4px var(--contrast-color-16);
    border-bottom: solid 4px var(--accent-1);
}
.skin-timeless blockquote::before {
    color: var(--accent-4);
}
.skin-timeless blockquote:hover {
    box-shadow: 2px 2px 6px var(--contrast-color-18), 3px 3px 8px var(--contrast-color-18), 4px 4px 6px var(--contrast-color-18);
}
.skin-timeless blockquote span.author::before {
    background: #9299a3;
}
.skin-timeless blockquote span.author i {
    background: #f5f0ee;
}

.skin-timeless #license {
    background: var(--accent-4);
    border: solid 6px var(--contrast-color-10);
    outline: solid 5px var(--accent-14);
    filter: var(--subtle-shadow-2);
}
.skin-timeless #license h1 {
    color: #182b55; /*SOTO: check*/
}
.skin-timeless #license h1:after {
    border-bottom: solid 4px #4a5f8e;
    border-bottom: solid 3.8px #616c84; /*4a5f8e*/ /*SOTO: check*/
    margin-top: 8.4px;
}
.skin-timeless #license p,
.skin-timeless #license ul,
.skin-timeless #license dl,
.skin-timeless #license > center,
.skin-timeless #license > center hr,
.skin-timeless #license p a > img:not([alt="BBCLogoSmall.png"]) {
    filter: invert(1);
}

#personal h2,
#personal-extra,
.skin-timeless .tocnumber {
	filter: invert(1) hue-rotate(180deg);
}
.skin-timeless div.editOptions {
	color: var(--alt-text-color);
}

.skin-timeless .mw-footer-container {
    color: black;
}

@media screen and (min-width: 851px) {
    .skin-timeless .mw-footer-container {
        background: #1c3660b0;
    	background: hsl(var(--H-7b) 55% 24% / 69%);
        color: var(--alt-text-color-2);
        box-shadow: 0 -9px 0 0 #0f2856b8;
    }
}
.skin-timeless .mw-footer-container a {
	color: var(--primary-1);
}

#p-banner.mw-wiki-title {
	color: var(--alt-text-color);
}
#p-themes, #p-themes-label, .vector-menu-content-list .mw-list-item a {
	color: var(--alt-text-color);
}
#p-themes-label::after {
	background-color: var(--alt-text-color);
}

/*.mw-portlet-body a {
    color: #ddcfae;
} */


.skin-timeless .subpage-tabs-tab {
    background-color: var(--accent-12);
}
.skin-timeless .subpage-tabs-main a {
    color: var(--alt-text-color);
}
.skin-timeless .subpage-tabs-main a:visited, .subpage-tabs-main a:hover:visited {
    color: var(--alt-text-color-2);
}
.skin-timeless .portable-infobox {
    margin-top: 1.5px; /*light mode only*/
}
.skin-timeless .portable-infobox .pi-media-collection-tabs .pi-tab-link:not(.current) {
    background: var(--contrast-color-8);
}
.skin-timeless .portable-infobox .pi-media-collection-tabs .pi-tab-link.current {
    background: var(--contrast-color-5);
    color: var(--alt-text-color);
}



.skin-timeless .timeline {
    background: #43588a;
    background: -moz-linear-gradient(top, #03213f 0%, #253251 35%, #465f9d 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #03213f), color-stop(35%, #03213f), color-stop(100%, #465f9d));
    background: -webkit-linear-gradient(top, #03213f 0%, #253251 35%, #465f9d 100%);
    background: -o-linear-gradient(top, #03213f 0%, #253251 35%, #465f9d 100%);
    background: -ms-linear-gradient(top, #03213f 0%, #253251 35%, #465f9d 100%);
    background: linear-gradient(top, #03213f 0%, #253251 35%, #465f9d 100%);
}
.skin-timeless #archstrip, .skin-timeless .archstrip {
    background: var(--accent-19);
}
.skin-timeless #tech, .skin-timeless .tech {
    background-color: #eae8d1;
}
.skin-timeless.ns-3 #glow,
.skin-timeless #glow-2 {
    border: solid 2.9px var(--primary-9)!important;
    box-shadow: 0px 0px 29px 0px var(--primary-9)!important;
}
.skin-timeless .mw-message-box-error {
    background-color: #957270;
    border-color: #461010;
    color: var(--alt-text-color);
}
.skin-timeless .mw-message-box-error div {
    background-color: #eae8d1!important;
    color: #000;
}

.skin-timeless:not(.action-edit):not(.action-submit) form:not(.oo-ui-layout) button,
.skin-timeless:not(.action-edit):not(.action-submit) form:not(.oo-ui-layout) input[type="submit"] {
    background-color: var(--accent-3);
    border-color: var(--accent-9);
}
.skin-timeless .mw-ui-button.mw-ui-progressive:not(:disabled),
.skin-timeless .mw-ui-button#mw-createaccount-join {
    background-color: var(--primary-3);
    color: white;
    border: solid 4px var(--contrast-color-5);
}
.skin-timeless .mw-ui-button.mw-ui-progressive:not(:disabled):hover {
    background-color: var(--accent-6);
}
.skin-timeless .smw-editpage-help,
.skin-timeless #box {
    background-color: var(--primary-7);
    border: 2px solid var(--accent-1);
}
.skin-timeless smw-editpage-help a,
.skin-timeless #box a {
    color: var(--accent-14);
}

.skin-timeless #preload-templates #pt-list {
    background-color: var(--TEXT-B-H1);
    color: var(--contrast-color-20);
    filter: invert(1) hue-rotate(180deg);
}
.skin-timeless #preload-templates #pt-list option {
    background: var(--contrast-color-21);
    color: var(--text-color-10);
}
.skin-timeless #preload-templates #pt-list option:not([disabled="disabled"]) {
    background: var(--contrast-color-22);
}
.mw-editform #editpage-copywarn {
    color: var(--alt-text-color-2);
}

#content-bottom-stuff {
    background: var(--primary-5);
    filter: saturate(0.7);
}
#content-bottom-stuff .catlinks {
    background: var(--primary-2);
}
#content-bottom-stuff .catlinks a {
    color: var(--alt-text-color-2);
	filter: saturate(1.1) brightness(0.7);
}

@media screen and (min-width: 851px) and (max-width: 1099px) {

    .skin-timeless #mw-site-navigation {
        z-index: 2;
    }
    .skin-timeless #mw-header-container {
        z-index: 200;
    }
    #mw-header-nav-hack {
        min-height: 12em;
        background: var(--background-image);
        filter: brightness(0.99) hue-rotate(216deg) contrast(1.1) blur(.45px);
        z-index: -1;
        position: absolute;
    }
    #mw-header-nav-hack .color-bar {
        background: #d99c9c66;
        margin-top: 0;
        height: 14.5em;
    }
    .skin-timeless #mw-content-container {
        margin-top: 6.8em!important;
    }
    
    #mw-site-navigation .sidebar-chunk,
    #mw-related-navigation .sidebar-chunk {
        border-color: var(--alt-text-color);
    }
    .sidebar-chunk#page-tools .mw-inputbox-centered {
        position: absolute;
        top: -3.08em!important;
    }
    #mw-related-navigation .sidebar-chunk#catlinks-sidebar {
        margin-top: -0.42em!important;
    }
    .skin-timeless .mw-dismissable-notice {
        /* left: 1.4em; */
    }
	
    .skin-timeless #mw-content-container {
        background: #4d5f7c; /*will save as variable later*/
    }
    .skin-timeless .mw-footer {
        background: #1e3c75b3;
        color: var(--alt-text-color-3);
    }
    .skin-timeless .mw-footer-container a,
    .skin-timeless .mw-footer-container a:hover {
        color: var(--alt-text-color);
    }
}

@media screen and (min-width: 1720px) {
    #menus-cover {
        background-size: 70em!important;
    }
}
@media screen and (min-width: 1860px) {
    #mw-site-navigation .sidebar-chunk#site-navigation {
        left: 0.428em!important;
    }
}

.skin-timeless .mainpage-box-about .header,
.skin-timeless .mainpage-box-characters .header,
.skin-timeless .mainpage-box-how-to-DW .header,
.skin-timeless .mainpage-box-featured-videos .header,
.skin-timeless .mainpage-box-series .header {
    color: var(--accent-7);
    border-bottom-color: var(--accent-1);
}
.skin-timeless .mainpage a,
.skin-timeless .mainpage a:link {
    color: var(--primary-3)!important;
}

.skin-timeless .mainpage-box-welcome {
    background: var(--primary-28);
    border: solid 5px #5c6080;
    margin: 16px -1px;
}
.skin-timeless .mainpage-box-welcome .header {
    color: white!important;
}
.skin-timeless .mainpage-box-welcome p {
    color: var(--alt-text-color-4)!important;
}
/*.mainpage-box-welcome a,
.mainpage-box-welcome a:link,
.mainpage-box-welcome a:visited {
    color: black!important;
}*/
.skin-timeless .mainpage-box-welcome a,
.skin-timeless .mainpage-box-welcome a:link,
.skin-timeless .mainpage-box-welcome a:visited {
    color: #b8bde1!important;
}
.skin-timeless .mainpage-box-welcome .header a:visited,
.skin-timeless .mainpage-box-welcome b a,
.skin-timeless .mainpage-box-welcome b a:link,
.skin-timeless .mainpage-box-welcome b a:visited {
    color: #d2d4e4!important;
}

.skin-timeless #mw-previewheader {
    background: var(--accent-6);
    color: var(--primary-7);
    padding-top: 6px;
    margin-top: -7.8px;
    border-bottom-color: var(--accent-2);
    margin-bottom: -2.21px;
}
.skin-timeless .mw-message-box-warning {
    background: var(--primary-7);
    border-color: var(--accent-6);
    color: var(--accent-9);
}
.skin-timeless .mw-message-box-warning strong {
    color: var(--primary-21);
}
.skin-timeless .mw-message-box-warning a {
    color: var(--primary-21);
    font-size: 1.21464em; /* 19.43424px at normal font size */
    font-weight: 580;
}

.skin-timeless #powersearch {
    background: var(--primary-14);
}
.skin-timeless .mw-body .mw-search-profile-tabs {
    background: var(--primary-15);
    border: solid 3px var(--primary-21);
}
.skin-timeless .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,
.skin-timeless .mw-changeslist-legend,
.skin-timeless .mw-body fieldset#mw-searchoptions,
.skin-timeless .mw_metadata, .skin-timeless .mw-datatable {
    background: var(--primary-16);
    border: solid 3px var(--primary-21);
    filter: invert(1) hue-rotate(22deg) brightness(2.5); /*temporary*/
}
.skin-timeless .mw-prefs-buttons .oo-ui-buttonElement-framed.oo-ui-widget-disabled>.oo-ui-buttonElement-button {
    background: var(--accent-1);
}
.skin-timeless .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
    background-color: var(--accent-24);
    filter: invert(1) hue-rotate(180deg);
}
.skin-timeless .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle.oo-ui-tagItemWidget.oo-ui-widget-enabled {
    filter: invert(1) hue-rotate(180deg);
}
.skin-timeless .mw-rcfilters-ui-row.mw-rcfilters-ui-filterTagMultiselectWidget-views .mw-rcfilters-ui-filterTagMultiselectWidget-views-select {
    background-color: var(--accent-23);
    filter: invert(1) hue-rotate(180deg);
}

@media screen and (min-width: 1340px) {
	#menus-cover {
    	background-position-x: 334.402em;
	}
	.skin-timeless #mw-content {
        margin-right: -0.6882vw;
        left: 8.0802px;
	}
	#mw-site-navigation .timeless-logo img {
    	width: 13.679em;
    	margin-left: calc(-3.04em + 0.4584vw);
    	right: -35.9121px;
    	top: 2.2499em;
    	margin-bottom: 3.04em;
	}
	#mw-related-navigation {
    	padding-top: 2.2087em;
	}
    .skin-timeless:not(.action-edit) #mw-related-navigation {
        padding-top: 3.0087em;
    }
	#mw-related-navigation .sidebar-chunk {
        left: 0.1263px;
    	padding-left: 24px;
    }
    #mw-related-navigation .sidebar-chunk#site-navigation {
    	box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
         -moz-box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
      -webkit-box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
           -o-box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
          -ms-box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
              box-shadow: 0.153em 1.2px 0 var(--contrast-color-1) inset,0px -2px 0 6px var(--contrast-color-12);
    }
    #mw-related-navigation .sidebar-chunk {
        border: solid 5.8px var(--primary-6);
        border-right-width: 1.8px;
        border-radius: 13px;
    }
    /*
    #mw-site-navigation .sidebar-chunk#site-navigation {
        margin-top: 2em;
    }
    .skin-timeless:not(.action-edit) #mw-related-navigation {
        padding-top: 1.0087em;
    } */
    .skin-timeless:not(.action-edit) #mw-related-navigation .sidebar-chunk {
        padding-right: 1.65em;
        padding-bottom: 0;
        margin-bottom: 0.92em;
        border-color: var(--contrast-color-1);
        border-left-color: var(--accent-22);
        border-bottom-width: 7px;
        border-radius: 10px 8px 3px 7px;
        -moz-box-shadow: 0.153em 1.2px 0 #8694af inset, 0px 1px 0 6px #3f4c6c; /*SOTO: needs variables*/
     -webkit-box-shadow: 0.153em 1.2px 0 #8694af inset, 0px 1px 0 6px #3f4c6c;
          -o-box-shadow: 0.153em 1.2px 0 #8694af inset, 0px 1px 0 6px #3f4c6c;
         -ms-box-shadow: 0.153em 1.2px 0 #8694af inset, 0px 1px 0 6px #3f4c6c;
             box-shadow: 0.153em 1.2px 0 #8694af inset, 0px 1px 0 6px #3f4c6c;
    }
    .skin-timeless:not(.action-edit) #mw-related-navigation .sidebar-chunk:nth-of-type(2) {
        margin-bottom: 1.92em;
    }
    #mw-site-navigation .sidebar-chunk {
    	left: 0.06216em;
    }
	.mediawiki.long-page #mw-site-navigation .sidebar-chunk:last-of-type:not(:first-of-type):after {
    	filter: saturate(0.92) brightness(1.032);
		left: 0.0614em;
    	top: 121.92%;
    }
}
@media screen and (max-width: 1099px) {
	.skin-timeless .mw-dismissable-notice, .skin-timeless #localNotice {
	    background: var(--primary-6);
	    border-color: var(--background-contrast-shade-2);
	}
}
@media screen and (max-width: 850px) {
	.skin-timeless .mw-dismissable-notice, .skin-timeless #localNotice {
	    border-color: var(--contrast-color-3);
	}
    .skin-timeless .mw-footer-container {
        background: #90a1bf;
    }
    .skin-timeless .mw-footer a {
         color: var(--text-color);
    }
}
@media screen and (min-width: 851px) and (max-width: 1099px) {
    .skin-timeless #mw-content-container {
        border-bottom-color: var(--border-shade-2)!important;
    }
    .skin-timeless .mw-footer-container {
        background: var(--background-contrast-shade-2);
        border-color: transparent;
        font-weight: 500;
    }
}
@media screen and (min-width: 851px) and (max-width: 1099px) {
	#mw-site-navigation .sidebar-chunk.dropdown-active:not(#page-tools),
    #mw-related-navigation .sidebar-chunk.dropdown-active:not(#page-tools) {
        border-bottom-left-radius: 1px;
        border-top-left-radius: 16.4px;
        border-top-right-radius: 18px;
        box-shadow: -26.78px 56px 0 -4px #828b9d, -14.2px 54px 0 -4px #9aa2b0, 18px 65px 0 -4px #828b9d, 17px 78px 0 -4px #9aa2b0, 17px 56px 0 -4px #828b9d;
        -moz-box-shadow: var(--sidebar-dropdown-1b);
     -webkit-box-shadow: var(--sidebar-dropdown-1b);
          -o-box-shadow: var(--sidebar-dropdown-1b);
         -ms-box-shadow: var(--sidebar-dropdown-1b);
             box-shadow: var(--sidebar-dropdown-1b);
        transition: box-shadow 0.48s;
    }
    #mw-site-navigation .sidebar-inner,
    #mw-related-navigation .sidebar-inner {
        border: solid 6.8px var(--primary-6);
        top: 68.5px;
        -moz-box-shadow: var(--sidebar-dropdown-1);
     -webkit-box-shadow: var(--sidebar-dropdown-1);
          -o-box-shadow: var(--sidebar-dropdown-1);
         -ms-box-shadow: var(--sidebar-dropdown-1);
             box-shadow: var(--sidebar-dropdown-1);
    }
    #mw-site-navigation .sidebar-chunk.dropdown-active .sidebar-inner, #mw-related-navigation .sidebar-chunk.dropdown-active .sidebar-inner {
        left: 5px;
        right: -2px;
    }
}
@media screen and (max-width: 1099px) {
	.mediawiki:not(.ns-8):not(.action-edit) #content-bottom-stuff {
    	background: var(--accent-20);
	}
}
@media screen and (min-width: 1100px) {
    .mediawiki:not(.action-edit) #mw-related-navigation {
        z-index: 2;
    }
}
@media screen and (min-width: 1100px) and (max-width: 1339px) {
	#mw-content {
		position: relative;
		left: 1em;
		padding-left: 1.789em;
	}
	.skin-timeless .pullout-content div#article-type {
		border-right-color: var(--accent-16);
	}/*
	#subpage-article ~ .pullout-wrapper ~ .stub-type,
    #subpage-article ~ .pullout-wrapper ~ #stub-type,
    #subpage-article ~ .pullout-wrapper ~ div#stub-type {
        transform: rotate(90deg) translate(-5px,-3.98px);
    }*/
	#mw-related-navigation .sidebar-chunk {
    	top: 9px;
    	left: 1px;
	}
	#mw-related-navigation .sidebar-chunk:nth-last-of-type(2):after, 
	#mw-related-navigation .sidebar-chunk:nth-last-of-type(1):after{
    	filter: saturate(0.92) brightness(1.032);
    	top: 105.7%;
    }
    .skin-timeless .toc ~ .content-table-wrapper {
    	margin-left: -8.4px!important;
	}
}
@media screen and (min-width: 1340px) {
    .mediawiki:not(.action-edit) #mw-related-navigation {
        z-index: 1;
    }
    #mw-site-navigation .sidebar-chunk {
        left: 0.46216em;
    }
}
@media screen and (min-width: 1860px) {
    .skin-timeless #mw-content {
        margin-left: 1.088vw;
        margin-right: -0.2882vw;
    }
    #mw-site-navigation {
        left: 0.2528vw;
        margin-right: 0.8832em;
    }
    #mw-related-navigation .sidebar-chunk {
        left: calc(2.1263px - 0.4vw);
        padding-left: 24px;
    }
    #mw-site-navigation .timeless-logo img {
        right: -27.9021px;
        top: 2.3499em;
    }
    
}

.skin-timeless .forum-archive {
    box-shadow: 0 0 0 10px var(--accent-11);
}
.skin-timeless .archive-message {
    background: var(--accent-25);
    box-shadow: 0 0 0 4px var(--accent-4), 0 0 0 8px var(--accent-2);
}
.skin-timeless .forum-archive .toc {
    filter: saturate(0.99);
    background: var(--accent-4);
    border-color: var(--accent-4);
}
.skin-timeless .forum-archive .toc ul {
    background: var(--primary-9);
    box-shadow: 0 4px 0 20px var(--primary-9);
}

.skin-timeless .forum-archive > h2 {
    font-weight: 700;
    color: var(--contrast-color-15);
}
.skin-timeless .forum-archive > h2:after {
    border-bottom: solid 2px var(--primary-8);
}
.skin-timeless .forum-archive #tech,
.skin-timeless .forum-archive .tech {
    background-color: var(--primary-7);
    box-shadow: 0 0 0 8px var(--TEXT-A-H1);
}

.skin-timeless .mw-cookiewarning-container {
    background-color: var(--primary-3); /*Temporary colours*/
    box-shadow: -36px 0 #7b85a1, 18px 0 #4f6087, 23px -6px #868fa7, -32px -6px #757593, -32px -11px #757593, 0 7.8px #aeaeb9, -32.535px 6.8px #aeaeb9, 30px -10px #757593, 23px 1px #1d2439, 30px 1px #353549;
	bottom: 8.4px;
}

/* Temporary colour correct */
.skin-timeless .oo-ui-windowManager-modal > .oo-ui-dialog {
    background-color: rgb(229 229 229 / 37%);
}
.skin-timeless .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
    background-color: #f0f0f0;
}
.skin-timeless .oo-ui-flaggedElement-progressive > a.oo-ui-buttonElement-button {
    background: #617aad !important;
}
.skin-timeless .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
    color: var(--alt-text-color);
}

/* Will generate colour variables and fix this up later. */
.skin-timeless .oo-ui-tabSelectWidget-framed {
    background: #252932;
    filter: brightness(1.362);
}
.skin-timeless .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget[aria-selected="false"] span {
    color: var(--alt-text-color);
    background: #414c68;
    padding: 7px;
}
.skin-timeless .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget[aria-selected="true"] {
    background: var(--primary-5);
}
.skin-timeless .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget {
    background: #555f76;
    border-radius: 10px;
    position: relative;
    top: -2.12px;
}

.skin-timeless.ns-116 a:link,
.skin-timeless.ns-116 a:visited {
    color: var(--accent-2);
}
.skin-timeless.ns-116 a:hover {
    color: var(--accent-1);
}

.skin-timeless .sidebar-inner .mw-list-item#n-Donate {
    background-color: #1f2638;
    border-color: var(--accent-4);
    border-width: 4px;
    top: -3.8px;
}