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

html{
  height:100%;
  margin-bottom:1px;
	color:#666;
}

body {
	font-family:helvetica neue,sans-serif;
	color:#666;
	font-size: 16px;
	text-align:center;
	background-color:#222;
	background-image:url(gallery/img/logo.png);
	background-repeat:no-repeat;
	/*overflow-y:scroll;*/
	margin:0;
	padding:0;

}
#header { display: none; } 


h1{
	font-weight:normal;
color:#888;
font-size:medium;
text-align:left;
}
/*cv ja yhteystiedot sivun fontit*/

h2{
	color:#F9F;
	font-size:medium;
	text-align:left;
	font-weight:normal;
}
	
h3{
	color: #888;
	font-size:small;
	text-align:left;
	font-weight:normal;
}
h4{
	font-weight:normal;
	color:#999;
	font-size:large;
	text-align:left;
}

/* Highlight selected navigation item */
#navigation ul li.selected a {
  color: #E6B499;
	font-weight: bold;
}
.lang-switch a {
  font-size: 15px;
  text-decoration: none;
  display: inline-block;
  transition: transform 0.2s, opacity 0.2s;
}
.lang-switch a:hover {
  opacity: 0.6;
}
.lang-switch .fi-flag { color: #005aa7; } /* sininen */
.lang-switch .en-flag { color: #cf142b; } /* punainen */


/* Sosiaalisten ikonien tyyli */
.social a,
.social a:visited,
.social a:active {
  color: inherit;
  text-decoration: none;
}

.social i {
  font-size: 26px;
  margin: 0 6px;
}

.social .fa-facebook { color: #1877f2; }
.social .fa-instagram { color: #e4405f; }

.social a:hover i { opacity: 0.8; }


.cvhead{
	color: #888;
	font-size:large;
	text-align:left;
	padding:0 0 5px 0;
	margin:0;
}
.cv{
	color:#666;
	text-align:left;
	padding:0 0 10px 0;
	margin:0;
}
.years {
	color:#C9C;
	margin:0;
}
.gallerybody {
	color: #666;
	text-align: left;
	font-size:16px;
}
.yhteys{
	color:#666;
	text-align:left;
	padding:0 0 2px 0;
	margin:0;
}
#wrapper{
width:auto;
height:auto;

}

#content{
color:#666;
margin:auto;
padding:140px 20px 30px 20px;
width:640px;
text-align:left;
}

#content_shop{
color:#666;
margin:auto;
padding:20px 20px 30px 20px;
width:640px;
text-align:left;
}


/*galleria etu sivun asetuksia*/
.gallerypicturecontainer{
width:150px;
float:left;
padding:0 30px 30px 0;
}
.gallerytextcontainer{
font-size: 16px;
width:450px;
height:151px;
float:right;
padding-top:10px;
padding-bottom:20px;
margin:0;
}
.gallerytextcontainer2{
font-size: 16px;
width:460px;
height:151px;
float:right;
padding-top:0px;
padding-bottom:0px;
margin:0;
}
#navigation{
background-color:#000;
padding:4px 0px 4px 0px;
min-width:450px;
text-transform:uppercase;
font-size:14px;
text-align:center;
}
#navigation ul {
margin:0;
}
#navigation ul li{
list-style:none;
display:inline;
}

li.selected{
color: #E6B499;
}

#navigation a:link, a:visited{
	color: #666;
	text-decoration: none;
}
#navigation a:hover {
	color: #E6B499;
	text-decoration: none;
}
#navigation a:active {
	color: #FFF;
	text-decoration: none;
}
#content a:link, #content a:visited{
	color:#999;
	text-decoration: none;
}
#content a:hover {
	color:#E6B499;
	text-decoration: none;
}
#content a:active {
	color: #FFF;
	text-decoration: none;
}

.facebook{
	float:right;
}
.picture{
	padding-bottom:30px;
}

/*galleria sisäsivut*/

#gallery_content{
color:#666;
margin:auto;
padding:0px 0px 00px 0px;
width:520px;
/*text-align:left;*/
}


