Ero sivun ”Järjestelmäviesti:Common.css” versioiden välillä

ApoWikistä
(CSS-koodi, jolla saa otsikkoboksin asemoitua ilman taulukkoa)
(CSS-koodi, jolla saa etusivun rakenteen toteutettua ilman taulukkoa)
 
Rivi 786: Rivi 786:
vertical-align:top;  
vertical-align:top;  
}
}
#mp-upper {
width: 100%; margin:0 0 0 0; background:none; border-spacing: 0px; display: inline-block;
}
.MainPageBG {
display: inline-block;
width:49%;
border:1px solid #cef2e0;
background:#f5fffa;
vertical-align:top;
color:#000;
clear:both;
}
.grid {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-column-count: 2;
    -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: 0;
    -moz-column-gap: 0;
          column-gap: 0;
  position: relative;
}
.grid-element {
  margin: 0;
  padding: 5px;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}


@media screen and (max-width: 660px) {
@media screen and (max-width: 660px) {
Rivi 806: Rivi 840:
.MainPageBG {
.MainPageBG {
width:100%;
width:100%;
}
.grid {
-webkit-column-count: 1;
    -moz-column-count: 1;
        column-count: 1;
}
}
}
}


/*</nowiki></pre>*/
/*</nowiki></pre>*/

Nykyinen versio 24. joulukuuta 2019 kello 20.29

/* Common CSS for all skins */

/* [[en:MediaWiki:Common.css]] */
/*<pre><nowiki>*/

/*****************/
/* Lähteet-lista */
/*****************/

/* make the list of references look smaller */
ol.references {
   font-size: 90%;
}

.references-small { font-size: 90%;}

/* VALIDATOR NOTICE: the following is correct, but the W3C validator doesn't accept it */
/* -moz-* is a vendor-specific extension (CSS 2.1 4.1.2.1) */
/* column-count is from the CSS3 module "CSS Multi-column Layout" */
/* Please ignore any validator errors caused by these two lines */
.references-2column {
  font-size: 90%;
  -moz-column-count:2;
  column-count:2;
}

/* Highlight clicked reference in blue to help navigation */
 
ol.references > li:target {
 background-color: #DEF;
}
 
sup.reference:target { 
  background-color: #DEF;
}

/* Highlight data points in the info action if specified in the URL */
body.action-info :target {
    background: #DEF;
}

/*************/
/* Wikitable */
/*************/

/* wikitable/prettytable class for skinning normal tables */

table.wikitable,
table.prettytable {
  margin: 1em 1em 1em 0;
  background: #f9f9f9;
  border: 1px #aaaaaa solid;
  border-collapse: collapse;
  vertical-align: top;
}

table.wikitable th, table.wikitable td,
table.prettytable th, table.prettytable td {
  border: 1px #aaaaaa solid;
  padding: 0.2em;
}

table.wikitable th,
table.prettytable th {
  background: #f2f2f2;
  text-align: center;
}

table.wikitable caption,
table.prettytable caption {
  margin-left: inherit;
  margin-right: inherit;
}

.collapseButton {          /* 'show'/'hide' buttons created dynamically */
    float: right;          /* by the CollapsibleTables javascript in    */
    font-weight: normal;   /* [[MediaWiki:Common.js]] are styled here   */
    text-align: right;     /* so they can be customised.                */
    width: auto;
}

