Template:Main Page/styles.css

#main-section .sep {display: none; width: 100%;	height: 0;}
#main-section li {margin-bottom: 1px;}
.box-row-l #main-section #sep-D {
	display: block;
}
.box-row-m #main-section #sep-B,
.box-row-m #main-section #sep-E {
	display: block;
}
.box-row-s #main-section #sep-B,
.box-row-s #main-section #sep-D,
.box-row-s #main-section #sep-F {
	display: block;
}

#box-1 .i {line-height: 60px;}
#box-1 .intro {margin-right: 1em;}
#box-1 {flex: 3 0 960px;}
#box-1 .mclist {columns: 5;}
#box-1 .mclist li {height: 60px;}
.width-a#box-1 {flex: 2 0 640px;}
.width-a#box-1 .mclist {columns: 4;}
.width-b#box-1 {flex: 3 0 840px;}
.width-c#box-1 {flex: 19 0 640px;}
.width-c#box-1 .mclist {columns: 4;margin: auto;}
.width-d#box-1 {flex: 1 1 1000px;}
.width-d#box-1 .mclist {columns: 5;}
.width-e#box-1 .mclist {columns: 4;}
.width-f#box-1 .mclist {columns: 3;}
.width-g#box-1 .mclist {columns: 2;}


#box-2 {flex: 1 0 480px;	display: flex; flex-direction: column;}
#box-2 .main-heading {flex: none;}
#box-2 .news ul {margin-top: 0;}
#box-2 .outro {flex: 1 0 auto; display: flex; flex-direction: column;}
#box-2 .more {
	display: block;
	font-style: italic;
	font-size: 85%;
	margin-left: 2em;
	margin-top: 0.5em;
	flex: 1 0 auto;
}
#box-2 .links {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around; /*fallback*/
	justify-content: space-evenly;
}
#box-2 .links span {margin: 0.75em 0.25em 0;	display: inline-block;}
.width-a#box-2{flex: 1 0 320px;}
.width-b#box-2{flex: 1 0 280px;}

#box-3a .i {line-height: 28px;}
#box-3a .i > a:first-child {display: inline-block; width: 20px; text-align: center;}
#box-3a .mclist {columns: 3;}
#box-3a .mclist li {height: 28px;}
#box-3a{flex: 2 0 auto;}
.width-a#box-3a .mclist {columns: 2;}
.width-b#box-3a .mclist {columns: 2;}
.width-c#box-3a .mclist {columns: 3;}
.width-d#box-3a .mclist {columns: 2;}
.width-e#box-3a {flex: 1 1 320px;}
.width-e#box-3a .mclist {columns: 2;}
.width-f#box-3a {flex: 1 1 720px;}
.width-f#box-3a .mclist {columns: 4;}
.width-g#box-3a .mclist {columns: 6;}
.width-h#box-3a .mclist {columns: 4;}
.width-i#box-3a .mclist {columns: 3;}
.width-j#box-3a .mclist {columns: 2;}

#box-3b .i {line-height: 28px;}
#box-3b .i > a:first-child{display: inline-block; width: 22px; text-align: center;}
#box-3b .mclist {columns: 3;}
#box-3b .mclist li {height: 28px;}
#box-3b {flex: 2 0 auto;}
.width-a#box-3b .mclist {columns: 3;}
.width-b#box-3b .mclist {columns: 2;}
.width-c#box-3b .mclist {columns: 3;}
.width-d#box-3b .mclist {columns: 2;}
.width-e#box-3b {flex: 1 1 430px;}
.width-e#box-3b .mclist {columns: 2;}
.width-f#box-3b {flex: 1 1 720px;}
.width-f#box-3b .mclist {columns: 3;}
.width-g#box-3b .mclist {columns: 4;}
.width-h#box-3b .mclist {columns: 3;}
.width-i#box-3b .mclist {columns: 2;}
.width-j#box-3b .mclist {columns: 1;}

#box-4a .i {line-height: 28px;}
#box-4a .i > a:first-child {display: inline-block; width: 20px; text-align: center;}
#box-4a .mclist {columns: 3;}
#box-4a .mclist li {height: 28px;}
#box-4a {flex:2 0 auto;}
.width-a#box-4a .mclist {columns: 2;}
.width-b#box-4a .mclist {columns: 2;}
.width-c#box-4a {flex:1 1 720px;}
.width-c#box-4a .mclist {columns: 4;}
.width-d#box-4a .mclist {columns: 3;}
.width-e#box-4a .mclist {columns: 2;}
.width-f#box-4a .mclist {columns: 1;}

