@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700|Open+Sans:400,400i,600,700,800');
@import url('https://fonts.googleapis.com/css?family=Merriweather');
html {width:100%;
	
}

body {	
	font-family: 'Open Sans', sans-serif;
	font-size: 100%;
	width:100%;
	background-color: rgba(251,251,251,1);	
}




/* ----- kirjaimia ----- */

h1 {font-family: 'Open Sans Condensed', sans-serif;
	font-size: 1.7em; color:rgba(70,70,70,1);}
h2 {
	font-family: 'Open Sans' sans-serif;
	font-size: 1.3em;
	font-weight: 400;
	line-height:1.8em;	
}
h2.kakkosOts { display: none;}
.punainen { color: rgba(0,102,255,1);}
.elamKuvaaja {margin-top: -1.5em; font-size: .75em;}
.lihava { font-weight:600;}
.lihava800 { font-weight:800;}
.lihava700 { font-weight:700;}



/* ----- kirjaimet loppu ----- */	

/* ----- kuvia ------ */

img.flex { max-width:100%;}

.kuva_re-1 { margin-bottom: 28px; }
.kuva_re-2 {border-top:solid 1px rgba(100,100,100,1);
			border-bottom:solid 1px rgba(100,100,100,1);
			padding:10px; background-color:#fff;
			margin-bottom: 3px;
}

.kuva_re-2b {
	border-top: 1px dotted rgba(100,100,100,1);
	border-bottom: 1px dotted rgba(100,100,100,1);
	padding: 10px;
	background-color: #fff;
	margin-bottom: 3px;
}
.kuva_re-3 { border-bottom:solid 1px rgba(100,100,100,1);
			padding:10px; background-color:#fff;
			margin-bottom: 3px; }
.kuva_re-4 { border:solid 1px rgba(100,100,100,1);
			padding:10px; background-color:#fff;
			margin-bottom: 3px; }
.kuva_re_etus-1 {  /*border:solid 1px rgba(100,100,100,1);
			padding:10px; background-color:#fff;*/
			margin-bottom: 3px; display:block;
			
	}

			
.ylamarg { margin-top: 26px;}
.vasmarg { margin-left:30%;}
.vasmarg2 { margin-left:14%;}
.vasmarg3 { margin-left:4%;}
.vasmarg4 { margin-left:7%;}
img.etukuva { margin-top: 0px; margin-left: 0px; margin-bottom: 10px; 
}

img.bloImg { display: block;}

.kukka { margin-left:25%; /*margin-top: 100px*/ margin-top:25px;;}
.konna { margin-left:10px; margin-top:15px;}
/* ----- kuvia loppu ------ */
	
#ylapalkki {height:9px;  background-color:rgba(51,153,255,1);
			width: 100%;
}

body.juttu #ylapalkki { height:10px;}

div#sivu {
	margin: 0px auto;
	padding-top: 15px;
	max-width:960px;
	position: relative;
	/*background-color: rgba(251,251,251,1);*/
	padding-bottom: px;
	height:auto;
}
div#sivu::after {content:''; display: block; clear: both;}

header { 
	float: left;
	width: 210px;
	padding: 0px 0px 10px 10px;
    border-left: 3px solid #C5C5C5;
    margin-top: 5px;
	/*border-left: 3px solid rgba(0,153,255,1);*/
	/*background-color:rgba(240,247,236,1);*/
}

/* -----  Headerin varjo-----*/

#headerVarjo { display:none;}

/* ----------- Navigointi ------------------- */

/*nav {width:auto;}*/
nav ul { margin-top:15px;}
nav ul li a {
	font-size: 1em;
	line-height: 1.8em;
	text-decoration: none;
	color: rgba(20,20,20,1);
}
nav ul li a:hover { color:rgba(255,51,0,1);}
nav a.mobile_menu {
	background-image: url(../kuva17_veikko/lisakuva/icon_menu_2.1.svg);
	background-repeat: no-repeat;
	background-size: contain;
	height: 70px;
	width: 70px;
	position:absolute; top: 1px; left: 48%;
	display: none;
}
nav li.veinyt a { color:rgba(0,102,255,1);}