/************************/
  /* CommonsTicker styles */
  /************************/
 
  /* links */
  .tickerDiffLink { } /* diff links in ticker */
  .tickerMiscLink { } /* misc links in ticker */
 
  /* remove list bullets */
  .tickerList ul,    .tickerList ul li    { list-style: none; text-indent:-2em; margin-left:2em;   text-align:left; }
  .tickerList ul ul, .tickerList ul ul li { list-style: none; text-indent:0;    margin-left:1.5em; text-align:left; }

  /* per-type styles */
  .tickerEntry_deleted     { }  /* entry for image deletion */
  .tickerEntry_restored    { }  /* entry for restored image */
  .tickerEntry_replaced    { }  /* entry for image replacement */
  .tickerEntry_tagged      { }  /* entry for adding/removing problem tags */
  .tickerEntry_redir       { }  /* entry for critical redirection (fot tag redirects) */
  .tickerEntry_recat       { }  /* entry for critical re-categorization (for tag categories) */
  .tickerEntry_notify      { }  /* entry for global notifications */
  .tickerEntry_changed     { }  /* entry for generic change */

  /* per-status styles */
  .tickerStatus_done     { text-decoration:line-through; }  /* strike through when entry has been handeled */

  /* per-action styles */
  .tickerAction_deleted:before     { content:" GONE "; color: #FF0000; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_restored:before    { content:" BACK "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_deletedRev:before  { content:" -OLD "; color: #DDAAAA; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_replaced:before    { content:" REPL "; color: #CC88FF; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_replacedOwn:before { content:" UPDT "; color: #EEAAFF; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_addedBad:before    { content:" +VfD "; color: #FF8800; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_removedBad:before  { content:" -VfD "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_addedGood:before   { content:" +OK  "; color: #00BB00; font-family:monospace; font-weight:bold; font-size:100%; }  
  .tickerAction_removedGood:before { content:" -OK  "; color: #FF8800; font-family:monospace; font-weight:bold; font-size:100%; }

  /* ticker usage list */
  .tickerUsage  { font-size:80%; }  

  /* entry applies to a template used by multiple images */
  .tickerTemplateEntry    { font-weight: bold; } 

  /* entry applies to sub-entries, i.e. images that use a specific template */
  .tickerSubEntry         { }                       

  /* minor entry styles */ 
  .tickerMinorEntry  { color:#666; }     /* minor entry */
  .tickerMinorEntry a,
  .tickerMinorEntry a:link,
  .tickerMinorEntry a:visited { color:#669; }
  #bodyContent .tickerMinorEntry a.extiw,
  #bodyContent .tickerMinorEntry a.extiw:link,
  #bodyContent .tickerMinorEntry a.extiw:visited { color:#669; }

/**************************/
/* Infobox template style */
/**************************/

.infobox {
   border: 1px solid #aaa;
   background-color: #f9f9f9;
   color: black;
   margin: 0.5em 0 0.5em 1em;
   padding: 0.2em;
   float: right;
   clear: right;
}
.infobox td,
.infobox th {
   vertical-align: top;
}
.infobox caption {
   font-size: larger;
   margin-left: inherit;
}
.infobox.bordered {
   border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
   border: 1px solid #aaa;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
   border: 0;
}

.infobox.sisterproject {
   width: 20em;
   font-size: 90%;
}

@media print {
    .infobox.sisterproject {
        display: none;
    }
}

/* styles for bordered infobox with merged rows */
.infobox.bordered .mergedtoprow td,
.infobox.bordered .mergedtoprow th {
   border: 0;
   border-top: 1px solid #aaa;
   border-right: 1px solid #aaa;
}

.infobox.bordered .mergedrow td,
.infobox.bordered .mergedrow th {
   border: 0;
   border-right: 1px solid #aaa;
}


/* styles for geography infoboxes, e.g. countries, country subdivisions, cities, etc. */

.infobox.geography {
   border: 1px solid #ccd2d9;
   text-align: left;
   border-collapse: collapse;
   line-height: 1.2em; 
   font-size: 90%;
}

.infobox.geography  td,
.infobox.geography  th {
   border-top: solid 1px #ccd2d9;
   padding: 0.4em 0.2em 0.4em 0.8em;
}
.infobox.geography .mergedtoprow td,
.infobox.geography .mergedtoprow th {
   border-top: solid 1px #ccd2d9;
   padding: 0.4em 0.2em 0.2em 0.8em;
}

.infobox.geography .mergedrow td,
.infobox.geography .mergedrow th {
      border: 0;
      padding: 0 0.2em 0.2em 0.8em;
}

.infobox.geography .mergedbottomrow td,
.infobox.geography .mergedbottomrow th {
   border-top: 0;
   border-bottom: solid 1px #ccd2d9;
   padding: 0 0.2em 0.4em 0.8em;
}

.infobox.geography .maptable td,
.infobox.geography .maptable th {
      border: 0;
      padding: 0 0 0 0;
}

/* Väritetyt tarkkailulistan numerot, [[:en:Wikipedia:Added_or_removed_characters]] */
.mw-plusminus-pos {
  color:darkgreen;
}

.mw-plusminus-neg {
  color:darkred;
}

/* Läpinäkyville kuville ruututausta */
#file img { background: url("//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat; }

/* IPA-mallineen merkinnät näkymään IE:llä */
.IPA {
  font-family: "Chrysanthi Unicode", "Doulos SIL", Gentium, GentiumAlt, Code2000, "TITUS Cyberbit Basic", "DejaVu Sans", "Bitstream Cyberbit", "Arial Unicode MS", "Lucida Sans Unicode", "Hiragino Kaku Gothic Pro", "Matrix Unicode";
  font-family /**/:inherit;
}

/* Alleviivaamattomat IPA-linkit */
.IPA a:link, .IPA a:visited {
  text-decoration: none;
}

/* Piilotetaan allekirjoituspainike artikkelinäkymässä, kiitos Splarka @ #wikimedia-tech */
/* body.ns-0 img[title="Allekirjoitus aikamerkinnällä"] { display: none; } */
/* wikibits.js päivityksen jälkeen alla oleva toimii kaikilla selaimilla */
body.ns-0 img#mw-editbutton-signature { display: none; }

/* Article message box template styles */
table.ambox {
  margin: 0 10%;                         /* Will not overlap with other elements */
  border-collapse: collapse; 
  background: #fbfbfb; 
  border: 1px solid #aaa; 
  border-left: 10px solid #1e90ff;       /* Default "notice" blue */
}
table.ambox th.ambox-text, table.ambox td.ambox-text {      /* The message body cell(s) */
  padding: 0.25em 0.5em;              /* 0.5em left/right */
  width: 100%;                        /* Make all templates the same width regardless of text size */
}
table.ambox td.ambox-image {          /* The left image cell */
  padding: 2px 0px 2px 0.5em;         /* 0.5em left, 0px right */
  text-align: center; 
}
table.ambox td.ambox-imageright {     /* The right image cell */
  padding: 2px 0.9em 2px 0;           /* 2px 4px 2px 0px */
  text-align: center;
}
table.ambox-notice {
  border-left: 10px solid #1e90ff;       /* Blue */
/* border-right: 10px solid #1e90ff; */  /* If you want two blue bars */
}
table.ambox-delete,
table.ambox-serious {
  border-left: 10px solid #b22222;       /* Red */
}
table.ambox-content {
  border-left: 10px solid #f28500;       /* Orange */
}
table.ambox-style {
  border-left: 10px solid #f4c430;       /* Yellow */
}
table.ambox-merge {
  border-left: 10px solid #9932cc;       /* Purple */
}
table.ambox-protection {
  border-left: 10px solid #bba;          /* Gray */
}
table.ambox.ambox-mini {                 /* small floating box variant */
    float: right;
    clear: right;
    margin: 0 0 0 1em;
    width: 25%;
}

/* Icons for medialist templates (Malline:Kuuntele) */
 
div.listenlist {
    background: url("//upload.wikimedia.org/wikipedia/commons/thumb/a/a6/Gnome-speakernotes.png/30px-Gnome-speakernotes.png");
    padding-left: 40px;
}
 
div.videolist, div.multivideolist {
    background: url("//upload.wikimedia.org/wikipedia/en/thumb/2/20/Tango-video-x-generic.png/40px-Tango-video-x-generic.png");
    padding-left: 50px;
}
 
/* Style rules for media list templates */
div.medialist {
    min-height: 50px;
    margin: 1em;
    background-position: top left;
    background-repeat: no-repeat;
}
 
div.medialist ul {
    list-style-type: none; 
    list-style-image: none;
    margin: 0;
}
 
div.medialist ul li {
    padding-bottom: 0.5em;
}
 
div.medialist ul li li {
    font-size: 91%;
    padding-bottom: 0;
}

/* Etusivun hakupalkki yhdelle riville, p-elementti on oletuksena
   block, joten se rikkoo layoutin (ko. elementti on tyhjä). --str4nd */
.page-Wikipedia_Etusivu #bodySearch p {
  display: none
}

/* Kuvalinkit mahdollista lisätä samalle riville luokan avulla --str4nd */
.imagemap-inline div {
  display: inline;
}

/* Tiedoston tallennuksen yhteydessä näytettävä yhteenvetokenttä korkeammaksi --str4nd */
#wpUploadDescription {
  height: 13em;
}

/**** NavFrame ****/
div.NavFrame {
    margin: 0px;
    padding: 4px;
    border: 1px solid #aaa;
    text-align: center;
    border-collapse: collapse;
    font-size: 95%;
}

div.NavFrame + div.NavFrame {
    border-top-style: none;
    border-top-style: hidden;
}
div.NavPic {
    background-color: #fff;
    margin: 0px;
    padding: 2px;
    float: left;
}
div.NavFrame div.NavHead {
    height: 1.6em;
    font-weight: bold;
    background-color: #ccf;
}
div.NavFrame p {
    font-size: 100%;
}
div.NavFrame div.NavContent {
    font-size: 100%;
}
div.NavFrame div.NavContent p {
    font-size: 100%;
}
div.NavEnd {
    margin: 0px;
    padding: 0px;
    line-height: 1px;
    clear: both;
}
a.NavToggle {
    float: right;
    margin-right: 3px;
    font-weight: normal;
    font-size: 90%;
}

/**** /NavFrame ***/

/**** Edittools ***/
.fiwiki-feature {
    color: black !important;
    background-color: #ccddee !important;
    font-weight: bold !important;
    font-size: 0.9em !important;
    text-decoration: none !important;
    border: thin #006699 outset !important;
    padding: 0 0.1em 0.1em 0.1em !important;
    cursor: pointer !important;
}
 
.fiwiki-feature:hover {
    text-decoration: underline;
}
 
.specialbasic {
    background-color: transparent;
    padding: 0.2em;
    margin-right: 1em;
}
 
.bordered {
    border: 1px solid #ccc;
}

#fiwiki-bottom-toolbar { 
  margin-top:      0em;
  border:          1px solid silver;
  padding:         0.5em;
}

.fiwiki-special-character {
  border-bottom:   1px solid gray;
  border-right:    1px solid gray;
  padding-left:    0.3em;
  padding-right:   0.3em;
  background:      silver;
  font-size:       medium;
  cursor:          pointer;
}

#fiwiki-templatetable {
  padding:         0.5em;
  border:          1px solid #aa8;
}

