Line 5: |
Line 5: |
| /* Aileron */ | | /* Aileron */ |
| @import url("https://use.typekit.net/bhd4pcd.css"); | | @import url("https://use.typekit.net/bhd4pcd.css"); |
| + | /* Ariel */ |
| + | /* Averia */ |
| + | @import url('https://fonts.googleapis.com/css2?family=Averia+Serif+Libre:wght@400;700&display=swap'); |
| | | |
| @font-face { | | @font-face { |
Line 18: |
Line 21: |
| body { | | body { |
| font-size: large; | | font-size: large; |
− | font-family: aileron,sans-serif; | + | font-family: "Arial",sans-serif; |
| font-weight: 400; | | font-weight: 400; |
| font-style: normal; | | font-style: normal; |
− | background-color: white; | + | background-color: ##f1f1f1; |
− | background-image: url(https://d2w9rnfcy7mm78.cloudfront.net/12043113/original_80c69ac0f24ef97284ced30c86f3e185.png); | + | /* background-image: url(https://labxwiki.s3.amazonaws.com/common/thumb/Background-temp-2.png/1600px-Background-temp-2.png); */ |
− | background-position:left top; | + | /* background-image: url(https://d2w9rnfcy7mm78.cloudfront.net/12168207/original_451377e6bf71f18de13dabbc7d064c96.png); */ |
− | background-repeat: repeat-x; | + | background-position:center top; |
| + | background-repeat: repeat-y; |
| background-attachment: fixed; | | background-attachment: fixed; |
| background-size: cover; | | background-size: cover; |
| + | } |
| + | |
| + | |
| + | |
| + | /* Mainpage */ |
| + | /* hide title */ |
| + | body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { |
| + | display: none; |
| + | } |
| + | |
| + | .largetext{ |
| + | font-size:2em; |
| + | text-align:center; |
| + | font-family:'Averia Serif Libre' |
| + | } |
| + | |
| + | .mp-main-container{ |
| + | width:85%; |
| + | display:flex; |
| + | justify-content:space-between; |
| + | margin-left:auto; |
| + | margin-right:auto; |
| + | margin-bottom:1%; |
| + | margin-top:1% |
| + | } |
| + | |
| + | .mp-flex-box{ |
| + | display:flex; |
| + | flex-direction:column; |
| + | width:49%; |
| + | |
| + | } |
| + | |
| + | #about-container{ |
| + | width:100%; |
| + | height:100%; |
| + | |
| + | } |
| + | |
| + | #categories-container{ |
| + | width:70%; |
| + | display:block; |
| + | margin-left:auto; |
| + | margin-right:auto; |
| + | margin-top:2%; |
| + | } |
| + | |
| + | #fe-container{ |
| + | width:100%; |
| + | |
| + | } |
| + | |
| + | #fc-container{ |
| + | width:80%; |
| + | display:block; |
| + | margin-left:auto; |
| + | margin-right:auto; |
| + | } |
| + | |
| + | |
| + | |
| + | .mp-item-box{ |
| + | border:2px grey solid; |
| + | border-radius:10px; |
| + | } |
| + | |
| + | .mp-title{ |
| + | text-align:center; |
| + | margin-top:1em; |
| + | font-size:2em; |
| + | font-family:"Averia Serif Libre"; |
| + | font-weight:400; |
| + | } |
| + | |
| + | .mp-category{ |
| + | text-align:center; |
| + | font-size:0.75em; |
| + | } |
| + | |
| + | |
| + | .fc-text{ |
| + | text-align:center; |
| + | } |
| + | |
| + | .fc-text a {} |
| + | |
| + | .fc-text a:hover {} |
| + | |
| + | .fc-grid{ |
| + | display: grid; |
| + | justify-items:center; |
| + | align-items:center; |
| + | justify-content: center; |
| + | width:100%; |
| + | row-gap:0px; |
| + | column-gap:1px; |
| + | grid-template-columns: repeat(auto-fill, 220px); |
| + | margin-bottom:5%; |
| + | |
| + | } |
| + | |
| + | .fc-grid>* { |
| + | width: 220px; |
| + | height:300px; |
| + | text-align:center; |
| + | border-radius:10px; |
| + | border:1px grey solid; |
| + | } |
| + | |
| + | .mp-category-grid{ |
| + | display: grid; |
| + | justify-items:center; |
| + | align-items:center; |
| + | justify-content: center; |
| + | width:100%; |
| + | row-gap:0px; |
| + | column-gap:1px; |
| + | grid-template-columns: repeat(auto-fill, 100px); |
| + | |
| + | } |
| + | |
| + | .mp-category-grid>* { |
| + | width: 100px; |
| + | height: 160px; |
| + | text-align:center; |
| + | border-radius:10px; |
| + | border:1px grey solid; |
| + | } |
| + | |
| + | |
| + | .fc-img img{ |
| + | max-width:100%; |
| + | position: absolute; |
| + | left: -100%; |
| + | right: -100%; |
| + | top: -100%; |
| + | bottom: -100%; |
| + | margin: auto; |
| + | height: auto; |
| + | width: auto; |
| + | } |
| + | |
| + | .fc-img{ |
| + | margin-bottom:2em; |
| + | text-align:center; |
| + | width:200px; |
| + | min-height: 200px; |
| + | max-height: 200px; |
| + | margin-top:1em; |
| + | margin-left:auto; |
| + | margin-right:auto; |
| + | position:relative; |
| + | overflow:hidden; |
| + | border-radius:10px; |
| + | box-shadow:2px 2px 4px rgba(0,0,0,0.3); |
| + | } |
| + | |
| + | |
| + | |
| + | .fe-img img{ |
| + | max-height:400px; |
| + | width:auto; |
| + | |
| + | } |
| + | |
| + | .fe-img{ |
| + | height:80% |
| + | } |
| + | |
| + | |
| + | .mp-character-img img{ |
| + | max-width:100%; |
| + | height:auto; |
| + | margin: auto; |
| + | display: block; |
| + | } |
| + | |
| + | #randompage{ |
| + | width:100%; |
| + | margin-top:2%; |
| + | |
| + | } |
| + | |
| + | |
| + | /* Navigations */ |
| + | .mw-wiki-logo{ |
| + | background-size:150px 150px; |
| + | margin-top:1em; |
| + | } |
| + | #mw-page-base{ |
| + | background-color: rgba(0, 0, 0, 0); |
| + | background-image:none; |
| + | } |
| + | |
| + | .vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3{ |
| + | background:none; |
| + | } |
| + | |
| + | #left-navigation{ |
| + | margin-top:2.7em; |
| + | } |
| + | |
| + | #right-navigation{ |
| + | margin-top:2.7em; |
| + | } |
| + | |
| + | .vector-menu-tabs .selected{ |
| + | background:none; |
| + | font-weight:bold; |
| + | color:initial; |
| + | } |
| + | |
| + | .vector-menu-tabs li{ |
| + | background:none; |
| + | margin:0 5px 0 0; |
| + | } |
| + | |
| + | .vector-menu-tabs .new a, .vector-menu-tabs .new a:visited{ |
| + | color:initial; |
| + | } |
| + | |
| + | .vector-menu-tabs{ |
| + | height:2.5em; |
| + | padding-left:0; |
| + | } |
| + | |
| + | .vector-menu-tabs li a{ |
| + | font-size:0.75em; |
| + | padding-top:1em; |
| + | } |
| + | |
| + | #simpleSearch{ |
| + | margin-top:-0.3em; |
| } | | } |
| | | |
| /* Title fonts */ | | /* Title fonts */ |
| h1.firstHeading{ | | h1.firstHeading{ |
− | font-family:"Akzidenz-Grotesk-Medium"; | + | font-family:"Averia Serif Libre"; |
| + | font-weight:700; |
| + | } |
| + | |
| + | /* Body */ |
| + | .mw-body{ |
| + | border:none; |
| + | background-color:rgba(255, 255, 255,0.87); |
| + | margin-right:0.5em; |
| + | } |
| + | |
| + | |
| + | /* Quote boxes */ |
| + | .quotebox { |
| + | background-color: #F9F9F9; |
| + | border: 1px solid #aaa; |
| + | box-sizing: border-box; |
| + | padding: 10px; |
| + | font-size: 88%; |
| + | max-width: 100%; |
| + | } |
| + | .quotebox.floatleft { |
| + | margin: 0.5em 1.4em 0.8em 0; |
| + | } |
| + | .quotebox.floatright { |
| + | margin: 0.5em 0 0.8em 1.4em; |
| + | } |
| + | .quotebox.centered { |
| + | margin: 0.5em auto 0.8em auto; |
| + | } |
| + | .quotebox.floatleft p, |
| + | .quotebox.floatright p { |
| + | font-style: inherit; |
| + | } |
| + | .quotebox-title { |
| + | background-color: #F9F9F9; |
| + | text-align: center; |
| + | font-size: larger; |
| + | font-weight: bold; |
| + | } |
| + | .quotebox-quote.quoted:before { |
| + | font-family:'Times New Roman',serif; |
| + | font-weight:bold; |
| + | font-size: large; |
| + | color: gray; |
| + | content: ' “ '; |
| + | vertical-align: -45%; |
| + | line-height: 0; |
| + | } |
| + | .quotebox-quote.quoted:after { |
| + | font-family:'Times New Roman',serif; |
| + | font-weight:bold; |
| + | font-size: large; |
| + | color: gray; |
| + | content: ' ” '; |
| + | line-height: 0; |
| + | } |
| + | .quotebox .left-aligned { |
| + | text-align: left; |
| + | } |
| + | .quotebox .right-aligned { |
| + | text-align: right; |
| + | } |
| + | .quotebox .center-aligned { |
| + | text-align: center; |
| + | } |
| + | .quotebox cite { |
| + | display:block; |
| + | font-style:normal; |
| + | } |
| + | |
| + | @media screen and (max-width:640px) { |
| + | .quotebox { |
| + | /*override inline styles */ |
| + | width: 100% !important; |
| + | margin: 0 0 0.8em !important; |
| + | float: none !important; |
| + | } |
| } | | } |
| + | |
| | | |
| | | |
Line 38: |
Line 353: |
| aside.portable-infobox{ | | aside.portable-infobox{ |
| line-height: 1.25em; | | line-height: 1.25em; |
| + | width:320px; |
| + | } |
| + | |
| + | .pi-image-thumbnail{ |
| + | max-width:100%; |
| + | width:100%; |
| + | } |
| + | |
| + | .pi-data-label{ |
| + | flex-basis:45%; |
| + | } |
| + | |
| + | .pi-data-value{ |
| + | flex-basis:55%; |
| + | } |
| + | |
| + | @media screen and (max-width: 720px){ |
| + | .pi-image-thumbnail{ |
| + | max-width:100%; |
| + | width:100%; |
| } | | } |
| | | |
| .pi-data-label{ | | .pi-data-label{ |
− | flex-basis:40%; | + | flex-basis:45%; |
| } | | } |
| | | |
| .pi-data-value{ | | .pi-data-value{ |
− | flex-basis:60%; | + | flex-basis:55%; |
| + | } |
| } | | } |
| | | |
Line 430: |
Line 766: |
| .compact-ambox .hide-when-compact { | | .compact-ambox .hide-when-compact { |
| display: none; | | display: none; |
| + | } |
| + | |
| + | /* Text Age Coloration */ |
| + | @keyframes transition1 { |
| + | from {color: black;} |
| + | to {color: #efefef;} |
| + | } |
| + | @keyframes transition2 { |
| + | from {color: black;} |
| + | to {color: #d9d9d9;} |
| + | } |
| + | @keyframes transition3 { |
| + | from {color: black;} |
| + | to {color: #cccccc;} |
| + | } |
| + | @keyframes transition4 { |
| + | from {color: black;} |
| + | to {color: #b7b7b7;} |
| + | } |
| + | @keyframes transition5 { |
| + | from {color: black;} |
| + | to {color: #999999;} |
| + | } |
| + | @keyframes transition6 { |
| + | from {color: black;} |
| + | to {color: #666666;} |
| + | } |
| + | @keyframes transition7 { |
| + | from {color: black;} |
| + | to {color: #333333;} |
| + | } |
| + | |
| + | .cycle1{ |
| + | color: #efefef; |
| + | animation-name: transition1; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle2{ |
| + | color: #d9d9d9; |
| + | animation-name: transition2; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle3{ |
| + | color: #cccccc; |
| + | animation-name: transition3; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle4{ |
| + | color: #b7b7b7; |
| + | animation-name: transition4; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle5{ |
| + | color: #999999; |
| + | animation-name: transition5; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle6{ |
| + | color: #666666; |
| + | animation-name: transition6; |
| + | animation-duration: 5s; |
| + | animation-delay: 0s; |
| + | |
| + | } |
| + | .cycle7{ |
| + | color: #333333; |
| + | animation-name: transition7; |
| + | animation-duration: 8s; |
| + | animation-delay: 0s; |
| + | } |
| + | .cycle8{ |
| + | color: black; |
| } | | } |