body {
	margin:auto;
	;max-width:800px;
	max-width:44.4em;
	background-image: linear-gradient(lightgray 20%,#d5e0d6,  lightgray);
	font-family:'Aleo';
	color:#333;
	font-size:16px;
}

.mainBlock {
	background:white;
	margin:0px;
}

.grid-container {
	display:grid;
	grid-template-columns:70% 30%;
	padding:0px;
}

.grid-item {
	background-color:rgba(255, 255, 255, 0.8);
	padding:0px;
	text-align:center;
}


.navigationSAMPLE {
	font-size:1vw;
}

.navigation {
	font-size:normal; 
	margin:auto 0px;
	padding-bottom:10px;
	text-align:center;
}

.navigationButton {
	background-color: lightgreen;
	border: none;
	border-radius: 8px;
	color: darkgreen;
	padding: 2px 10px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 14px;
	margin: 2px 2px;
	cursor: pointer;
	transition-duration: 0.6s;
	box-shadow: 4px 4px 2px #bbb;
}

.navigationButton:hover {
	background-color:green;
}

/*
.navigation a {
	color:green;
	padding:0 10px;
	text-decoration:none;}

.navigation a:hover {
	color:red;
}
*/

.scaled {
	max-width:100%;height:auto;
}

.info {
	border:2px solid darkgreen;
	border-radius: 8px;
	padding:5px;
	color:white;
	background:#CD5C5C;
}

.huomautus {
	width:33%;
	margin:10px 10px 20px 10px;
	font-size:70%;
	box-shadow: 5px 5px 4px #bbb;
	padding:2px;
}

.margin50 {
	margin:50px 0px;
}


.floaterL {
	float:left;
	padding:10px;
}

.floaterR {
	float:right;
	padding:10px;
}


.sisallysluettelo {
	padding:0px 10px;
	font-size:14px;
}

.kategoria {
	background-image:url('../img/kategoria-punafade.png');
	background-size:40%;
	background-repeat:no-repeat;
	padding:55px 0px 0px 70px;
	font-variant:small-caps;
	font-size:18px;
	font-weight:bold;
	color:#333300;
	border-bottom:thin solid gray;
}

.lista {
	margin:2px 0px 5px 5px;
}

.lista a {
	text-decoration:none;
	transition-duration: 0.6s;
	padding:2px 10px 2px 0px;

}

.lista a:hover {
	background:lightgreen;
	color:darkgreen;
	border-radius: 8px;
	padding-left:10px;
}

.soppa {
	padding:10px;
}

.otsikko {
	font-weight:bold;
	font-size:150%;
	margin:0px 15px;
}

.otsikko2 {
	margin:0px 20px 20px 20px;
	font-size:125%;
	text-align:center;
	border: 2px solid #21ff21;
	border-radius:15px;
	background-color:#99ff99;
	box-shadow: 0px 2px green;
}

.ingressi {
	font-weight:bold;
	font-size:120%;
	margin:0px 10px;
}

.tummaTausta {
	background:#eee;
	padding:10px;
}

.yleisDiv {
	margin:10px;
}

.leipa {
	font-size:16px;
	margin:0px 10px;
	text-align: justify;
	text-justify: inter-word;
}

/*
.leipa:hover {
	background:#fcfcfc;
	transition-duration: 0.6s;
}
*/

@media only screen and (min-width: 600px){
	.kaksiPalstaa {
		column-count: 2;
		column-gap:15px;
	}
}

.kuvaTeksti {
	font-size:80%;
}

.border2px {
	border:2px solid green;
	padding:10px;
}

.roundCorner
{
	 border-radius: 25px;
}

.roundCorner10
{
	 border-radius: 10px;
}

.floatBox {
	float:left;
	width:30%;
	#min-height:400px;
	border:thin solid blue;
	margin:5px;
	padding:5px;
	font-size:12px;
}


.floatBox:first-line {
	font-size:14px;
	font-weight: bold;
}

.floatBoxClear {
	clear:both;
	display: table;
}

.flexBox {
	display: flex;
	#background-color: DodgerBlue;
}

.flexBox > div {
	background-color: #ddd;
	margin:10px;
	padding:20px;
	font-size:100%;
	border-radius:5px;
	border-right:2px solid #666;
	border-bottom:2px solid #666;
}

.flexBox img {
	border:thin solid #666;
}


div.gallery {
  margin: 5px;
  border: 1px solid #ccc;
  float: left;
  width: 180px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
  font-size:80%;
}

.disc {
	background-image:url('../img/valkoharmaakulma.gif');
	background-size: auto;
	background-repeat:no-repeat;
	background-position:bottom;
	text-align:left;
	padding:20px 0px 5px 20px;
	font-size:70%;
	margin:0px;
}