.fiwiki-templatefeature {
  padding:         0.1em;
  background:      #ffd;
  border:          1px solid #aa8;
  font-size:       x-small;
  color:           gray;
  text-decoration: underline;
  cursor:          pointer;
}

/**** /Edittools ***/

/**** Etusivu ****/
.today_img {
  float: right;
  padding: 1px;
  margin-left: 2px;
  width: 104px;
  text-align: center;
  font-size: 80%; 
  line-height: 1.2;
}
.today_img .image {
  display: block;
}

/* Etusivun Etusivu-otsikon poisto */
body.page-Etusivu.action-view h1.firstHeading, body.page-Etusivu.action-submit h1.firstHeading { display: none; }

/**** /Etusivu ***/

/* Korostetaan ohjaukset sivulla [[Special:Allpages]]. */
.allpagesredirect a {
  border-bottom: 2px dotted #00bbff;
}

/* Estosivun formin visualClearin poisto */
.mw-special-Block form.visualClear { clear: none !important; }

/* FlaggedRevs ikoni sivun yläkulmasta väliaikaisesti piiloon */
div.flaggedrevs_short  { display:none  }
div.flaggedrevs_basic { display:none }
div.flaggedrevs_notice {display:none }
.flaggedrevs_preview { display:block !important }

/* Muokkausruudun yläpuolella oleva ilmoitus siitä, että artikkelissa on arvioimattomia muutoksia */
/* TESTAUS näkyvyydestä 4.1.2014: voiko tämän pakottaa näkyviin kaikille lukijoille. --Pxos */
.flaggedrevs_editnotice {display:block !important }

