﻿html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-family: inherit; vertical-align: baseline;}

body
{
background-color: none;
font-family: sans-serif; font-size: 100%; font-style: normal;
background-image: url(draama-taustaseina-3.jpg);
background-repeat: repeat;
}



div.taittopinta
{
max-width: 1000 px;
margin: 1.5em 8% 1.5em 8%;
padding: 0;
}



@media screen and (max-width: 800px)
  {

	div.taittopinta
	{
	margin: 1.5em 3% 1.5em 3%;
	padding: 0;
	}
  }



#kasvokuva
{
display: inline-block;
margin: 0;
padding: 0;
background-color:#ffffff;
height: 379px;
width: 100%;
background:url(mika-lahtinen-kuusen-edessa-1000.jpg);
background-position:40% 30%; 
background-size: cover;
background-repeat:no-repeat;
}

#kasvokuva iframe
{
height: 379px;
width: 100%;
}


@media screen and (max-width: 700px)
  {
	#kasvokuva
	{
	margin: 0;
	padding: 0;
	text-align: center;
	background-color:#ffffff;
	height: 180px;
	width: 100%;
	min-width: 180px;
	background:url(mika-lahtinen-kuusen-edessa-1000.jpg);
	background-position:40% 30%; 
	background-size: cover;
	background-repeat:no-repeat;
	font-size:0.6em;
	}
   
	#kasvokuva iframe
	{
	height: 180px;
	width: 100%;
	}
   }




/* Exploreria varten ja muutenkin navipalkin yleissäädöt */
/* Vanha palkintaustaväri: #f3e8ee, painikkeiden tausta #666666
   Punasävy: #a63338     */






#navipalkki {
   display: inline-block;
   background:#f3e8ee;
   border-top:1px solid #695555;
   border-bottom:1px solid #695555;
   font-size: 0.65em;
   
   text-align:center;
   padding: 0em 0em 0em 0em;
   margin:  0em auto 0.5em auto;
   width: 100%;
   }

p.navipalkki {padding:0; margin:0; text-align: center; font-color: white;}