/* ----------- Navigointi loppu ------------------- */

/* ----- article ------- ----------------------------*/


article#sisalto { margin-top: 0px; padding-top: 10px; float:left; width:73%;}
article#sisalto p {
	
	font-size: 0.85em;
	line-height: 1.55em;
	margin-bottom: 1.55em;
	max-width: 560px;
	color:rgba(55,55,55,1);
	margin-left: 3px;
	
}

.etus article#sisalto p {
	max-width: 480px;
	/*font-family: 'Merriweather', serif;*/
}
article#sisalto h3 {
	font-weight: 700;
	font-size: 1.05em;
	line-height: 1.3;
	padding-left: 3px;
	color: rgba(51,51,51,1);
}
#etus article#sisalto p {max-width: 450px;/* margin-left:12px;*/}
.elam article#sisalto p {
	font-family: 'Merriweather', serif;
	font-size: 0.85em;
	line-height: 1.7em;
	margin-bottom: 1.7em;
	max-width: 480px;
	color: rgba(51,51,51,1);
		
}

.elam article#sisalto, #curric.cvee article#sisalto {border-left: 1px dotted rgba(102,102,102,1);padding-left: 10px; 
border-right: 1px dotted rgba(102,102,102,1); border-top: 1px dotted rgba(102,102,102,1); border-bottom: 1px dotted rgba(102,102,102,1); padding-bottom:150px; margin-top:10px;
/*max-width:600px;*/}
.etus article#sisalto { padding-bottom:150px; margin-top:10px;
	
	}

article#sisalto2 { margin-top: 0px; padding-top: 10px; float:left; width:73%;}
.elam article#sisalto2 p {
	font-family: mrs-eaves-xl-serif-narrow,serif;
font-weight: 400;
font-style: normal;
	font-size: 1em;
	line-height: 1.3em;
	margin-bottom: 1.3em;
	max-width: 580px;
	color: rgba(51,51,51,1);
		
}

body.juttu div#sivu { padding-top: 25px;}
body.kuvat div#sivu { padding-top: 20px; padding-bottom: 500px;}

body#curric a.valmet { text-decoration:none; color:rgba(0,102,255,1);}
body#curric a.valmet:visited {color: rgba(0,102,255,1);}
body#curric a.valmet:hover { color: rgba(204,204,204,1);}

.marg1 { margin-left:35%; margin-right: auto;}
/*------ esilla -------- --------------------------*/

#esilla article#sisaltoEs img {
	padding: 10px;
	background-color: #fff;
	margin-bottom: 4px;
	border-top: 1px solid #333;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #333;
	border-left: 1px solid #ccc;
}
#esilla article#sisaltoEs img.mustaBg { background-color: rgba(204,204,204,1); border-color:#ccc;}
#esilla img.alku { margin-bottom:10px; margin-left:20px;}
div.kuvakehys { max-width:260px; float:left; margin:10px; margin-right:30px;  height:320px;}
div.kuvakehys p {max-width: 255px; font-size:0.7em; line-height: 1.2; padding-left: 7px;}
article#sisaltoEs { margin-left:225px; margin-top:5px; }
article#sisaltoEs::after {
	content: '';
	display: block;
	clear: both;
}
body#esilla header p { font-size: .8em; max-width: 130px; line-height:1.5em;}
body#esilla header p.kapeassa { display: none;max-width: 230px; margin-left:12px;}

/*body#esilla, body#esilla div#sivu { background-color: #eee;} */

div#luettelo {max-width: 580px;  padding-left: 10px; padding-top: 10px; margin-left:10px;}
div#luettelo::after {
	content: '';
	display: block;
	clear: both;
}


/* -------- Popup ----------------------------*/

/* Popup container - can be anything you want */
.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* The actual popup */
.popup .popuptext {
    visibility: hidden;
    width: 420px;
    background-color: #fff;
    color: #333;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 3%;
  	margin-left: -20px;
}


