Khác biệt giữa các bản “MediaWiki:Common.css”

Từ Touhou Wiki - Việt Nam
Buớc tưới chuyển hướng Bước tới tìm kiếm
Dòng 2: Dòng 2:
 
Backgrounds by subtlepatterns - http://subtlepatterns.com/
 
Backgrounds by subtlepatterns - http://subtlepatterns.com/
 
and starsunflowerstudio - http://www.starsunflowerstudio.blogspot.com/
 
and starsunflowerstudio - http://www.starsunflowerstudio.blogspot.com/
font-family: 'Itim', cursive;
+
font-family by Google Font*/
font-family: 'Pattaya', sans-serif; by Google Font*/
+
@import url('https://fonts.googleapis.com/css?family=Andika|Asap+Condensed');
@import url('https://fonts.googleapis.com/css?family=Andika|Pattaya');
 
  
 
.forceVisible {
 
.forceVisible {
Dòng 213: Dòng 212:
 
.textBox {
 
.textBox {
 
font-size: 27px;
 
font-size: 27px;
font-family: 'Pattaya', sans-serif;
+
font-family: 'Asap Condensed', sans-serif;
 
font-weight: bold;
 
font-weight: bold;
 
text-align: left;
 
text-align: left;
Dòng 528: Dòng 527:
 
}
 
}
 
.mw-headline {
 
.mw-headline {
font-family: 'Pattaya', sans-serif;
+
font-family: 'Asap Condensed', sans-serif;
 
}
 
}
 
.mw-body h1 {
 
.mw-body h1 {
font-family: 'Pattaya', sans-serif;
+
font-family: 'Asap Condensed', sans-serif;
 
}
 
}
 
.mw-body-content p {
 
.mw-body-content p {
Dòng 626: Dòng 625:
 
}
 
}
 
.ifb_first {
 
.ifb_first {
font-family: 'Pattaya', sans-serif;
+
font-family: 'Asap Condensed', sans-serif;
 
font-size: 17px;
 
font-size: 17px;
 
padding-left: 10px;
 
padding-left: 10px;

Phiên bản lúc 04:44, ngày 10 tháng 7 năm 2019

/* Import
Backgrounds by subtlepatterns - http://subtlepatterns.com/
and starsunflowerstudio - http://www.starsunflowerstudio.blogspot.com/
font-family by Google Font*/
@import url('https://fonts.googleapis.com/css?family=Andika|Asap+Condensed');

.forceVisible {
	display: block!important;
}

/* Typo */
.t_nihongo_kanji {
	text-align: left!important;
}

/* Function */
.cell--sorter {
    background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%229%22 viewBox=%220 0 21 9%22%3E %3Cpath d=%22M14.5 5l-4 4-4-4zM14.5 4l-4-4-4 4z%22/%3E %3C/svg%3E");
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center right;
    padding-right: 21px;
}
.cell--sorterUp {
    background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%224%22 viewBox=%220 0 21 4%22%3E %3Cpath d=%22M6.5 4l4-4 4 4z%22/%3E %3C/svg%3E");
}
.cell--sorterDown {
    background-image: linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2221%22 height=%224%22 viewBox=%220 0 21 4%22%3E %3Cpath d=%22M14.5 0l-4 4-4-4z%22/%3E %3C/svg%3E");
}

/* Special container */
.container--noTitle > h1, .container--noTitle > h2, .container--noTitle > h3, .container--noTitle > p {
	border-width: 0!important;
	padding: 0!important;
	margin: 0!important;
	height: 0!important;
}
.container--scap {
	display: grid;
	border-bottom: 0!important;
}
.container--scap + .container--scap {
	border-top: 1px solid gray;
}
.container--scapTight {
	display: grid;
	border-bottom: 0!important;
}
.container--scapTight + .container--scapTight {
	border-top: 1px solid gray;
}
.container--topBox {
	display: grid!important;
	grid-template-columns: 100px 1fr;
}
@media screen and (max-width: 650px) {
	.container--topBox {
		margin-right: 0!important;
		margin-left: 0!important;
	}
}
@media screen and (max-width: 500px) {
	.container--topBox {
		grid-template-columns: 1fr;
	}
}
#firstHeading {
	/*max-width: 800px;*/
	margin: auto;
}
#bodyContent {
	/*max-width: 800px;*/
	margin: auto;
}
#contentSub, #contentSub2 {
	margin-top: 0.5em;
}
.mw-parser-output > p, .mw-parser-output > ul, .mw-collapsible-content > p, .mw-collapsible-content > ul  {
	text-align: justify;
}

/* Left Navigation */
#left-navigation {
	margin-left: 12.5em;
	border: 1px solid black;
	box-shadow: 0 0 3px 0 #000;
}
@media screen and (max-width: 750px){
	#p-logo a {
		width: 8em;
		height: 130px;
		background-size: contain;
	}
	#p-logo {
		width: 8em;
		height: 130px;
	}
	#mw-panel .portal, #mw-panel .portal h3 {
		margin: 0;
	}
	#mw-panel.collapsible-nav .portal .body {
		margin-left: 0.5em;
	}
	#mw-panel {
	    top: 1em;
		width: 8em;
	}
	.mw-body {
		margin-left: 8em;
	}
}