/* Seulontakäyttöliittymän erilaisten tekstien piilottaminen tavallisilta lukijoilta */
.mw-fr-reviewlink { display:none  }
.fr-diff-ratings { display:none  }
.flaggedrevs_reviewform  {display:none}
.fr-hist-basic-user  {display:none}
.fr-hist-basic-auto {display:none}
.fr-hist-quality-user {display:none}
.fr-hist-quality-auto {display:none}

/* Piilottaa palauta-linkit tuoreista muutoksista ja tarkkailulistalta.  */ 
/* UL.special > LI > SPAN.mw-rollback-link  { display:none  } */

/* Tekstin "päivitetty viimeisimmän käyntisi jälkeen" väritys */
/* Teksti tullut historiatietoihin MediaWiki 1.20 -version päivityksen yhteydessä */
span.updatedmarker {
 font-size:x-small;
 color: #040;
 background-color: #ff8;
}

/* Muokkausyhteenvetokenttä näkyvämmän väriseksi */
input#wpSummary{ background-color:#FFFF99;}

/* Mahdollistaa keskittämättömän hakulaatikon luomisen */
.noncentered > div { text-align:inherit !important }

/* Poistaa kahden NavFramen välisen välin 
- lisätty 24.10.2012 Käyttäjä:Olli:n pyynnöstä --Zache
*/
.NavFrame + .NavFrame {
margin-top: -1px;
}