div#sivu article#sisalto div.popDiv p { font-size:.8em;
	line-height: 1.7em; max-width:400px;}
div.popDiv{ 
	background-color: #fff; 
	padding: 10px;
	max-width: 100%;
	-moz-box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
	box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
}
/*span.popDiv{ 
	background-color: #fff; 
	padding: 10px;
	width: auto;
	-moz-box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
	box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.5), 0 20px 40px 0 rgba(0, 0, 0, 0.5);
}*/
#sivu div.popup span.pup {font-family: 'Open Sans', sans-serif;
	font-size:1em;}

/*div.popDiv img {margin: 5px auto 26px 5px;}*/

/* Popup arrow */
/*.popup .popuptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}*/

/* Toggle this class - hide and show the popup */
.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn .5s;
    animation: fadeIn .5s;
}
p.popuppiin {display: inline; margin-bottom:0px;}
article#sisalto p.popuppiin.popuppiinDec { color:rgba(0,102,255,1); text-decoration:none; line-height: 2em;}
article#sisalto p.popuppiin.popuppiinDec:hover { color:rgba(204,204,204,1);}
article#sisalto p.eimabo { margin-bottom: 0px;}
body.etus article#sisalto p.popuppiin.popuppiinDec { }
/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}

/* -------- Popup loppuu ----------------------------*/

/* --- contentSlider  --- --- --- --- --- --- */
.contentSlider img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0px auto 20px auto;
	background-color: rgba(255,255,255,1);
	padding: 10px;
	border: 1px solid rgba(170,170,170,1);
}
.contentSlider img.eire {border:none; padding: 0px;}
.contentSlider img.kuva_re-2 {border-top:solid 1px rgba(100,100,100,1);
			border-bottom:solid 1px rgba(100,100,100,1);
			border-left: none 0px;
			border-right: none 0px;
			padding:10px; background-color:#fff;
			margin-bottom: 3px;
}
.contentSlider img.kuva_re-5 {
			border: none 0px;
			padding:10px; background-color:#fff;
			margin-bottom: 3px;
}
.contentSlider img.eiremar {border:none; padding: 0px; margin-top:35px;}
.contentSlider img.tobore {border-top: 1px solid rgba(160,160,160,1);
	border-bottom: 1px solid rgba(160,160,160,1);
	padding: 10px;
	background-color: #fff;
	margin-bottom: 30px;
	border-right-width: 0px;
	border-left-width: 0px;
	border-right-style: none;
	border-left-style: none;}
.contentSlider div.vas img { margin-left:0; margin-right: auto; overflow:hidden;}
#content-slider-1 { margin-left: 240px; padding-top:28px; width:auto;}

.opens_6 { font-family: 'Open Sans', sans-serif;	
			font-weight: 600;
}
.opens_7 { font-family: 'Open Sans', sans-serif;	
			font-weight: 700;
}

/*additional...*/
.contentSlider {
  width: 100%;
}
/*.contentSlider,
.contentSlider .rsOverflow,
.contentSlider .rsSlide,
.contentSlider .rsVideoFrameHolder,
.contentSlider .rsThumbs {
  background: rgba(250,250,250,1);
  color: #000;
}*/
/*.contentSlider .rsSlide,
.contentSlider .rsOverflow {
  background: #FBFBFB;
}*/
/*.contentSlider h3 {
  font-size: 24px;
  line-height: 31px;
  margin: 12px 0 8px;
  font-weight: bold;
}*/
/*.contentSlider img {
  max-width: 100%;
  height: auto;
  display: block;
}
.content-slider-bg {
  width: 86%;
}*/

/*addiEnd*/
/* --- contentSL loppu --- ----- ------ ----*/

/*_____ footer ____*/



footer {height:400px;
		width: 100%;
		background-color: #333;
		padding-top: 25px;}
		
footer div { margin: 0 auto; max-width: 960px;}