/*mobiili skaalaus*/

/*@media only screen  
	and (device-width: 414px)
	and (device-height: 896px)
	and (-webkit-device-pixel-ratio: 2){
	body{
		width:100%;
		margin:0;
		background-image:none;
		background-image:hidden;
		opacity:0;
	
	}
	}*/

/* 1792x828px at 326ppi  xr*/
@media only screen 
    and (device-width : 414px) 
    and (device-height : 896px) 
    and (-webkit-device-pixel-ratio : 2) {
	body{
		width:100%;
		margin:0px;
		background-image:none;
	}
		
	h1{
		font-size:medium;
	}

	h2{
		font-size:medium;
	}
	
	h3{
		font-size:medium;
	}
	h4{
		font-size:medium;
	}

	#navigation{
	padding: 4px 0px 4px 0px;
	min-width: 100%;
	width: 100%;
	font-size: 14px;
	text-align: center;
	}	
	
	#navigation ul {
	margin: 0;
	padding: 0;
	}
	
	#header { display: block; } 
	#gallery_content{
    color:#666;
    margin:auto;
    padding:0px 0px 0px 0px;
    width:360px;
    /*text-align:left;*/
    }

		
	#main_image img{margin-bottom:20px; margin-top:20px; width:360px;}
	.gallery_demo_unstyled li{width:30px; height:30px;border:0px double #111; margin: 5px 2px; background:#000;}
	.gallery_demo5 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}
	.gallery_demo10 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}

		
		
}

/* 2436x1125px at 458ppi */
@media only screen 
    and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3) { 
	body{
		width:100%;
		margin:0px;
		background-image:none;
	}
		
	#main_image img{
		margin-bottom:20px; 
		margin-top:20px; 
		width:360px;
	}
	.gallery_demo_unstyled li{width:30px; height:30px;border:0px double #111; margin: 5px 2px; background:#000;}
	.gallery_demo5 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}
	.gallery_demo10 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}

		
	#gallery_content{
    color:#666;
    margin:auto;
    padding:0px 0px 0px 0px;
    width:300px;
    /*text-align:left;*/
    }
	}



/* 2688x1242px at 458ppi */
@media only screen 
    and (device-width : 414px) 
    and (device-height : 896px) 
    and (-webkit-device-pixel-ratio : 3) {
	body{
		width:100%;
		margin:0px;
		background-image:none;
	
	}
	#main_image img{margin-bottom:20px; margin-top:20px; width:360px;}
	.gallery_demo_unstyled li{width:30px; height:30px;border:0px double #111; margin: 5px 2px; background:#000;}
	.gallery_demo5 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}
	.gallery_demo10 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}

	#gallery_content{
    color:#666;
    margin:auto;
    padding:0px 0px 0px 0px;
    width:360px;
    /*text-align:left;*/
    }
		
}



@media only screen and (max-width: 600px) {
	body{
		width:100%;
		margin:0px;
		background-image:none;
		color:blue;		
	}

/*	
#content{
	color:#666;
	margin:auto;
	padding:0px 20px 30px 20px;
	width:600px;
	text-align:left;
}*/
#content{
	padding:0px 0px 0px 0px;
	width:90%;
	}	
#header { display: block; } 

	.picture{
		text-align: center;
		margin:"auto";
	}
	
h1{
		font-size:medium;
	}
/*cv ja yhteystiedot sivun fontit*/

	h2{
		font-size:medium;
	}
	
	h3{
		font-size:medium;
	}
	h4{
		font-size:medium;
	}

	#navigation{
	padding: 4px 0px 4px 0px;
	min-width: 100%;
	width: 100%;
	font-size: 14px;
	text-align: center;
	}		
	#navigation ul {
	margin: 0;
	padding: 0;
	}
	.gallerytextcontainer, .gallerytextcontainer2 {
    width: 100%;
    height: 100%;
    float: right;
    padding-top: 5px;
    margin: 0;
    }
	.gallerypicturecontainer {
    width: 150px;
	margin:auto;
  	padding: 0px 0px 0px 0px;
    }
	.gallerybody {
    font-size: 16px;
    }
