Template:Main Page/styles.css

From Captain of Industry Wiki
Revision as of 10:17, 24 January 2022 by Thadius856 (talk | contribs) (description to follow)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search
  1. main-section .sep {display: none; width: 100%; height: 0;}
  2. 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; }

  1. box-1 .i {line-height: 60px;}
  2. box-1 .intro {margin-right: 1em;}
  3. box-1 {flex: 3 0 960px;}
  4. box-1 .mclist {columns: 5;}
  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;}


  1. box-2 {flex: 1 0 480px; display: flex; flex-direction: column;}
  2. box-2 .main-heading {flex: none;}
  3. box-2 .news ul {margin-top: 0;}
  4. box-2 .outro {flex: 1 0 auto; display: flex; flex-direction: column;}
  5. box-2 .more {

display: block; font-style: italic; font-size: 85%; margin-left: 2em; margin-top: 0.5em; flex: 1 0 auto; }

  1. 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; }

  1. 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;}

  1. box-3a .i {line-height: 28px;}
  2. box-3a .i > a:first-child {display: inline-block; width: 20px; text-align: center;}
  3. box-3a .mclist {columns: 3;}
  4. box-3a .mclist li {height: 28px;}
  5. 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;}

  1. box-3b .i {line-height: 28px;}
  2. box-3b .i > a:first-child{display: inline-block; width: 22px; text-align: center;}
  3. box-3b .mclist {columns: 3;}
  4. box-3b .mclist li {height: 28px;}
  5. 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;}

  1. box-4a .i {line-height: 28px;}
  2. box-4a .i > a:first-child {display: inline-block; width: 20px; text-align: center;}
  3. box-4a .mclist {columns: 3;}
  4. box-4a .mclist li {height: 28px;}
  5. 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;}

  1. box-4b .i {line-height: 32px;}
  2. box-4b .i > a:first-child {display: inline-block; width: 32px; text-align: center;}
  3. box-4b .mclist li {height: 32px;}
  4. box-4b .prehardmode .mclist {columns: 3;}
  5. box-4b {flex: 3 0 720px;}
  6. box-4b .prehardmode {padding-right: 40px; flex: 1 0 auto;}
  7. 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;}

  1. box-5a .i {line-height: 32px;}
  2. box-5a .mclist li {height: 32px;}
  3. box-5a .i > a:first-child {display: inline-block; width: 24px; text-align: center;}
  4. box-5a {flex: 2 0 360px;}
  5. 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;}

  1. box-5b .i {line-height: 32px;}
  2. box-5b .mclist li {height: 32px;}
  3. box-5b .i > a:first-child {display: inline-block; width: 24px; text-align: center;}
  4. box-5b {flex: 2 0 360px;}
  5. 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;}

  1. sect-6 dd {margin-left: 1em;}
  2. box-7 {flex: 1 0 auto;}
  3. 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%;}