html,
body {
	padding: 0 !important;
	margin: 0 !important;
	font-size: 16px !important;
}
body {
	background-color: #fff;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-weight: 400;
	color: #444 !important;
	padding:0 1rem !important;
}
DIV#wrapper {
	width:100%;
  	margin: auto;
}

H1, H2, H3, DIV#valokuvaaja {
	font-weight: bold;
	color:#555;
}
H1 {
	font-size: 1.3rem;
	text-align: center;
	margin:1rem 0 1rem 0;
}
DIV#valokuvaaja {
	font-size: 1rem;
	text-align:center;
	margin:0;
	font-weight: bold;
}
H2 {
	margin:3rem 0 0.5rem 0;
	font-size:1.3rem;
}
UL, OL {
	margin:0;
	padding:0 0 0 1.5rem;
}
LI {
	margin:0 0 0.6rem 0;
	list-style-type: square !important;
}
OL LI {
	list-style-type: decimal !important;
	padding-bottom: 0.6rem;
}
OL LI UL {
	margin-top:0.8rem;
	padding-left:2.5rem;
}
OL LI UL LI {
	margin:0 0 0rem 0;
	list-style-type: square !important;
}
FORM OL LI {
	margin:0.3rem 0 0 0;
}
DIV, P {
	font-size:1rem;
}
P {
	line-height: 1.4rem;
}
P.footnote {
	font-size:0.9rem;
	line-height: 1.2rem;
}
STRONG {
	font-weight: 700;
}
.pieniTxt {
	font-size: 0.9rem !important;
	line-height: 1.05rem;
}
.eimarginaalia {
	padding:0 !important;
	margin:0 !important;
}
.korostusVari,
DIV#hinnat P.hinta {
	color:#037c03; 
}
.huomio {
	color:#F00;
}
.clear {
	clear:both;
}
A:link,
A:visited {
	color:#3636b4;
	text-decoration:underline;
}
A:hover,
A:active {
	text-decoration:none;
	color:#a56d04;
}

FORM {
	font-size:0.8rem;
	background-color: #EEE;
	padding:1rem;
	border-radius: 0.5rem;
	max-width:35rem;
}
INPUT {
	width:18rem;
	padding:0.4rem;
	font-size: 0.9rem;
	margin:0.2rem 0;
}
TEXTAREA {
	padding:0.4rem;
	font-size: 1rem;
	width: 95%;
	max-width: 35rem;
	height: 10rem;
}
LABEL {
	font-weight: bold;
	font-size:0.9rem;
}
DIV#header {
	padding-top:1rem;
}
DIV#logo {
	float:left;
}
DIV#logo IMG {
	height:4rem;
}
UL#nav {
	float:right;
	width:10rem;
}
UL#nav LI {
	list-style-type: none;
	font-size:0.9rem;
	padding:0.2rem 0;
	margin-bottom:0.2rem;
	text-align: right;
}
UL#nav LI A:link,
UL#nav LI A:visited {
	color:#11A;
	text-decoration:none;
}
UL#nav LI A:hover,
UL#nav LI A:active {
	text-decoration:underline;
	color:orange;
}
UL#nav LI A.aktiivinen {
	color:#3f3f3f;
}

DIV#content {
	clear:both;
	padding-top:1rem;
}
IMG.imageFull {
	width:100%;
	height:auto;
	max-width:1140px;
}

DIV#thumbs {
	display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    padding: 0px;
}
DIV#thumbs A {
	display: block;
    width: 60px;
    height: 60px;
    overflow: hidden;
    border: 1px solid #777;
    border-radius: 10px;
    transition: transform 0.2s;
}
DIV#thumbs A:hover {
	border-color: orange;
    transform: translateY(-5px);
}
DIV#thumbs A IMG {
	width: 100%; 
    height: 100%;
    object-fit: cover; 
    max-width: none; 
}

IMG.kuvituskuvaV {
	width:100%;
	height:auto;
	margin:0.4rem 1.2rem 0.5rem 0;
}
IMG.kuvituskuvaO {
	width:100%;
	height:auto;
	margin:0.4rem 0;
}

IMG.pienempi {
	max-width:350px;
	display:block;
}

DIV#esimerkkikohteita UL {
	margin:0;
	padding:0;
}
DIV#esimerkkikohteita LI {
	font-size:0.8rem !important;
	list-style: none !important;
	margin-bottom:1.2rem;
}
DIV#esimerkkikohteita LI A {
	font-size:0.95rem !important;
	padding-right:0.4rem;
	margin-top:0.1rem !important;
	display: block;
}

DIV.hintalaatikko {
	margin-bottom:1rem;
}
DIV#hinnat P.hinta {
	padding:0;
	margin:0.5rem 0 0 0;
}
DIV#hinnat P.hintaLisapalvelut {
	padding:0;
	margin:0;
}

.lomakePuute {
	color:red;
}

FOOTER {
	margin:8rem -1rem 0rem -1rem;
	background-color: #F3F3F3;
	padding:0rem 0.8rem 2rem 0.8rem;

}
FOOTER,
FOOTER H3,
FOOTER DIV,
FOOTER .section,
FOOTER P,
FOOTER A,
FOOTER STRONG {
	font-size: 0.9rem !important;
	line-height:normal;
	color:#000;
	line-height: 1.3rem;
}
FOOTER H3 {
	margin:0 0 0.3rem 0;
	font-size:0.9rem;
}