/* Top Navigation */
@media screen and (max-width: 700px){
	#left-navigation {
		margin-left: 8.5em;
	}
	#p-personal ul {
		padding-left: 0;
	}
}
@media screen and (max-width: 600px){
	#right-navigation {
		float: none;
	}
	#p-search {
		clear: both;
		float: none;
		margin-left: 8.5em;
		margin-right: 0;
	}
	#simpleSearch {
		width: auto;
		max-width: none;
	}
	#mw-head-base {
	    height: 6.5em;
	}
	#p-personal {
		right: unset;
	}
	div.vectorTabs li a {
		padding-left: 0.3em;
		padding-right: 0.3em;
	}
	#p-personal li {
		margin-top: 0.1em;
	}
}

/* Bottom navigation */
.mw-references-columns {
  -webkit-column-width: unset;
  -moz-column-width: unset;
  column-width: unset;
  word-break: break-word;
}

/* Main Page */
.mainPageContent__category {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.mainPage__wrapper {
	position: relative;
	display: grid;
	grid-template-rows: min-content 1fr;
	grid-template-columns: 3fr 1fr;
	grid-column-gap: 5px;
}
.mainPageContent__intro {
	box-sizing: border-box;
	position: relative;
}
.mainPage__item {
	box-sizing: border-box;
	background-image: url('https://onsen.touhouwiki.net/images/6/67/Noise.png');
	margin: 0;
	padding: 4px 6px 4px 6px;
	position: relative;
}
.mainPage__item--yellow { background-color: #fffcb8; box-shadow: 0 0 2px 1px #df9f00 inset; }
.mainPage__item--blue { background-color: #ebf4ff; box-shadow: 0 0 2px 1px #1a1aff inset; }
.mainPage__item--purple { background-color: #f0e5f5; box-shadow: 0 0 2px 2px #9a009a inset; }
.mainPage__item--green { background-color: #e8ffe8; box-shadow: 0 0 2px 1px #15dd15 inset; }
.mainPage__item--black { border-top: 2px solid black; border-left: 2px solid black; }
.mainPage__item--red { background-color: #ffe9e7; box-shadow: 0 0 2px 1px #ff1a1a inset; }
.mainPageContent__sideBar {
	display: grid;
	grid-row: span 2;
	grid-template-columns: 1fr;
}
.stickImage {
	width: 100px;
    height: 100px;
    position: absolute;
    right: -10px;
    top: -20px;
}
@media screen and (max-width: 800px){
	.mainPage__wrapper {
		grid-template-columns: 6fr 4fr;
	}
}
@media screen and (max-width: 600px){
	.mainPage__wrapper {
		grid-template-columns: 1fr;
		grid-row-gap: 5px;
	}
}
.textBox {
	font-size: 27px;
	font-family: 'Asap Condensed', sans-serif;
	font-weight: bold;
	text-align: left;
}

.box__collapsible {
	overflow: auto;
	box-shadow: 0 1px 1px 0 #777;
	min-width: 400px;
	border-radius: 2px;
}
@media screen and (max-width: 700px){
	.box__collapsible {
		min-width: 0;
	}	
}

/* Override */
.tsingle {
  display: inline-block;
}
.mw-body {
	padding: 1.25em 0.7em 1.5em 0.7em;
}

/* Delete pending */
.antitoc {
	clear: none!important;
}

/* Padding */
.p-mSpareBoth {
	padding-left: 5px;
	padding-right: 5px;
}
.p-mSpareLeft {
	padding-left: 5px;
}
.p-mSpareRight {
	padding-right: 5px;
}
.p-lSpareBoth {
	padding-left: 15px;
	padding-right: 15px;
}
.p-lSpareLeft {
	padding-left: 15px;
}
.p-lSpareRight {
	padding-right: 15px;
}

/* Skin */
.shadowAround--medium {
	box-shadow: 0 0 2px 1px #444;
}
.bareBackground {
	border-width: 0!important;
}
.stripe--4 > div:nth-child(4n){
	background-color: #f8f8f8;
}
.stripe--4 > div:nth-child(4n + 1){
	background-color: #f0f0f0;
}
.stripe--4 > div:nth-child(4n + 2){
	background-color: #e8e8e8;
}
.stripe--4 > div:nth-child(4n + 3){
	background-color: #e0e0e0;
}

/* Card */
.gridTable__wrapper--info > .gridTable:nth-child(1), .gridTable__wrapper--appearance > .gridTable:nth-child(1), .gridTable__wrapper--music > .gridTable:nth-child(1) {
	background-color: #f1abdc;
}
.gridTable__wrapper--info > .gridTable:nth-child(2n), .gridTable__wrapper--appearance > .gridTable:nth-child(2n), .gridTable__wrapper--music > .gridTable:nth-child(2n) {
	background-color: #fffbfb;
}
.gridTable__wrapper--info > .gridTable:nth-child(2n+3), .gridTable__wrapper--appearance > .gridTable:nth-child(2n+3), .gridTable__wrapper--music > .gridTable:nth-child(2n+3) {
	background-color: #ffdddd;
}
.gridTable__wrapper--spell > .gridTable:nth-child(1) {
	background-color: #abdcf1;
	text-align: center;
}
.gridTable__wrapper--spell > .gridTable:nth-child(2n) {
	background-color: #fbfbff;
}
.gridTable__wrapper--spell > .gridTable:nth-child(2n+3) {
	background-color: #dbf4ff;
}
.gridTable {
	border-width: 0!important;
}
@media screen and (min-width: 600px){
	.gridTable__title, .gridTable__music, .gridTable__spell {
		grid-template-columns: 2fr 2.5fr 2.5fr 2fr!important;
	}
	.gridTable__appearance {
		border-width: 0!important;
	}
	.gridTable > div {
		border-width: 0!important;
		grid-column: auto!important;
		grid-row: auto!important;
	}
	.gridTable__title > div, .gridTable__music > div, .gridTable__spell > div {
		grid-template-columns: 2fr 2.5fr 2.5fr 2fr!important;
		border-width: 0!important;
		grid-column: auto!important;
		grid-row: auto!important;
	}
	.container--scap {
		grid-template-columns: 96px 96px minmax(96px, 1fr)!important;
	}
	.container--scapTight {
		display: block;
	}
}

/* Spell card */
.labelblock {
	width: 96px;
	padding: 0!important;
	margin: 0!important;
	border-width: 0!important;
}
.letterblock {
    color: white!important;
	display: inline-block;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    font-family: sans-serif;
    border-width: 2px;
    border-style: solid;
    box-sizing: border-box;
    padding: 0!important;
}
.labelgroup {
	display: grid!important;
	box-sizing: border-box;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}
.letterblock--s {
    grid-column: auto;
}
.letterblock--m {
    grid-column: auto / span 2;
}
.letterblock--l {
    grid-column: auto / span 4;
}
.letterblock a:link { color: white; text-decoration: none; }
.letterblock a:visited { color: white; text-decoration: none; }
.letterblock a:hover { color: white; text-decoration: none; }
.letterblock a:active { color: white; text-decoration: none; }
.m-e { background-color: #008000; border-color: #00a938; }
.m-n { background-color: #2055c9; border-color: #276bff; }
.m-h { background-color: #0712a3; border-color: #252cc7; }
.m-l { background-color: #520052; border-color: #800080; }
.m-ov { background-color: #990000; border-color: #ff0000; }
.m-ex { background-color: #da8d00; border-color: #ffa500; }
.m-ph { background-color: #641515; border-color: #a52a2a; }
.m-lw { background-color: #000000; border-color: #444444; }
@media screen and (max-width: 550px){
	.container--scap > div {
		display: block!important;
	}
}
.spellCard__container {
	grid-template-columns: auto 1fr!important;
	box-shadow: 0 0 1px 1px #222;
	border-radius: 2px;
	box-sizing: border-box;
	background-color: white;
}
.spellCard__image img {
	border-right: 1px solid gray;
	padding: 3px 5px 3px 5px;
}
.spellCard__desc {
	grid-template-columns: 2fr minmax(384px, 7fr)!important;
}
.spellCard__desc--tag {
	text-align: right;
	padding-right: 10px;
}
.spellCard__desc .spellCard__desc--tag:nth-child(4n + 1){
	background-color: #c0ffc0;
}
.spellCard__desc .spellCard__desc--content:nth-child(4n + 2){
	background-color: #c0ffc0;
}
.spellCard__desc .spellCard__desc--tag:nth-child(4n + 3){
	background-color: #fafafa;
}
.spellCard__desc .spellCard__desc--content:nth-child(4n){
	background-color: #fafafa;
}
@media screen and (max-width: 800px){
	.spellCard__desc {
		grid-template-columns: 1fr!important;
	}
	.spellCard__desc--tag {
		text-align: left;
		padding-left: 10px;
	}
}
@media screen and (max-width: 600px){
	.spellCard__container {
		grid-template-columns: 1fr!important;
	}
	.spellCard__image {
		border-width: 0;
		border-bottom: 1px solid gray;
		margin-left: 0;
	}
}

/* Image */
@media screen and (max-width: 450px){
	div.thumbinner {
		width: 100%!important;
		box-sizing: border-box;
	}
	div.tleft, div.tright {
		float: none;
		clear: both;
		margin: 0;
		margin-bottom: 0.5em;
	}
}

/* Gallery */
ul.gallery {
	margin: 0;
	padding: 0;
}
div.gallerytext p {
	text-align: center;
}
@media screen and (max-width: 450px){
	li.gallerybox {
		width: 100%!important;
		box-sizing: border-box;
	}
	li.gallerybox > div {
		width: 100%!important;
		box-sizing: border-box;
	}
	li.gallerybox div.thumb {
		width: 100%!important;
		box-sizing: border-box;
		margin: 0;
	}
}

a {
	color: #4375ff;
	text-decoration: none;
	background: none;
}
a:visited {
	color: #0b90b0;
}
a.external:visited {
	color:#661166;
}
body, #mw-head {
	background-image: url(https://onsen.touhouwiki.net/images/6/67/Noise.png);
	background-color: #f9f9f9;
}
body {
	margin-top: 5px;
	position: relative;
	display: inline-block;
	min-width: 100%;
}
li {
	margin-bottom: 0;
}
#mw-head {
	top: -5px;
	right: unset;
}
#p-views {
	border: 1px solid black;
	box-shadow: 0 0 3px 0 #000;
}
#p-cactions {
	margin-left: 3px;
}
#p-cactions-label {
	width: 100px;
	border-bottom-width: 0;
}
#p-logo a {
	border-bottom: 2px solid black;
}
#content {
	background-image: url("https://onsen.touhouwiki.net/images/5/52/Paper_fibers.jpg");
	font-family: 'Andika', sans-serif;
	font-size: 1em;
	min-width: 250px;
}
.mw-body {
	box-shadow: 0 0 3px 1px #000 inset;
	border: 1px solid #ddd;
	border-radius: 25px 5px 5px 5px;
}
.mw-headline {
	font-family: 'Asap Condensed', sans-serif;
}
.mw-body h1 {
	font-family: 'Asap Condensed', sans-serif;
}
.mw-body-content p {
	line-height: 22px;
	margin: 0.5em 0;
}
h2 > .mw-headline {
	font-size: 26px;
	color: #00c;
	background-image: url('https://onsen.touhouwiki.net/images/4/4e/Yinyang3Blue.png');
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: 7px 75%;
	padding-left: 30px;
	padding-top: 22px;
}
h3 > .mw-headline {
	font-size: 22px;
	font-weight: normal;
	color: #009;
	padding-left: 10px;
	padding-top: 16px;
}o
.mw-headline>.external {
	padding-left: 22px;
}
h3 { border-bottom: 1px dashed #ccc; }
dl { padding-left: 10px; }
.RTsettings {
	margin-top: -8px;
	margin-right: -6px;
}
.referencetooltip li {
	border-radius: 10px;
	font-family: 'Andika', sans-serif;
	background-image: url(https://onsen.touhouwiki.net/images/6/67/Noise.png);
}
/* Overall */
.normal {
	width: 100%;
	border-collapse: collapse;
}
.normal td {
	padding: 2px;
	border: 1px solid #554040;
}
blockquote {
  display: inline-block;
	border: 2px solid #aaaaaa;
	padding: 5px 7px 5px 7px;
	background-color: #efefef;
	box-shadow: 0 0 5px 1px #000 inset;
}
.info_table_format {
	margin: 2px 15px 2px 15px;
	text-decoration: underline;
}
/* Infobox */
/* Infobox - Character */
.ifb {
	background-repeat: repeat;
	width: 320px!important;
	text-align: left;
	font-family: 'Andika', sans-serif;
	position: relative;
	z-index: 200;
	box-shadow: 0 0 3px 1px #222;
	word-break: break-word;
}
.ifb_character {
	background-image: url('https://onsen.touhouwiki.net/images/f/f4/Carton_paper_teal_compact.jpg');
}
.ifb_music {
	background-image: url(https://onsen.touhouwiki.net/images/c/c4/Carton_paper_yellow_compact.jpg);
}
.ifb_game {
	background-image: url(https://onsen.touhouwiki.net/images/2/21/Carton_paper_red_compact.jpg);
}
.ifb_printwork {
	background-image: url(https://onsen.touhouwiki.net/images/e/eb/Carton_paper_blue.png);
}
.ifb_above {
	padding-top: 10px;
	font-size: 18px;
}
.ifb_above_character {
	border-bottom-color: rgb(0,0,200);
}
.ifb_above_music {
	border-bottom-color: #df9f00;
}
.ifb_above_game {
	border-bottom-color: #ff1a1a;
}
.ifb_first {
	font-family: 'Asap Condensed', sans-serif;
	font-size: 17px;
	padding-left: 10px;
}
.ifb_second {
	font-size: 13px;
	padding: 0 10px 0 40px;
}
.infobox__outer {
	max-width: 330px;
	float: right;
	margin-left: 10px;
}
@media screen and (max-width: 700px){
	.infobox__outer {
		max-width: 100%;
		float: none;
		margin-left: 0;
		margin-right: 0;
	}
	.ifb {
		width: 100%!important;
	}
}
.thumbimage {
	background-color: #ddd;
	background-color: rgba(255,255,255,0.2);
}
div.thumbinner {
	box-shadow: 0 0 4px 0 #000;
	position: relative;
	z-index: 100;
	background-image: url(https://onsen.touhouwiki.net/images/6/67/Noise.png);
	background-color: #333;
	color: #fff;
}
/* Infobox */
.vcard {
	border-collapse: collapse;
	background-color: #fafaff;
	border: 1px solid #378e9b;
	border-bottom: 4px solid #378e9b;
	float: right;
	position: relative;
	z-index: 200;
}
.incell_top {
	background-color: #bfdfff;
	padding: 2px;
	margin: 10px;
	border-bottom: 1px solid #378e9b;
}
/* Infobox (game) */
.vcard2 {
	border-collapse: collapse;
	background-color: #fffaff;
	border: 1px solid #8e379b;
	border-bottom: 4px solid #8e379b;
	float: right;
	position: relative;
	z-index: 200;
}
.incell_top2 {
	background-color: #ffdfff;
	padding: 2px;
	margin: 10px;
	border-bottom: 1px solid #8e379b;
}
/* Infobox (music) */
.vcard3 {
	border-collapse: collapse;
	background-color: #ffffef;
	border: 1px solid #ffa500;
	border-bottom: 4px solid #ffa500;
	float: right;
	position: relative;
	z-index: 200;
}
.incell_top3 {
	background-color: #ffffbf;
	padding: 2px;
	margin: 10px;
	border-bottom: 1px solid #ffa500;
}
/* Info card */
.info_card {
	border-collapse: collapse;
	width: 100%;
}
.info_card td {
	padding: 2px;
	border-width: 0px!important;
}
.suit_box {
	width: 100%;
}
/* Profile card */
.profile__card--wrapper {
	display: grid;
	grid-template-columns: 1fr;
	padding: 10px;
	box-shadow: 0 0 2px 1px #444 inset;
	background-image: url('https://onsen.touhouwiki.net/images/f/fb/Paper2.png');
}
.profile__card--cell {
    word-break: break-word;
    text-align: justify;
}
.profile__card--cell:nth-child(1) {
    border-right: 1px dashed #777;
    padding-right: 10px;
}
@media screen and (min-width: 750px){
	.profile__card--wrapper {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.profile__card--cell:nth-child(2) {
	    border-left: 1px dashed #777;
	    padding-left: 10px;
	}
}
/* Dual card */
.dual_card {
	border-collapse: collapse;
	width: 100%;
}
.dual_card_inner {
	background-image: url(https://onsen.touhouwiki.net/images/c/c0/Seamless_paper.png);
	box-shadow: 0 0 4px 0 #000;
	border-collapse: collapse;
	width: 100%;
}
.dual_card td {
	padding: 2px 10px 2px 10px;
}
.dual_card th {
	text-align: center;
}
.dual_card_jap {
	display: none;
	padding: 2px;
}
.dual_card_vie {
	width: 100%;
	padding: 2px;
}
.dual_header {
	background-color: rgb(200,200,200);
	background-color: rgba(0,0,0,0.2);
	margin: 0 10px 0 10px;
}
/* Spell card */
.spell_card {
	border-collapse: collapse;
	width: 100%;
}
.spell_card td {
	padding: 1px 4px 1px 3px;
	vertical-align: top;
	border-width: 0px!important;
	text-align: left;
}
.spell_card tr:nth-child(1) {
	background-color: #9fd7ef;
}
.spell_card tr:nth-child(2n) {
	background-color: #fff;
}
.spell_card tr:nth-child(2n+3) {
	background-color: #ddf
}
/* Sprite */
.sprite__wrapper {
	position: relative;
	display: inline-block;
	text-align: center;
	vertical-align: top;
	padding: 8px;
	background-image: url(https://onsen.touhouwiki.net/images/e/ea/Carton_paper_blue_compact.jpg);
	margin: 5px 5px 0 5px;
	box-shadow: 0 1px 2px 0 #000;
    border-radius: 5px;
}
.sprite__image {
	background-color: rgb(155,155,155);
	background-color: rgba(155,155,155,0.5);
	box-shadow: 0 0 4px 0 #000 inset;
    border-radius: 5px;
}
.sprite__image img {
	max-width: 100%;
	max-height: 100%;
    border-radius: 5px;
}
@media screen and (max-width: 450px){
	.sprite__wrapper {
		display: block;
	}
	.sprite__image {
		width: auto!important;
	}
	.sprite__text {
		width: auto!important;
	}
}

/* Navigator Box */
.navigator__category--wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.navigator_box {
	margin-top: 10px;
	box-shadow: 0 0 3px 1px #000;
	background-color: #f9f9f9;
	padding: 5px
}
.navigator_cell {
	text-align: center;
	margin: 2px 5px 2px 5px;
	font-weight: bold;
	font-family: Tahoma;
	display: block;
	background-color: #ddd;
}
.navigator__category--label {
	text-align: left;
	padding-left: 20px;
	font-weight: bold;
	text-decoration: underline;
	font-size: 16px;
}
.navigator__category--item {
	text-align: center;
	margin: 2px 5px 2px 5px;
	font-weight: bold;
	font-family: Tahoma;
	display: inline-block;
}
/* Extra editor */
.eetable {
	width: 100%;
	border-collapse: collapse;
	border-width: 0;
}
.eetable td {
	border: 1px solid #151515;
}
.eecell1 {
	width: 30%;
}
.eeexecute {
	width: 100%;
	background-color: #ffdddd;
}
.eebuttonlist {
	height: 150px;
	overflow-y: auto;
	-webkit-display: flex;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
}
.eeinput {
	width: 220px;
}
.eebutton {
	padding: 0 2px 0 2px;
	flex: auto;
	-webkit-flex: auto;
	text-align: center;
}
.eeinterface {
	height: 160px;
	overflow-y: auto;
}
/* Track */
.track {
	margin-left: 60px;
}
.track > span {
	font-family: Tahoma,Verdana,Segoe,sans-serif;;
}
/* Dual control box */
.dual_control_box {
	border: 2px solid #77bedb;
	border-left: 15px solid #77bedb;
	margin-left: 10%;
	margin-right: 10%;
	text-align: left;
	min-height: 95px;
}
.dualControl__button {
	display: inline-block;
	cursor: pointer;
	text-align: center;
	padding: 2px;
	margin: 2px;
	border-width: 2px;
	border-style: solid;
	width: 25%;
	min-width: 90px;
	box-sizing: border-box;
}
@media screen and (max-width: 500px){
	.dualControl__button {
		display: block;
		width: auto;
	}
}

/* Tab image */
.tab_content_container {
	text-align: center;
	margin: 0;
	padding: 0;
}
.tab_content_button {
	display: inline-block;
	padding: 2px;
	margin-left: 2px;
	margin-right: 2px;
	background-color: #eee;
	text-align: center;
	box-shadow: 0 0 3px 0 #000;
	cursor: pointer;
}
.tab_content_content {
	padding: 2px;
	background-color: rgb(155,155,155);
	background-color: rgba(155,155,155,0.5);
	padding: 3px;
	box-shadow: 0 0 4px 0 #000;
	display: none;
}
.tab_content_button_container {
	background-image: url('https://onsen.touhouwiki.net/images/6/67/Noise.png');
}

/* [[Bản mẫu:Lyrics]] use */
.template_lyrics td, th {
    padding: 5px;
}

.template_lyrics th {
    font-size: 120%; 
}

.template_lyrics .lyrics_row td p {
    white-space: pre-line;
}

/* Framestyle */
/* outcell: Deep blue outer border
   incell: Light blue curve corner border */

.outcell {
    border: 1px solid #7384b5;
    border-radius: 5px;
}

.incell, .incell_top, .incell_bottom, .incell_topleft, 
.incell_topright, .incell_bottomleft, .incell_bottomright {
    background: #dde6ff;
}

.incell_top {
    border-radius: 3px 3px 0px 0px;
}

.incell_bottom {
    border-radius: 0px 0px 3px 3px;
}

.incell_topleft {
    border-radius: 3px 0px 0px 0px;
}

.incell_topright {
    border-radius: 0px 3px 0px 0px;
}

.incell_bottomleft {
    border-radius: 0px 0px 0px 3px;
}

.incell_bottomright {
    border-radius: 0px 0px 3px 0px;
}