/*
Theme Name: Sivututka
Theme URI: http://sivututka.fi
Description: Sivututka theme
Version: 1.0
Author: Sivututka
Author URI: http://sivututka.fi

License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* #Resetit
================================================== */
	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, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block; }
	body {
		line-height: 1; }
	ol, ul {
		list-style: none; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0; }


/* #Perustyylit
================================================== */
	body {
		background: #fff;
		font: 14px/21px;
		color: #555;
		-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
		-webkit-text-size-adjust: 100%;
		font-size:16px;
	}

	header {
		height:80px;
		width:100%;
	}
	
	.headerinfo {
		background:#67b7e1;	
		padding:7px 0;
		color:#fff;
		font-size:13px;
	}
	
	.headerblock
	{
	height:80px;
	background:#fff;
	margin:0;
	padding:0;
	z-index:9999;
	}
	
	.headerinfoteksti { float:left; }
	.headerinfoteksti p { font-size:16px; margin:2px 15px 0 0; font-weight:600; }
	.headeremail, .headerphone { float:left; background:#4795be; padding:7px 10px; line-height:15px; border-radius:15px; }
	.headeremail { margin-right:10px; }
	.headerphone img { float:left; margin:0px 10px 0 0; }
	.headeremail img { float:left; margin: 3px 10px 0 0; }
	.headerfb { float:right; margin-left:10px; }
	.headerfb img { margin:0px; padding:0px; margin-bottom:-5px; }
	.headerfb img:hover { opacity: 0.6; filter: alpha(opacity=60); -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; }
	
	.sticky { position:fixed; top:0px; z-index:9999; width:100%; background:#fff; -webkit-box-shadow: 0px 2px 3px 0px rgba(150, 150, 150, 0.3); -moz-box-shadow: 0px 2px 2px 0px rgba(150, 150, 150, 0.3);box-shadow: 0px 2px 2px 0px rgba(150, 150, 150, 0.3); }
	
	.logo, .valikko { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
	.logo { margin:5px 0 0 0; width:280px; }
	.logo img:hover {  }
	.valikko { width:660px; }
	
	.laatikko { text-align:center; margin-top:60px; background:#fff; border:1px solid #ccc; border-radius:5px; }
	.laatikko h2 { margin-top:50px; margin-bottom:-30px; padding-bottom: 0; color:#555; font-weight:400; }
	.laatikko p { color:#555; margin-bottom:40px; margin-top:0; padding-top:0; }
	
	.laatikko-2 { text-align:center; margin-top:40px; background:#f2f2f2; border:1px solid #ccc; padding:0 10px;}
	.laatikko-2 h2 { margin-top:30px; color:#555; font-size:22px; }
	.laatikko-2 p { color:#555; font-size:16px; margin-bottom:40px; }
	
	.laatikko-3 { -moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4); -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4); box-shadow: 1px 1px 4px rgba(0,0,0,0.4); padding:25px; margin-bottom: 20px; }
	
	.otsikko, .sidebar h3 { background:#67b7e1; padding:5px 10px; color:#fff; margin-bottom:20px; border-left:4px solid #3781a8; }
	
	.huomio { background:#E8E8E8; border-left:5px solid #67b7e1; padding: 20px 20px 1px 20px; text-align:center; margin-bottom:20px; }
	.huomio h2 { color:#4795be; }
	
	.fb-like-box, .fb-like-box span, .fb-like-box span iframe[style] { width: 100% !important; }
	input[type="button" i], input[type="submit" i], input[type="reset" i], input[type="file" i]::-webkit-file-upload-button, button { border:none; }
	input[type="submit" i] { cursor:pointer; }


/* #Typografia
================================================== */
	h1, h2, h3, h4, h5, h6 {
		color: #333;
		font-weight: bold; 
		line-height: 130%;
		}
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; line-height: 130%; }
	h1 { font-size: 26px; margin-bottom: 14px;}
	h2 { font-size: 24px; margin-bottom: 20px; }
	h3 { font-size: 20px; margin-bottom: 8px; }
	h4 { font-size: 18px; margin-bottom: 4px; }
	h5 { font-size: 18px; }
	h6 { font-size: 14px; }
	.subheader { color: #777; }

	p { margin: 0 0 20px 0; line-height: 150%; font-size:16px; }
	p img { margin: 0; }
	p.lead { font-size: 21px; line-height: 27px; color: #777;  }

	em { font-style: italic; }
	strong { font-weight: bold; }
	small { font-size: 80%; }


/*	Blockquote  */
	blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; }
	blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; }
	blockquote cite { display: block; font-size: 12px; color: #555; }
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }

	hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; }


/* #Linkit
================================================== */
	a, a:visited { color: #369bd0; text-decoration: none; outline: 0; }
	a:hover, a:focus { text-decoration:underline; }
	p a, p a:visited { line-height: inherit; }
	a:hover h2 { color:#67b7e1; text-decoration:none; }
	h2 a:hover, h3 a:hover { text-decoration:none; }
	.laatikko a:hover { text-decoration:none; }
	h2 a, h2 a:visited { color:#333; }
	h2 a:hover { color: #369bd0; display:block; }


/* #Listat
================================================== */
	ul, ol { margin-bottom: 20px; }
	ul { list-style: none outside; }
	ol { list-style: decimal; }
	ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
	ul.square { list-style: square outside; }
	ul.circle { list-style: circle outside; }
	ul.disc { list-style: disc outside; }
	ul ul, ul ol,
	ol ol, ol ul { margin: 4px 0 5px 30px; font-size: 90%;  }
	ul ul li, ul ol li,
	ol ol li, ol ul li { margin-bottom: 6px; }
	li { line-height: 24px; margin: 0 0 5px 20px; font-size:16px; list-style-type: square; }
	ol li { list-style-type:decimal; }
	#main li { font-size:20px; }
	ul.large li { line-height: 21px; }
	li p { line-height: 21px; }

/* #Kuvat
================================================== */

	img.scale-with-grid {
		max-width: 100%;
		height: auto; }


/* Valikko 
================================================== */

.nav-bar a {
	font-size:15px;
}

.main-nav ul, .main-nav li {
	display: inline;	
	float:right;
	padding:0px;
	margin:0px;
}

.main-nav a {
	padding: 0 14px;
	text-decoration: none;
	line-height: 80px;
	display:block;
	color:#555;
	font-weight:600;
}

.main-nav a:hover {
	color:#3066be;
}

.main-nav ul ul a {
	width: 135px;
	color:#333;
	line-height: 130%;
	padding: 10px 20px;
	display:block;	
	border-bottom:1px solid #d2d3d3;
}

.main-nav ul ul li {
	margin:0;
	padding:0;	
}

.main-nav ul ul a:hover {
	color:#333;
	box-shadow:none;
	background:#f6f6f6;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;	
}

.main-nav ul li {
	position:relative;
	float:left;	
}

.main-nav ul ul {
	position: absolute;
	top: -999px;
	left:0;
	opacity:0;
	background: #ebebeb;
	text-align:left;
	margin:0;
	z-index:999;
	border-top: 3px solid #67b7e1;
}

.main-nav ul ul ul {
	left:195px;
	margin-top:-39px;
}

.main-nav ul li:hover > ul {
	position: absolute;
	top: 100%;
	opacity: 1;	
}

#show-nav {
	display:none;	
	background:#f4f4f4;
	border:1px solid #dedddd;
	margin-top:10px;
	margin-bottom:10px;
}

#show-nav a, #close-nav a {
	line-height:20px;
	padding:10px 15px;	
}

#close-nav {
	display:none;
	background:#f4f4f4;
	border:1px solid #dedddd;
	margin-top:10px;
	margin-bottom:20px;
}

.menu {
	padding:0px;
	margin:0px;
}

/* #Button
================================================== */

	.button,
	a.button,
	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		background:#54b0e1;
		text-decoration:none;
		font-size:20px;
		padding:20px 35px;
		color:#fff;
	    text-transform:uppercase;
	    font-weight:bold;
		border-radius:2px;
		}

	.button:hover,
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
		background:#219fe1;
		-webkit-transition: all .25s ease;
		-moz-transition: all .25s ease;
		-o-transition: all .25s ease;
		transition: all .25s ease;
		}		 

/* #Lomakkeet
================================================== */

	form {
		margin-bottom: 20px; }
	fieldset {
		margin-bottom: 20px; }
	input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea,
	select {
		border: 1px solid #ccc;
		padding: 6px 4px;
		outline: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		font: 13px;
		color: #777;
		margin: 0;
		width: 100%;
		max-width: 100%;
		display: block;
		margin-bottom: 20px;
		background: #fff; }
	select {
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border: 1px solid #aaa;
 		color: #444;
 		-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
		box-shadow:  0 0 3px rgba(0,0,0,.2); }
	textarea {
		min-height: 60px; }
	label,
	legend {
		display: block;
		font-weight: bold;
		font-size: 13px;  }
	select {
		width: 220px; }
	input[type="checkbox"] {
		display: inline; }
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444; }

/* #Footer
================================================== */
	.footer {
		background:#222;
		color:#CCC;	
		padding: 30px 0;	
		font-size:14px;
	}
	.footerwidget {	padding-right:20px;	}
	.footer p { color:#b6b6b6; margin:10px 0; font-size:14px; }
	.footer h3 { color:#fff; font-size: 17px; font-weight:bold; text-transform:uppercase; }
	.footer a { color:#67b7e1; text-decoration: none; }
	.footer a:hover { text-decoration:underline; }
	.footer ul { width: 95%; display: table; }
	.footer li { display: table-row; }
	.footer li a { color:#b6b6b6; width:100%; display:block; border-bottom:1px solid #070707; border-top:1px solid #3b3b3b; padding:6px 0 6px 6px; font-size:16px; }
	.footer li:nth-child(1) a { border-top:none; }
	.footer li:last-child a { border-bottom:none; }
	.footer li a:hover { background:#f4901e; color:#fff; text-decoration:none; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; }

	
/* #Blogi 
==================================================  */

	.blogimage { width:30%; float:left; }
	.blogdesc { width:70%; float:left; }
	.blogpost { padding:20px 0; border-bottom: 1px solid #ccc; }
	.blogpost img:hover { opacity: 0.8; filter: alpha(opacity=80); -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; }
	.blogdesc a { color:#fff; background:#67b7e1; color:#fff; padding:1px 5px; }
	.blogdesc a:hover { text-decoration:none; background:#4795be; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; }
	.postdate { margin:0 0 10px 0; }
	.post-heading { margin:0 0 10px 0; }
	.singlenav { border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin-bottom:30px; }
	.singlenav p { font-size:14px; margin:5px 0; }
	.singleleftnav { width:50%; float:left; }
	.singlerightnav { width:50%; float:left; text-align:right; }
	.single-image { margin-bottom:20px; }
	.navigation { margin:20px 0; }
	.navigation a { padding:10px 20px; text-decoration:none; }

/* #Pagetitle 
==================================================  */

	.pagetitle { background:#333; color:#fff; padding:30px 0; margin-bottom:20px; }
	.pagetitle h1 { font-size:45px; color:#fff; margin:0; padding:0; line-height:100%;}
	.pagetitle a { color:#67b7e1; }
	.sivunotsikko {  }
	.breadcrumbs { float:left; width:50%; text-align:right; font-size:14px; }
	.breadcrumbs p { margin:2px 0; font-size:14px; }
 
/* self-clear floats */
 
.group:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* #WP Caption ja Gallery & Muut WordPressin suositteleman luokat
================================================== */

.wp-caption
{
  border: 1px solid #ddd;
  background-color: #f3f3f3;
  padding-top: 4px;
  margin: 10px;
}

.wp-caption img
{
  margin: 0;
  padding: 0;
  border: 0 none;
}

.wp-caption p.wp-caption-text
{
  font-size: 11px;
  line-height: 17px;
  padding: 0 4px 5px;
  margin: 0;
}

.wp-caption, .wp-caption p
{
    text-align: center;
}

.gallery {
	margin: 0 auto 18px;
    clear:both;
    overflow:hidden;
}

.gallery .gallery-item {
	float: left;
	margin-top: 0;
	text-align: center;
	width: 33%;
}
.gallery img {
	border: 2px solid #cfcfcf;
}

.gallery .gallery-caption {
	color: #888;
	font-size: 12px;
	margin: 0 0 12px;
}

.gallery img {
	border: 10px solid #f1f1f1;
}

.bypostauthor{}

.aligncenter, div.aligncenter, .art-article .aligncenter img, .aligncenter img.art-article, .aligncenter img, img.aligncenter
{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

p.aligncenter , p.center 
{
   text-align: center; 
}

.alignleft
{
  float: left;
}

.alignright
{
  float: right;
}

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
	max-width: 100%;
	height: auto;
}

/* #Muuta
================================================== */
.remove-bottom { margin-bottom: 0 !important; }
.half-bottom { margin-bottom: 10px !important; }
.add-bottom { margin-bottom: 20px !important; }

.sininen {
	background:#67b7e1;
	padding:30px 0;
	text-align:center;
	color:#fff;
	text-decoration:none;
}
.sininen h3 { color:#fff; margin:0; }
.sininenlinkki:hover { text-decoration:none; }
.sininen:hover {
	background:#4795be;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
	text-decoration:none;
}

.etusivusyyt { border-bottom:0px; }
.etusivusyyt h2 { margin-bottom:50px; }
.syylista {
	width:50%;
	float:left;
	text-align:left;
	padding-left:31px;	
	box-sizing: border-box;
	font-size:21px;
}

.syylista li { margin-bottom:14px; list-style:none;}

.syylista li:before
{
   content:url('images/tahtibullet.png');
   margin-right:6px;
   bottom: 4px;
   position:relative;
   display:inline-block;
   vertical-align:middle;
   font-size:0;
   line-height:0;
   margin-left: -31px;
}
#main > section > div > ul:nth-child(2) { padding-right:15px; }


/* Sidebar
================================================== */

.sidebar li { border-bottom:1px solid #ccc; margin:5px 0; padding:5px 0 5px 25px; list-style-type:none; }
.sidebar li:last-of-type { border-bottom:none; }
.sidebar li:before
{
   content:url('images/arrow2.png');
   margin-right:10px;
   bottom: 2px;
   position:relative;
   display:inline-block;
   vertical-align:middle;
   font-size:0;
   line-height:0;
   margin-left: -20px;
}
.post-date { display:block; }
.blogsidebar { padding-top:30px; }

/* Sivu specific
================================================== */