/*		#main_image img{margin-bottom:20px; margin-top:20px; width:360px;}
.gallery_demo5 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}
.gallery_demo_unstyled li{width:30px; height:30px;border:0px double #111; margin: 5px 2px; background:#000;}*/	
    .gallery_demo10 li{width:30px;height:30px;border:0px double #111; margin: 5px 2px;background:#000;}

	
	#gallery_content{
    color:#666;
    margin:0 auto;
    padding:0px 0px 0px 0px;
    width:360px;
    /*text-align:left;*/
    }
}






/*gallerian asetuksia*/
.caption{color:#666;}
	.demo{position:relative;margin-top:2em;}
	
	/* CHANGE THE VALUE HERE UNTIL THE THUMBNAILS ARE CENTERED */
	/* akvarellit */
	.gallery_demo{width:600px;margin:0 auto;}  /*pikkukuvakkeet 400*/
	.gallery_demo li{width:25px;height:25px;border:0px double #111;margin: 2px 2px;background:#000;}
	.gallery_demo li div{left:240px}
	.gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;}
	
	.gallery_demo1{width:300px;margin:0 auto;} /*pikkukuvakkeet 190*/
	.gallery_demo1 li{width:25px;height:25px;border:0px double #111;margin:10px 2px;background:#000;}
	.gallery_demo1 li div{left:240px}
	.gallery_demo1 li div .caption{font:italic 0.7em/1.4 georgia,serif;}
	
	.gallery_demo2{width:250px;margin:0 auto;} 
	.gallery_demo2 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo2 li div{left:240px}
	.gallery_demo2 li div .caption{font:italic 0.7em/1.4 georgia,serif;}
	/* naivistinen */
	
	.gallery_demo3{width:370px;margin:0 auto;}
	.gallery_demo3 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo3 li div{left:240px}
	.gallery_demo3 li div .caption{font:italic 0.7em/1.4 georgia,serif;}
	
	/* akvarellit */
	.gallery_demo4{width:60px;margin:0 auto;}
	.gallery_demo4 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo4 li div{left:240px}
	.gallery_demo4 li div .caption{font:italic 0.7em/1.4 georgia,serif;}
		



	.gallery_demo5{width:100%;margin:0 auto; margin-left:-30px}
	.gallery_demo5 li{width:25px;height:25px;border:0px double #111; margin: 2px 2px;background:#000;}
	.gallery_demo5 li div{left:0px}.caption{font-style:italic; font-size:0.4em/0.8; font-family:georgia, serif;}

	/* latest */
	.gallery_demo10{width:340px;margin:0 auto;}
	.gallery_demo10 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo10 li div{left:240px}
	.gallery_demo10 li div .caption{font:italic 0.7em/1.4 georgia,serif;}

	/*kortit */
	.gallery_demo{width:300px;margin:0 auto;}  /*pikkukuvakkeet 400*/
	.gallery_demo li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo li div{left:240px}
	.gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;}


	.gallery_demo_unstyled{width:100%;margin:10 auto; margin-left:-30px}
	.gallery_demo_unstyled li{width:25px;height:25px;border:0px double #111; margin: 2px 2px;background:#000;}
	.gallery_demo_unstyled li div{left:0px}

	
	/* 3htm */
	.gallery_demo6{width:520px;margin:0 auto;}
	.gallery_demo6 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo6 li div{left:240px}
	.gallery_demo6 li div .caption{font:italic 0.7em/1.4 georgia,serif;}
	
	/* kuvitukset */
	.gallery_demo7{width:200px;margin:0 auto;} /*pikkukuvakkeet*/
	.gallery_demo7 li{width:25px;height:25px;border:0px double #111;margin: 10px 2px;background:#000;}
	.gallery_demo7 li div{left:200px}
	.caption{font-style:italic; font-size:0.4em/0.8; font-family:georgia, serif;}
	


	#main_image{margin:0px 0px 0px 0px; height:auto; width:auto; background:transparent;}
	#main_image img{margin-bottom:10px; margin-top:5px; width:100%;}