/*** scripted multicolumn no-wikistä ***/
.multicol-verysmall .multicol + ul, .multicol-verysmall .multicol + ol { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; }
.multicol-xx-small  .multicol + ul, .multicol-xx-small  .multicol + ol { column-count: 1; -moz-column-count: 1; -webkit-column-count: 1; }
.multicol-x-small   .multicol + ul, .multicol-x-small   .multicol + ol { column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; }
.multicol-small     .multicol + ul, .multicol-small     .multicol + ol { column-count: 3; -moz-column-count: 3; -webkit-column-count: 3; }
.multicol-normal    .multicol + ul, .multicol-normal    .multicol + ol { column-count: 4; -moz-column-count: 4; -webkit-column-count: 4; }
.multicol-large     .multicol + ul, .multicol-large     .multicol + ol { column-count: 5; -moz-column-count: 5; -webkit-column-count: 5; }
.multicol-x-large   .multicol + ul, .multicol-x-large   .multicol + ol { column-count: 6; -moz-column-count: 6; -webkit-column-count: 6; }
.multicol-xx-large  .multicol + ul, .multicol-xx-large  .multicol + ol { column-count: 7; -moz-column-count: 7; -webkit-column-count: 7; }
.multicol-verylarge .multicol + ul, .multicol-verylarge .multicol + ol { column-count: 8; -moz-column-count: 8; -webkit-column-count: 8; }