footer div .linkkikuviin {
    max-width: 400px;
    float: left;
    margin-bottom: 22px;
    
}
footer div p {
    clear: both;
}
footer div .linkkikuviin img {
    margin-left: 23px; 
    margin-right: 23px;
}

footer div .linkkikuviin img:hover {
    opacity:0.5;
   filter: alpha(opacity=50); /* For IE8 and earlier */
    
}
footer div .linkkikuviin a p {
    font-size: 0.75em;
    color: white;
    width: 300px; 
    text-decoration: none;
    
}
footer div .linkkikuviin p:hover {
    color:rgba(169,169,169,1.00);
    
}
footer div p { ;color:rgba(153,153,153,1);  font-size:.7em; line-height: 1.5; padding-left:12px; max-width:370px;}


/*.kuvat #sivu #content-slider-1 .vas .rsImg.vas2Re1.inla {
	display: inline;
}	*/	
		
@media screen and (max-width:1090px)	{
body.kuvat div#sivu { padding-top: 25px; padding-bottom: 450px;}
body.juttu div#sivu { padding-top: 20px;} 	
#ylapalkki2 {height:1px;  background-color:rgba(246,246,248,1);
			width: 100%; border-top:solid 1px rgba(120,120,120,1);}
.elam article#sisalto, #curric.cvee article#sisalto { margin-top:0px;}
article#sisaltoEs { margin-top:40px;}	
}	
		
@media screen and (max-width: 960px)	{

header { 	
	border-left: none 0px;
	margin-left: 5px;
	/*background-color: rgba(255,255,204,1);*/
	
}
article#sisalto { width:68%} 
body#curric div#sivu  article#sisalto { border: none 0px;}	
.kuva_re-3 { border-bottom:solid 1px rgba(100,100,100,1);
			border-top:solid 1px rgba(100,100,100,1);}
			
.rsDefaultInv .rsGCaption { 
	left: -230px;
	top: 352px;
	border:none; }
	
}
	