#box-4b .i {line-height: 32px;}
#box-4b .i > a:first-child {display: inline-block; width: 32px; text-align: center;}
#box-4b .mclist li {height: 32px;}
#box-4b .prehardmode .mclist {columns: 3;}
#box-4b {flex: 3 0 720px;}
#box-4b .prehardmode {padding-right: 40px;	flex: 1 0 auto;}
#box-4b .hardmode {flex: 1 0 150px;}
.width-a#box-4b .prehardmode .mclist {columns: 2;}
.width-a#box-4b {flex: 2 0 460px;}
.width-a#box-4b .prehardmode {padding-right: 0;}
.width-a#box-4b .hardmode {flex: 1 0 auto;}
.width-b#box-4b {flex: 2 0 auto;}
.width-b#box-4b .prehardmode {padding-right: 20px;}
.width-b#box-4b .hardmode {flex: 1 0 auto;}
.width-c#box-4b .prehardmode .mclist {columns: 2;}
.width-c#box-4b {flex: 2 0 auto;}
.width-c#box-4b .prehardmode {padding-right: 1em; flex: 2 0 auto;}
.width-c#box-4b .hardmode {flex: 1 0 auto;}
.width-d#box-4b {flex:1 1 720px;}
.width-d#box-4b .prehardmode .mclist {columns: 3;}
.width-e#box-4b {flex:1 1 720px;}
.width-e#box-4b .prehardmode {width: 100%;	padding-right: 0;}
.width-e#box-4b .prehardmode .mclist {columns: 3;}
.width-e#box-4b .hardmode {width: 100%;}
.width-e#box-4b .hardmode .mclist {columns: 3;}
.width-f#box-4b .prehardmode .mclist {columns: 2;}
.width-f#box-4b .hardmode .mclist {columns: 2;}
.width-g#box-4b .prehardmode .mclist {columns: 1;}
.width-g#box-4b .hardmode .mclist {columns: 1;}

#box-5a .i {line-height: 32px;}
#box-5a .mclist li {height: 32px;}
#box-5a .i > a:first-child {display: inline-block; width: 24px;	text-align: center;}
#box-5a {flex: 2 0 360px;}
#box-5a .content > div {flex: 1 0 auto;}
.width-a#box-5a {flex: 2 0 310px;}
.width-b#box-5a {flex: 3 0 600px;}
.width-b#box-5a .mclist {columns: 2;}
.width-c#box-5a .mclist {columns: 2;	column-gap: 0.25em;}
.width-d#box-5a .mclist {columns: 1;}
.width-e#box-5a {flex: 1 1 720px;}
.width-e#box-5a .mclist {columns: 2;}
.width-f#box-5a .prehardmode,
.width-f#box-5a .hardmode {width: 100%;}
.width-f#box-5a .mclist {columns: 3;}
.width-g#box-5a .mclist {columns: 2;}

#box-5b .i {line-height: 32px;}
#box-5b .mclist li {height: 32px;}
#box-5b .i > a:first-child {display: inline-block; width: 24px;	text-align: center;}
#box-5b {flex: 2 0 360px;}
#box-5b .content > div {flex: 1 0 auto;}
.width-a#box-5b {flex: 2 0 310px;}
.width-b#box-5b .mclist {columns: 2;	column-gap: 0.25em;}
.width-c#box-5b .mclist {columns: 1;}
.width-d#box-5b {flex: 1 1 720px;}
.width-d#box-5b .mclist {columns: 2;}
.width-e#box-5b .prehardmode,
.width-e#box-5b .hardmode {width: 100%;}
.width-e#box-5b .mclist {columns: 4;}
.width-f#box-5b .mclist {columns: 3;}
.width-g#box-5b .mclist {columns: 2;}

#sect-6 dd {margin-left: 1em;}
#box-7 {flex: 1 0 auto;}
#box-8 {flex: 3 0 auto;}
.width-a#sect-6 .outro {display: flex;}
.width-a#sect-6 .outro dl {flex: 1 0 auto;}

.width-a#box-7 {flex-basis: 220px;}
.width-a#box-7 .outro dl {display: inline-block; width: 100%;}
.width-a#box-8 {flex-basis: 900px;}
.width-a#box-8 .outro dl {display: inline-block; width: 33.33333333%;}
.width-b#box-8 {flex-basis: 620px;}
.width-b#box-8 .outro dl {width: 50%;}
.width-b#box-7 {flex-basis: 620px;}
.width-b#box-7 .outro dl {width: 50%;}
.width-c#box-7 {flex-shrink: 1;}
.width-c#box-7 .outro dl {width: 100%;}
.width-c#box-8 {flex-shrink: 1;}
.width-c#box-8 .outro dl {width: 100%;}