/* Muokkauspisteet-sivun tyylit */
.contributionscores-wrapper       {  }
.contributionscores-title         { background-color: #aaaaaa; margin-bottom: 0px; padding-left: .4em; }
.contributionscores .header { background-color: #cccccc; border-bottom: 1px solid #999999; font-weight: bold; }
.contributionscores .odd        { background-color: #eeeeee; }
.contributionscores .header td   { padding-left: .2em; padding-right: .2em; }
.contributionscores .content   { padding-left: .2em; padding-right: .2em; }

/* Style for horizontal lists (separator following item).
   @source mediawiki.org/wiki/Snippets/Horizontal_lists
   @revision 8 (2016-05-21)
   @author [[User:Edokter]]
 */
.hlist dl,
.hlist ol,
.hlist ul {
    margin: 0;
    padding: 0;
}
/* Display list items inline */
.hlist dd,
.hlist dt,
.hlist li {
    margin: 0;
    display: inline;
}
/* Display nested lists inline */
.hlist.inline,
.hlist.inline dl,
.hlist.inline ol,
.hlist.inline ul,
.hlist dl dl, .hlist dl ol, .hlist dl ul,
.hlist ol dl, .hlist ol ol, .hlist ol ul,
.hlist ul dl, .hlist ul ol, .hlist ul ul {
    display: inline;
}
/* Hide empty list items */
.hlist .mw-empty-li {
    display: none;
}
/* Generate interpuncts */
.hlist dt:after {
    content: ": ";
}
.hlist dd:after,
.hlist li:after {
    content: " · ";
    font-weight: bold;
}
.hlist dd:last-child:after,
.hlist dt:last-child:after,
.hlist li:last-child:after {
    content: none;
}
/* Add parentheses around nested lists */
.hlist dd dd:first-child:before, .hlist dd dt:first-child:before, .hlist dd li:first-child:before,
.hlist dt dd:first-child:before, .hlist dt dt:first-child:before, .hlist dt li:first-child:before,
.hlist li dd:first-child:before, .hlist li dt:first-child:before, .hlist li li:first-child:before {
    content: " (";
    font-weight: normal;
}
.hlist dd dd:last-child:after, .hlist dd dt:last-child:after, .hlist dd li:last-child:after,
.hlist dt dd:last-child:after, .hlist dt dt:last-child:after, .hlist dt li:last-child:after,
.hlist li dd:last-child:after, .hlist li dt:last-child:after, .hlist li li:last-child:after {
    content: ")";
    font-weight: normal;
}
/* Put ordinals in front of ordered list items */
.hlist ol {
    counter-reset: listitem;
}
.hlist ol > li {
    counter-increment: listitem;
}
.hlist ol > li:before {
    content: " " counter(listitem) "\a0";
}
.hlist dd ol > li:first-child:before,
.hlist dt ol > li:first-child:before,
.hlist li ol > li:first-child:before {
    content: " (" counter(listitem) "\a0";
}

/* Default style for navigation boxes */
.navbox {                     /* Navbox container style */
    box-sizing: border-box;
    border: 1px solid #a2a9b1;
    width: 100%;
    clear: both;
    font-size: 88%;
    text-align: center;
    padding: 1px;
    margin: 1em auto 0;       /* Prevent preceding content from clinging to navboxes */
}
.navbox .navbox {
    margin-top: 0;            /* No top margin for nested navboxes */
}
.navbox + .navbox {
    margin-top: -1px;         /* Single pixel border between adjacent navboxes */
}
.navbox-inner,
.navbox-subgroup {
    width: 100%;
}
.navbox-group,
.navbox-title,
.navbox-abovebelow {
    padding: 0.25em 1em;      /* Title, group and above/below styles */
    line-height: 1.5em;
    text-align: center;
}
th.navbox-group {             /* Group style */
    white-space: nowrap;
    /* @noflip */
    text-align: right;
}
.navbox,
.navbox-subgroup {
    background: #fdfdfd;      /* Background color */
}
.navbox-list {
    line-height: 1.5em;
    border-color: #fdfdfd;    /* Must match background color */
}
/* cell spacing. .navbox-spacing-temp can be removed after the template change finished */
.navbox-spacing-temp.navbox tr + tr > th,
.navbox-spacing-temp.navbox tr + tr > td,
.navbox-spacing-temp.navbox-subgroup tr + tr > th,
.navbox-spacing-temp.navbox-subgroup tr + tr > td {    /* Borders above 2nd, 3rd, etc. rows */
    border-top: 2px solid #fdfdfd; /* Must match background color */
}
.navbox th,
.navbox-title {
    background: #ccccff;      /* Level 1 color */
}
.navbox-abovebelow,
th.navbox-group,
.navbox-subgroup .navbox-title {
    background: #ddddff;      /* Level 2 color */
}
.navbox-subgroup .navbox-group,
.navbox-subgroup .navbox-abovebelow {
    background: #e6e6ff;      /* Level 3 color */
}
.navbox-even {
    background: #f7f7f7;      /* Even row striping */
}
.navbox-odd {
    background: transparent;  /* Odd row striping */
}
.navbox .hlist td dl,
.navbox .hlist td ol,
.navbox .hlist td ul,
.navbox td.hlist dl,
.navbox td.hlist ol,
.navbox td.hlist ul {
    padding: 0.125em 0;       /* Adjust hlist padding in navboxes */
}

/* Default styling for Navbar template */
.navbar {
    display: inline;
    font-size: 88%;
    font-weight: normal;
}
.navbar ul {
    display: inline;
    white-space: nowrap;
}
.mw-body-content .navbar ul {
    line-height: inherit;
}
.navbar li {
    word-spacing: -0.125em;
}
.navbar.mini li abbr[title] {
  font-variant: small-caps;
  border-bottom: none;
  text-decoration: none;
  cursor: inherit;
}
/* Navbar styling when nested in infobox and navbox */
.infobox .navbar {
    font-size: 100%;
}
.navbox .navbar {
    display: block;
    font-size: 100%;
}
.navbox-title .navbar {
    /* @noflip */
    float: left;
    /* @noflip */
    text-align: left;
    /* @noflip */
    margin-right: 0.5em;
}

img {
	padding: 0.25em;
}

#ylaboksi {
	background:#f9f9f9; 
	margin:0 auto 6px auto; 
	border:1px solid #ddd;
}

#mp-topbanner {
	display: inline-block;
	text-align:center;
	max-width: 64%;
	vertical-align:top; 
	margin-left: 1em;
}

#otsikko {
	font-size:162%; 
	border:none; 
	margin:0; 
	padding:.1em; 
	color:#000;
}

#boxtwo {
	display: inline-block;
	max-width:13%;
	min-width:150px;
	font-size:95%;
	vertical-align:top; 
}

#boxthree {
	display: inline-block;
	max-width:23%; 
	font-size:95%;
	vertical-align:top; 
}

#mp-upper {
width: 100%; margin:0 0 0 0; background:none; border-spacing: 0px; display: inline-block;

}
.MainPageBG {
display: inline-block;
width:49%; 
border:1px solid #cef2e0; 
background:#f5fffa; 
vertical-align:top; 
color:#000;
clear:both;
}

.grid {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: 0;
     -moz-column-gap: 0;
          column-gap: 0;
  position: relative;
}
.grid-element {
  margin: 0;
  padding: 5px;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}


@media screen and (max-width: 660px) {
	#mp-topbanner{
		max-width: 100%;
	}
	
	#boxtwo {
		max-width: 100%;
	}
	
	#boxthree {
		max-width: 100%;
	}

	#otsikko {
    	font-size: 5.3vw;
	}
	
	.MainPageBG {
		width:100%;
	}
	
	.grid {
		-webkit-column-count: 1;
    	-moz-column-count: 1;
        column-count: 1;
	}
}

/*</nowiki></pre>*/