a.navipalkki {color:#222222;}

a.navipalkki:link, a.navipalkki:visited {color:#222222; display: inline-block; margin: 0em 0.2em 0em 0.2em; padding: 1em 0.7em 1em 0.7em; background-color: none; text-decoration: none; border-width: 0 0 2px 0; border-style: solid; border-color:#f3e8ee; text-transform: uppercase;}
a.navipalkki:hover, a.navipalkki:active {color:#222222; border-color: #5d7f4a; background-color: #f3f2ee; border-width: 0 0 2px 0; border-style: solid;}


a.aktiivinen {color:#222222;}
a.aktiivinen:link, a.aktiivinen:visited {color:#222222; display: inline-block; margin: 0.0em 0.2em 0.0em 0.2em; padding: 1em 0.4em 1em 0.4em; background-color: none; text-decoration: none; border-width: 0 0 2px 0; border-style: solid; border-color:#5d7f4a; text-transform: uppercase;}
a.aktiivinen:hover, a.aktiivinen:active {color:#222222; border-color: none none #5d7f4a none; background-color: none; border-width: 0 0 2px 0; border-style: solid;}




@media screen and (max-width: 700px)
  {

#navipalkki {

   
   background:#f3e8ee;
   border-top:0px solid #695555;
   border-bottom:1px solid #695555;
   font-size: 0.5em;
   text-align:center;
   margin: 0em auto 0.5em auto;
   padding: 0em 0em 0em 0em;

   width: 100%;
 
   }




 /* Uusi väritys */
	p.navipalkki {padding: 0; margin: 0 auto 0 auto; line-height:100%; text-align: center; font-color: #000000; display:inline-block; width: 99%;}
 	a.navipalkki {color:#222222; width: 29%;}
	a.navipalkki:link, a.laatikko:visited {color:#222222; display: inline-block; margin: 0em 0.1em 0em 0.1em; padding: 1em 0em 1em 0em; background-color: none; text-decoration: none; border-width: 0px; border-style: solid; border-color:#ADAFAA; text-transform: uppercase;}
	a.navipalkki:hover, a.laatikko:active {color:#222222; border:none;}


	a.aktiivinen {color:#222222; width: 29%;}
	a.aktiivinen:link, a.laatikko:visited {color:#222222; display: inline-block; margin: 0em 0.1em 0em 0.1em; padding: 1em 0em 1em 0em; background-color: none; text-decoration: none; border-width: 0 0 2px 0; border-style: solid; border-color:none none #5d7f4a none; text-transform: uppercase;}
	a.aktiivinen:hover, a.laatikko:active {color:#222222; border-color:none none #5d7f4a none;}



}



/* mediaruudun leveys yli 700px */


#palsta62 {width: 57.5%; padding: 0; margin-right: 3%; margin-left: 3%; display: inline-block; float:left; }
#palsta38 {width: 36.5%; padding: 0; float:left; display: inline-block;}


#juttulaatikko {margin: 0.8em 0.8em 0.8em 0.8em; padding: 0; background-color: #f3e8ee; display: inline-block;}
#juttulaatikko img

	{
	width: 100%;
	height: auto;
	border-color: #aaaaaaa;
	border-style: solid;
	border-width: 0px; 
	border-radius: 0em;
        
	}


#juttulaatikko h1, #juttulaatikko h2 {margin: 0.5em 4% 0.5em 4%; padding: 0;}
#juttulaatikko p {margin: 0.5em 4% 0.5em 4%; padding: 0;}





@media (max-width: 700px)
{
#palsta62, #palsta38 {width: 96%; margin: 0 2% 0 2%; clear: both;}
#juttulaatikko {margin: 0.8em 2% 0.8em 2%;}
}








div.info
{
	padding: 0.5em 0 0.5em 0;
	background-color:#ffffff;
}

@media screen and (max-width: 800px)
{

	div.info
	{
		padding: 0em 0 0.5em 0;
		background-color:#ffffff;
	}

}




div.koko
{
width:25 em; 
}

div.kuva
{
padding: 0em 0em 0em 0em;
text-align: center;
background-color:#ffffff;
}















ul
{
margin-left: 20%;
margin-right: 5%;
font-family: arial, sans-serif;
line-height: 138%;
padding-left: 5%;
}

ol
{
font-family: arial, sans-serif;
line-height: 138%;
margin-left: 30%;
margin-right: 5%;
padding-left: 5%;
}

h1
{
margin-top: 2em;
margin-left: 20%;
margin-right: 5%;
color: black; font-size: 1.9em; font-family: tahoma, verdana, sans-serif; font-style: normal; font-weight: bold;  line-height: normal;
padding: 0em 0em 0em 0em; 
}




h2
{
margin-top: 2em;
margin-left: 20%;
margin-right: 5%;
color: black; font-size: 1.1em; font-family: tahoma, verdana, sans-serif; font-style: normal; font-weight: bold;  line-height: normal;
padding: 0em 0em 0em 0em; 
}


h2.kivijalka
{
color: #000000;
margin: 1em 0 0 0;
font-size: 1.5em; font-family: tahoma, verdana, sans-serif; font-style: normal; font-weight: thin;  line-height: normal;
text-align: center;
padding: 0.2em 0.8em 0.2em 0.8em; 
}

h2.ylalaita
{
color: #000000;
margin: 0 0 0 0;
font-size: 1.2em; font-family: tahoma, verdana, sans-serif; font-style: normal; font-weight: thin;  line-height: normal;
text-align: center;
padding: 0em 0.2em 0em 0.2em; 
   border-top:1px solid #695555;
   border-bottom:1px solid #695555;
}



p
{
font-family: sans-serif;
line-height: 138%;
padding: 0em 1.5em 0.5em 0em;
margin-left: 20%;
margin-right: 5%;
margin-top: 0.5em;
}

p.pallo { background-image: url(pallot.png); background-repeat: no-repeat; 
background-position: 0em 0.3em; 
font-weight: normal; 
padding: 0em 0em 0em 1.4em;
margin-top: 1.5em;
}

p.olematonlainaus {text-align: center; font-size:1.15em; color:#444444; line-height: 130%; font-family: arial, verdana, sans-serif; background-image: url('olematon-ruudukkotausta.jpg'); padding: 2em;}
p.hailakkalainaus {text-align: center; font-size:1.15em; color:#444444; line-height: 130%; font-family: arial, verdana, sans-serif; background-image: url('hailakka-ruudukkotausta.jpg'); padding: 2em;}
p.karttateksti 
{
color: #000000;
margin: 0 0 0 0;
font-size: 1.2em; font-family: tahoma, verdana, sans-serif; font-style: normal; font-weight: thin;  line-height: normal;
text-align: center;
padding: 0em 0.2em 0em 0.2em; 
   border-top:1px solid #695555;
   border-bottom:1px solid #695555;
}


@media screen and (max-width: 800px)
  {

	h1, h2
	{
	margin-top: 0em;
	margin-left: 5%;
	margin-right: 1%;
	padding-top: 1em;
	}

	
	h1
	{
	margin-bottom: 0.6em;
	font-size: 1.6em;
	
	}



	p
	{
	margin-left:5%;
	margin-right: 1%;
	}

	p.olematonlainaus {margin: 0;}
	p.hailakkalainaus {margin: 0;}
	p.karttateksti {display: none;}



	ul
	{padding-left: 0;
	}

	ol
	{padding-left: 0;
	}

	  
  }






span
{
color:#aa5555; font-style:italic
}

a:link { color: #aa5555; text-decoration: underline; }
a:visited { color: #551111; text-decoration: underline; }
a:hover  /* mouse over */ { color: #cc7777; text-decoration: underline; }

a:active  /* mouse down */ { color: #dd9999; text-decoration: bold; }

a { color: #aa5555; text-decoration: underline; }