@media screen and (max-width: 800px) {
	
#ylapalkki {height:5px;}
body.juttu #ylapalkki { height:6px;}

	
nav a.mobile_menu {
	display: block; 
	top: 0px;
	left: 32%;
}
header {height:auto; min-height: 40px; margin: 0 auto 0 auto; width:100%; border: none; position:relative; /*z-index:10;*/ float:none; }	
nav { width:100%; height: 0px; overflow: hidden;/* position: relative;*/ position:static; display:inline-block; background-color:rgba(251,251,251,1);}

header{ /*background-color:rgba(242,245,248,1);*/}
div#sivu { padding-bottom:500px;}

/*nav ul {display:block; position:static;
}*/

nav > ul {padding:0;}
nav > ul > li {/* float: none;*/ margin-top: 10px;}	
/*nav > ul > li.alinli { margin-bottom: 100px;}	*/
nav ul li a {  padding: 5px 5px 5px 20px; display:block; width: 100%; border-bottom: solid 1px  #0066FF; margin-right:15px;}


body#curric div#sivu  article#sisalto { margin-top: 0px; padding-top: 0px; padding-left: 18px; width: 90%; float:none; border: none 0px;}


#otsikotDiv {
	border-left: none 0px;
	
	margin-left: 12px;
	
}
h1 { margin-left: 10px; padding-bottom: 0px; font-size:1.8em;}

h2.kakkosOts { display:block; font-size: 0.86em; line-height: 1.3em; margin-left:13px; margin-top:5px;  color:#333;}

/*------ esilla -----*/
div#sivu article#sisaltoEs { margin-top: 10px; margin-left:10%; margin-right:auto;}
body#esilla header {}
body#esilla header p { max-width: 230px; padding-top:4px;}
article#sisalto { width:98%; float: none; border:none;}
body#esilla header p.kapeassa {display: block;}		
body#esilla header p.leveassa { display: none;}	 

/*----- esilla loppu  ----*/
body.juttu div#sivu { padding-top: 20px; overflow-x: hidden; /*overflow-x: auto;*/}
body.kuvat div#sivu { padding-top: 20px;  padding-bottom: 700px; overflow-x: hidden; /*overflow-x: auto;*//* border-left: solid 6px #3399FF;*/}
.kuva_re-3 { border-bottom:solid 1px rgba(100,100,100,1);
			border-top:solid 1px rgba(100,100,100,1);}
.kuva_re-oik { border-right:solid rgba(140,140,140,1) 1px;
padding-right:10px; }

/* -----  Headerin varjo-----*/




/* ---- Slider -------*/


.contentSlider div.vas img { margin: 15px auto 0 auto; max-width: 95%;}
.contentSlider div.vas.vasvas img { margin: 15px auto 0 8px; max-width: 95%;}
.contentSlider div.vas img.vasen1 { margin: 15px auto 0 10%; max-width: 95%;}
.contentSlider div.vas img.vasen2 { margin: 15px auto 0 22%; max-width: 95%;}
#content-slider-1 { margin-left: 3px; padding-top:0px;/* border-top:dotted 1px  #CCCCCC; *//*border-bottom:dotted 1px #cccccc;*/ padding-bottom: 38px;}

.rsDefaultInv .rsGCaption{ 
	position: absolute;
	float: none;
	top: 102%;
	left: 15px;
	text-align: left;
	/*border:none;*/
	width:450px;
	}
	
.rsDefaultInv .rsGCaption {
	
	/*width: 180px;*/
	/*border-top: 1px dotted rgba(160,160,160,1);*/
	padding-top:8px;
}	
    .leOhje2 {display: none;}
/*.rsDefaultInv div.tetete rsGCaption { 
	top: 1px;
	left: 200px;
	color:rgba(0,255,153,1);
}*/
}

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

h1 { font-size: 1.8em;}	

div.kuvakehys { margin-right:5px;}
div#sivu article#sisaltoEs { margin-left:8px;}
article#sisalto p, .elam article#sisalto p { font-size:.82em; line-height:1.6; margin-bottom:1.6em;}
	body.juttu div#sivu { padding-top: 15px;}

nav a.mobile_menu {
	top: -5px;
	left: 75%;
}
body#curric div#sivu  article#sisalto { padding-left:10px;}
	
.rsDefaultInv .rsGCaption {
	max-width: 90%; margin-left:-8px;	
}
.contentSlider div.vas img { margin: 15px auto 0 auto; max-width: 90%;}
#content-slider-1 { margin-left: 1px; padding-top:2px;}
/*.contentSlider {
  width: 90%;
}*/
img.flex { max-width:100%;}
img.flex2 { max-width:60%;}
.kuva_re-2 {border-top:solid 1px rgba(100,100,100,1);
			border-bottom:solid 1px rgba(100,100,100,1);
			padding-left:0px;
			padding-right:0px;
			margin-bottom: 3px;
}
.kuva_re-3 { border-bottom:solid 1px rgba(100,100,100,1);
			padding-left:0px;
			padding-right:0px;
			margin-bottom: 3px; }
body.kuvat div#sivu { padding-top: 12px;  padding-bottom: 700px; overflow-x: hidden; /*overflow-x: auto;*//* border-left: solid 6px #3399FF;*/}			
.contentSlider div.vas img.vasen1 { margin: 15px auto 0 auto; max-width: 95%;}
.contentSlider div.vas img.vasen2 { margin: 15px auto 0 auto; max-width: 95%;}
header {margin-left:0px;}
#otsikotDiv {margin-left:0px;
border-left: 0px none;}		
.kuva_re-oik {padding-right: 6px; 
	border-right: none 0px;}	
}
@media screen and (max-width: 640px) {
/*.rsDefaultInv div#tetete .rsGCaption {
	top: 10%;
	
}*/
}

@media screen and (max-width: 560px) {
div#sivu article#sisaltoEs { margin-left:5%; margin-right:auto;}	
.popup .popuptext { width:350px;}	
	
	
	}