/*
Theme Name: Suomen Kaapelitarvike Oy
Theme URI: http://pivosis.fi
Author: Jussi Järvenpää
Author URI: http://pivosis.fi
Description: Custom framework by Pivosis.
Version: 1.0
License:
License URI: 
Tags:
*/

/*** Base styles
------------------------------------------------------------------------------------------------------------ */
html {
  height: 100%;
  box-sizing: border-box;
  font-size: 100%;
  -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}
* { /* for slick slider FF fix */
    min-width: 0;
    min-height: 0;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
	position: relative;
	margin: 0;
	min-height: 100%;
	height: 100%;
	font-family: 'Roboto Condensed', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	background: #fff;
	color: #212121;
}
.inner-row.subfooter {
    padding: 1em 0;
}
.subfoot > .inner-row, .mainfoot > .inner-row {
	background: transparent;
}
.inner-row.subfooter p {
    color: #fff;
	font-size: 0.9em;
	text-align: right;
	padding: 0;
}
footer {
	width: 100%;
	min-height: 32px;
	text-align: center;
	background: transparent;
}
.subfoot {
    background: #01009C;
}
.mainfoot {
    background: #eca700;
    margin: 0;
}
footer p {
    font-size: 0.8em;
    padding: 1em 0 0.25em 0;
    line-height: 1em;
    color: #fff;
}
footer a { color:#fff; }
footer a:hover { color:#fff; }

@media only screen and (max-width: 54em) {
	.subfooter > .col.content-1-4, .subfooter > .col.content-1-2 { width: 100%; flex: 1 1 100%; }
	.subfooter > .col.content-1-2 > .content, .subfooter > .col.content-1-4 > .content { margin-top: 0em; }
	.subfooter > .col.content-1-4 p { text-align: center; }
	.subfooter > .col.content-1-2 img { max-width: 400px; margin: 0 auto;display: block; padding: 0; }
	.subfooter > .col.content-1-2 .figure { margin-bottom: 0; }
}

/*** Base grid definitions
------------------------------------------------------------------------------------------------------------ */
.row {}
.inner-row {
	max-width: 1158px;
	background:#fff;
    margin: 0 auto;
	padding: 0;
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.row:after, .inner-row:after {
    content: "";
    clear: both;
    display: table;
}
.entry-title-row > .inner-row {
    padding: 0;
}


@media only screen { 
	.col {
	    float: left;
	    width: 100%;
	    box-sizing: border-box;
	}
}
.page-wrapper {
	margin: 0 auto;
	padding: 0 0 0 0;
	height: 100%;
}
.full-content {
	width: 100%;
	flex-basis: 100%;
}
.content {
	padding: 0.5em 14px;
	overflow: hidden; /* Prevent div collapse when image is floated */
}
@media only screen and (max-width: 54em) {
	.content {
		margin: 1em 0 0 0;	
	}
	.content h5 {
		font-size: 1rem;	
	}
}

/*** GRID MEDIAQUERY SETTINGS
------------------------------------------------------------------------------------------------------------ */
@media only screen and (min-width: 20em) {
	.full-content,
	.content-1-2,
	.content-1-3,
	.content-2-3,
	.content-1-4,
	.content-2-4,
	.content-3-4,
	.content-1-5,
	.content-4-5 {
		width: 100%;
		flex: 1 1 100%;
	}
	footer .inner-row { 
		padding: 0.05em 2em;
	}
}
@media only screen and (min-width: 34em) {
	.content-1-2 {
		width: 50%;
		flex: 1 1 50%;
	}
	.content-1-3 {
		width: 33.33%;
		flex: 1 1 33.33%;
	}
	.tuoteryhma-row .content-1-3 {
		max-width: 33.33%;
		flex: 1 1 33.33%;
	}
	.content-1-4 { 
		width: 47.5%;
		flex: 0 1 47.5%;
	}
}
@media only screen and (min-width: 54em) {
	.tuoteryhma-row .content-1-3 {
		max-width: 33.33%;
		flex: 1 1 33.33%;
	}
	.content-2-3 { 
		width: 66.66%;
		flex: 1 1 66.66%;
	}
	.content-1-4 { 
		width: 25%;
		flex: 1 1 25%;
	}
	.content-1-4 p {
		padding: 0.25em 0.25em;
	}
	.content-2-4 { 
		width: 50%;
		flex: 1 1 50%;
	}
	.content-3-4 { 
		width: 75%;
		flex: 1 1 75%;
	}
	.content-1-5 { 
		width: 20%;
		flex: 1 1 20%;
	}
	.content-4-5 { 
		width: 80%;
		flex: 1 1 80%;
	}
	.inner-row { 
		padding: 0;
	}
}
@media only screen and (min-width: 20em) {
	.content-1-2 img, .content-1-3 img, .content-1-4 img { width: 100%; }
}
@media only screen and (min-width: 32em) {
  .imageRes .content-1-4 img {
    width: 200px;
  }
}
@media only screen and (min-width: 54em) {
  .imageRes .content-1-4 img {
    width: 140px;
  }
}
.fimage {
    margin: -1em -1em 0;
}
@media only screen and (max-width: 54em) {
    .fimage {
	margin: 0;
    }
}


/*** Default style reset f
------------------------------------------------------------------------------------------------------------ */
h1, h2,h3,h4,h5,h5,h6,p,ul,ol,li,pre,code,img,iframe,table,tr,td,a,strong,b {
	padding: 0;
	margin: 0;
}
a {
	color: #01009b;
	text-decoration: none;
	border-bottom: solid 1px;
	font-weight: 700;
}
a:hover {
    color: #10388c;
}
a.button {
    background-color: #6ec3c5;
    color: #fff;
    font-size: 0.925em;
    border: 0 none;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 1.2em 2em;
    line-height: 1em;
    display: table;
}
a.button:hover {
    border: solid 1px #3f3f3f;
    background: transparent;
    color: #000;
    padding: 1.15em 1.95em;
}

h1, h2, h3 {
	font-size: 1.75em;
    line-height: 1.5em;
}
h4, h5, h6 {
    font-size: 1.5em;
	line-height: 1.25em;
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 0em;
	color: #01009b;
	font-weight: 700;
	font-family: 'Roboto Condensed', Helvetica, Arial, sans-serif;
	padding: 0em 0 0.5em 0;
}
h4, h5, h6 {
	margin-bottom:0.75em;
	margin-left: 0;
	padding: 0.4em 0 0.2em 0;
}

p, ul, ol, pre {
	font-size: 1.125em;
    color: rgba(0, 0, 0, .87);
    line-height: 1.75em;
    margin: 0.2em 0 1.1em;
    letter-spacing: 0;
    font-weight: 400;
}
p {
	padding: 0 0.25em 0.1em 0;
}
strong, b {
    font-weight: 700;
    letter-spacing: 0.01em;
}
ul, ol {
	padding: 0.1em 1em 0.25em 1.5em;
}
ul li ul, ol li ol {
    font-size: 0.95em;
}
code, pre {
	font-size: 1.27em;
	color: #555;
	background: #efefef;
}woo
pre {
	white-space: pre-wrap;
	word-wrap: break-word;
	margin: 1.17em;
    padding: 1.27em;
}
blockquote {
    margin: 1.17em;
    border-left: solid 2px #efefef;
    font-style: italic;
    color: #43b190;
    font-size: 1.327em;
	padding: 0.627em 0.627em 0.17em 0.627em;
}
iframe {
	border: 0;
	overflow: hidden;
}
.figure {
    margin-bottom: 1.25em;
}
img {
    max-width: 100%;
    height: auto;
}
input, textarea {
	max-width: 100%;
    width: 100%;
    padding: 0.5em 0.6em;
    font-weight: 400;
    font-size: 0.9em;
    border: solid 1px #c0c0c0;
    border-radius: 3px;
}
textarea {
    height: 130px;
}
input[type="submit"] {
	background: #eca700;
    border: solid 1px #D69D16;
    border-bottom: solid 4px #D69D16;
    color: #ffffff;
    font-size: 1em;
    font-weight: 700;
    cursor: pointer;
    width: 185px;
}
input[type="submit"]:hover {
    background: #01009b;
    border: solid 1px #01009b;
    border-bottom: solid 4px #01009b;
}
/* wordpress related image alignment rules */
.alignright {float:right; margin:0 0 1em 1em}
.alignleft {float:left; margin:0 1em 1em 0}
.aligncenter {display: block; margin-left: auto; margin-right: auto}

.woocommerce-Tabs-panel .alignright {
    border: solid 1px #ddd;
    padding: 0.6em;
	margin-right: 0.75em;
}

img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

img.wide-image { 
    width: 100%;
    margin-bottom: 1.5em;
}
img.img-ikoni { 
    margin-bottom: 30px;
	max-width: 150px;
}

/* Wordpress gallery */
.gallery-item {
    text-align: left!important;
	aliwidth: 33.33%!important;
}
.gallery-caption {
    padding: 0.5em 1em 0.25em 0;
	line-height: 1.4em;
	font-size: 0.9em;
}
dl.gallery-item img {
    width: 95%;
}
dl.gallery-item a {
   border: 0 none;
}
#gallery-1 img { border: 0!important; }



/*** Typography fine details and settings
------------------------------------------------------------------------------------------------------------ */
@media only screen and (min-width: 20em) {
  .full-content h1 {
    font-weight: 700;
    text-align: center;
    color: #fff;
    padding: 0.45em 0.5em;
    font-size: 1.8em;
    line-height: 30px;
  }
}
@media only screen and (min-width: 54em) {
  .full-content h1 {
    padding: 0.75em 3em;
    font-size: 2em;
    line-height: 38px;
  }
}
@media only screen and (max-width: 34em) {
	h1, h2, h3, h4, h5, h6 {
		font-size: 1.35em;
	}
}

/*** Header and Navigation
------------------------------------------------------------------------------------------------------------ */
.row.entry-title-row {
    margin: -2.8em auto 3em;
    max-width: 800px;
    border-bottom: solid 8px #ECA700;
}
.entry-title-row > .inner-row {
    background: #01009b;
}
@media only screen and (max-width: 62em) {
	.row.entry-title-row {
		margin: 0em auto;
		width: 100%;
		max-width:100%;
	}
}
.row.bgimage {
    margin:0;
}

header .row.brand {
	padding: 32px 0 0 0;
    background: #FFF;
    height: 120px;
}
header .row.brand .inner-row {
    padding: 0;
}
#branding {
    padding: 0;
	margin-left: -8px;
}
/* center logo */
.logo img {
    margin: 0;
    display: block;
	width: 345px;
	max-width: 345px!important;
}

span.searchform {
    padding: 10px 0 10px 0;
    float: right;
}
input#s {
    height: 30px;
    max-width: 132px;
}
input#searchsubmit {
    line-height: 9px;
    max-width: 58px;
}

h1.site-title {
    text-align: left;
    font-size: 2.1em;
	padding: 0.05em 1em 0 0.83em;
	font-weight: 700;
	letter-spacing: 0.01em;
}
h1.site-title a {
    color: #fff;
	text-decoration: none;
	border: 0 none;
}

/***  Navigation menu
------------------------------------------------------------------------------------------------------------ */
nav {
	position: relative !important;
	z-index: 9999 !important;
}
nav a { border-bottom: 0 none; }
#cssmenu {
  margin: 0;
  width: auto;
  padding: 0;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;  
}
#cssmenu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: block;
  float: right;
}
#cssmenu ul:after,
#cssmenu:after {
  content: ' ';
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
#cssmenu ul li {
  margin: 0 0 0 20px;
  padding: 0;
  display: block;
  position: relative;
}
#cssmenu ul li a {
	line-height:18px;
  text-decoration: none;
  display: block;
  margin: 0;
  -webkit-transition: color .2s ease;
  -moz-transition: color .2s ease;
  -ms-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-weight: 700;
}
#cssmenu ul li ul {
  position: absolute;
  left: -9999px;
  top: auto;
}
#cssmenu ul li ul li {
  max-height: 0;
  position: absolute;
  -webkit-transition: max-height 0.4s ease-out;
  -moz-transition: max-height 0.4s ease-out;
  -ms-transition: max-height 0.4s ease-out;
  -o-transition: max-height 0.4s ease-out;
  transition: max-height 0.4s ease-out;
  background: #ffffff;
}
#cssmenu ul li ul li.has-sub:after {
  display: block;
  position: absolute;
  content: '';
  height: 10px;
  width: 10px;
  border-radius: 5px;
  background: #000000;
  z-index: 8080;
  top: 15px;
  right: 15px;
}
#cssmenu.align-right ul li ul li.has-sub:after {
  right: auto;
  left: 15px;
}
#cssmenu ul li ul li.has-sub:before {
  display: block;
  position: absolute;
  content: '';
  height: 0;
  width: 0;
  border: 3px solid transparent;
  border-left-color: #ffffff;
  z-index: 9090;
  top: 17px;
  right: 15px;
}
#cssmenu.align-right ul li ul li.has-sub:before {
  right: auto;
  left: 15px;
  border-left-color: transparent;
  border-right-color: #ffffff;
}
#cssmenu ul li ul li a {
  font-size: 1em;
  text-transform: none;
  color: #000000;
  letter-spacing: 0;
  display: block;
  width: 100%;
  padding: 1em 0.75em;
}
#cssmenu ul li ul li:hover > a,
#cssmenu ul li ul li.active > a {
  color: #485961;
}
#cssmenu ul li ul li:hover:after,
#cssmenu ul li ul li.active:after {
  background: #485961;
}
#cssmenu ul li ul li:hover > ul {
  left: 100%;
  top: 0;
}
#cssmenu ul li ul li:hover > ul > li {
  max-height: 72px;
  position: relative;
}
#cssmenu > ul > li {
  float: left;
}
#cssmenu.align-center > ul > li {
  float: none;
  display: inline-block;
}
#cssmenu.align-center > ul {
  text-align: center;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul {
  float: right;
}
#cssmenu.align-right > ul > li:hover > ul {
  left: auto;
  right: 0;
}
#cssmenu.align-right ul ul li:hover > ul {
  right: 100%;
  left: auto;
}
#cssmenu.align-right ul ul li a {
  text-align: right;
}
#cssmenu > ul > li:after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 0;
  top: 0;
  z-index: 7070;
  -webkit-transition: height .3s;
  -moz-transition: height .3s;
  -ms-transition: height .3s;
  -o-transition: height .3s;
  transition: height .3s;
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 20px;
}
#cssmenu > ul > li.has-sub > a:after {
  display: block;
  content: '';
  background: transparent;
  height: 12px;
  width: 12px;
  position: absolute;
  border-radius: 13px;
  right: 2px;
  top: 16px;
}
#cssmenu > ul > li.has-sub > a:before {
  display: block;
  content: '';
  border: 4px solid transparent;
  border-top-color: #14407e;
  z-index: 9090;
  height: 0;
  width: 0;
  position: absolute;
  right: 2px;
  top: 21px;
}
#cssmenu > ul > li > a {
  color: #01009b;
  padding: 14px 0 12px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 1.125em;
  z-index: 9090;
  position: relative;
}
#cssmenu > ul > li:hover:after,
#cssmenu > ul > li.active:after {
  height: 100%;
  border-bottom: solid 4px #eca700;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
  color: #eca700;
}
#cssmenu > ul > li:hover > a:after,
#cssmenu > ul > li.active > a:after {
  background: transparent;
}
#cssmenu > ul > li:hover > a:before,
#cssmenu > ul > li.active > a:before {
  border-top-color: #eca700;
}
#cssmenu > ul > li:hover > ul {
  left: 0;
}
#cssmenu > ul > li:hover > ul > li {
  max-height: 72px;
  position: relative;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu > ul > li > a {
  display: block;
}
#cssmenu > ul > li {
  width: auto;
}
#cssmenu > ul > li > ul {
  width: 100%;
  display: block;
}
#cssmenu > ul > li > ul > li {
    width: 220px;
    display: block;
    text-align: left;
    margin: 0 0 0 0;
}



/*** Navigation menu mediaqueries
------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 54em) {

  /* force main-nav-to-top */
  #main-nav {
    position: absolute;
    top: 0;
    right: 0;
  }
  #cssmenu > ul {
    max-height: 0;
    overflow: hidden;
  }
  #cssmenu ul li {
    float:left;
	clear:both;
	text-align:left;
  }	
  #cssmenu > ul > li > ul {
    width: 100%;
    display: block;
  }
  #cssmenu.align-right ul li a {
    text-align: left;
  }
  #cssmenu > ul > li > ul > li {
    width: 100%;
    display: block;
  }
  #cssmenu.align-right ul ul li a {
    text-align: left;
  }
  #cssmenu > ul > li > ul > li > a {
    width: 100%;
    display: block;
  }
  #cssmenu ul li ul li a {
    width: 100%;
  }
  #cssmenu.align-center > ul {
    text-align: left;
  }
  #cssmenu.align-center > ul > li {
    display: block;
  }
  #cssmenu > ul.open {
    max-height: 1000px;
	background: #ecf2ff;
  }
  #cssmenu ul {
    width: 100%;
  }
  #cssmenu ul > li {
    float: none;
    width: 100%;
  }
  #cssmenu ul li a {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 1rem 1.5rem;
	border-top: solid 1px #dedede;
	font-size: 1em;
  }
  #cssmenu ul > li:after {
    display: none;
  }
  #cssmenu ul li.has-sub > a:after,
  #cssmenu ul li.has-sub > a:before,
  #cssmenu ul li ul li.has-sub:after,
  #cssmenu ul li ul li.has-sub:before {
    display: none;
  }
  #cssmenu ul li ul,
  #cssmenu ul li ul li ul,
  #cssmenu ul li ul li:hover > ul,
  #cssmenu.align-right ul li ul,
  #cssmenu.align-right ul li ul li ul,
  #cssmenu.align-right ul li ul li:hover > ul {
    left: 0;
    position: relative;
    right: auto;
  }
  #cssmenu ul li ul li,
  #cssmenu ul li:hover > ul > li {
    max-height: 999px;
    position: relative;
    background: none;
  }
  #cssmenu ul li ul li a, #cssmenu ul li ul ul li a {
    padding: 0.75rem 0 0.75rem 3.25rem;
    color: #09336c;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0;
    font-size: 0.8em;
  }
  #cssmenu ul li ul li:hover > a, #cssmenu ul li ul ul li:hover > a {
    color: #000;
  }
  #cssmenu #menu-button {
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 1em 2.9em 0.823em 2em;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: #fff;
    cursor: pointer;
	background: #000;
	height:48px;
  }
  #cssmenu #menu-button:after {
	display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 24px;
    border-bottom: 3px solid #555;
    right: 20px;
    top: 15px;
  }
  #cssmenu #menu-button:before {
    display: block;
    content: '';
    position: absolute;
    height: 10px;
    width: 24px;
    border-top: 3px solid #555;
    border-bottom: 3px solid #555;
    right: 20px;
    top: 22px;
  }
}


/* NAVIGATION CENTERING ADDITION */
nav {
  text-align: right;
  /* If there is risk the container is narrower than the element inside */
  white-space: nowrap;
}
nav:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em; /* Adjusts for spacing, a bit junky -> set font to 0 and adjustin font inside nav container could be better  */
}
#cssmenu {
  display: inline-block;
  vertical-align: middle;
}
@media only screen and (max-width: 54em) {
  #cssmenu {
    display: block;
	width:100%;
	margin-top: -4px;
  }
  #cssmenu #menu-button {
    display: inline-block;
    float: right;
	width: 48px;
	padding: 0 0 0 0;
	margin-right: 8px;
    border: solid 1px #606060;
    border-radius: 3px;
    background: #fff;
  }
  #cssmenu ul > li {
    float: none;
    display: block;
  }
  #cssmenu > ul.open {
    margin-top: 16px;
  }
  .logo img {
    position: absolute;
    z-index: 99999;
    top: 7px;
    left: 12px;
  }
}
@media only screen and (min-width: 54em) and (max-width: 1240px) {
  .row.entry-title-row {
    margin-top: 0;
  }
  .row.bgimage {
    margin-top: 0;
  }
}
@media only screen and (min-width: 54em) and (max-width: 1140px) {
  #cssmenu > ul > li > a {
    padding: 14px 0 12px;
    font-size: 0.9rem;
  }
}

/* NAVIGATION FLOAT ON WEB */
header.topheader {
    /*position: fixed;
    top: 0;
    left: 0;*/
    /*width: 1240px;*/
    z-index: 999999;
	margin: 0 auto;
}
/* NAVIGATION FLOAT ALONG ON MOBILE */
@media only screen and (max-width: 54em) {
	.topheader { 
	   position: fixed;
	   z-index: 9999;
 	   top: 0;
 	   left: 0;
 	   width: 100%;
	}
	.logo img {
    	max-width: 220px!important;
	}
	header .row.brand {
		background: rgba(255, 255, 255, 1.0);
		height: 60px;
		-webkit-box-shadow: 0px 4px 20px 3px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 4px 20px 3px rgba(0,0,0,0.25);
		box-shadow: 0px 4px 20px 3px rgba(0,0,0,0.25);
	}
	#cssmenu {
		margin-top: -11px; /* duplikaatti */
	}
	#cssmenu #menu-button { /* duplikaatti */
		margin: -2px 8px 0 0;
		border: 0 none; /* duplikaatti */
		background: transparent;
	}
	#cssmenu > ul.open {
	    margin-top: 6px;
	}
	#cssmenu #menu-button:before {
		top: 21px;
	}
	#cssmenu #menu-button:after {
		top: 14px;
	}
	ul#menu-valikko {
    		box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 8px;
	}
}


.widget {
    margin-bottom: 2em;
}

/* Sidebar.php Footer area widgets */
#sidebar-footer .widget {
    width: 100%;
    float: left;
}

/* WOOCOMMERCE STYLES */
.wc-row {
    border-top: solid 1px #ddd;
    padding-top: 1.5em;
}
.row.wc-row > .inner-row > .content-3-4 > .content {
    padding: 0.5em 28px 0.5em 10px;
}
@media only screen and (max-width: 54em) {
	.row.wc-row > .inner-row > .content-3-4 > .content {
		    padding: 2em 6px 0.5em 22px;
	}	
}
@media only screen and (max-width: 32em) {
	.row.wc-row > .inner-row > .content-3-4 > .content {
		    padding: 2.5em 14px 0.75em;
	}	
}


nav.woocommerce-MyAccount-navigation {
    width: 100%;
    border: solid 1px #c8c8c8;
    display: inline-block;
    line-height: 0;
	margin: 0 0 0.75em 0;
	background: #f9f9f9;
	z-index: 999!important;
}
nav.woocommerce-MyAccount-navigation ul {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
li.woocommerce-MyAccount-navigation-link {
    float: left;
    list-style: none;
    padding: 10px 20px;
    clear: right;
}
li.woocommerce-MyAccount-navigation-link.is-active {
    background: #fff;
    text-transform: uppercase;
    text-decoration: underline;
}
p.woocommerce-result-count {
    display: none;
}
form.woocommerce-ordering {
    display: none;
}
.woocommerce h1.page-title {
    margin-bottom: 0.75em;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
    padding: 1em 1em 1em 3.5em;
    margin: 0 1em 2em 0em;
    color: #1d1d1d;
    border-top: 3px solid #5d5d5d;
}
/* general info color */
.woocommerce-info {
    border: solid 1px #c8c8c8;
}
/* added to cart */
.woocommerce-message {
    border-top-color: #e67a1a;
}
/* disabled style */
.woocommerce #respond input#submit.alt.disabled, .woocommerce #respond input#submit.alt.disabled:hover, .woocommerce #respond input#submit.alt:disabled, .woocommerce #respond input#submit.alt:disabled:hover, .woocommerce #respond input#submit.alt:disabled[disabled], .woocommerce #respond input#submit.alt:disabled[disabled]:hover, .woocommerce a.button.alt.disabled, .woocommerce a.button.alt.disabled:hover, .woocommerce a.button.alt:disabled, .woocommerce a.button.alt:disabled:hover, .woocommerce a.button.alt:disabled[disabled], .woocommerce a.button.alt:disabled[disabled]:hover, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover, .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled:hover, .woocommerce button.button.alt:disabled[disabled], .woocommerce button.button.alt:disabled[disabled]:hover, .woocommerce input.button.alt.disabled, .woocommerce input.button.alt.disabled:hover, .woocommerce input.button.alt:disabled, .woocommerce input.button.alt:disabled:hover, .woocommerce input.button.alt:disabled[disabled], .woocommerce input.button.alt:disabled[disabled]:hover {
    background-color: #9a9a9a;
    color: #fff;
    border: 0 none;
    height: 50px;
}
.woocommerce-variation-price {
    margin-bottom: 1.5em;
}
.woocommerce div.product div.summary {
    margin-bottom: 0.25em;
}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
    background-color: #eca700;
    text-decoration: none;
    background-image: none;
    color: #fff;
	padding: 1em 1em;
	border: solid 1px #c59318;
}
.woocommerce-message::before {
    content: '\e015';
    color: #e67a1a;
}
.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover {
    background-color: #01009b;
    text-decoration: none;
    background-image: none;
    color: #fff;
	border: solid 1px #01009b;
}
.woocommerce fieldset {
    border: solid 1px #c8c8c8;
    margin: 1.5em 0 1.5em 0;
}
.woocommerce input[type="submit"] {
    width: 100%;
}

.woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
    width: 49%;
    padding-right: 1em;
    margin-top: -0.5em;
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    margin: 0 0 0 0;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: #1956d7;
    font-size: 1.5em;
    background: #fdfdfd;
    border: solid 1px #ededed;
    padding: 0.5em 1em;
    margin-top: 1em;
}
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
    background-color: #1956d7;
    border: solid 1px #315dbb;
    color: #fff;
    -webkit-font-smoothing: antialiased;
}
.woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover {
    background-color: #000000;
    color: #fff;
}
.woocommerce input.button:disabled, .woocommerce input.button:disabled[disabled] {
    color: #616161;
}
.woocommerce form .form-row .input-checkbox {
    display: inline;
    margin: -2px 6px 0 0;
    text-align: center;
    vertical-align: middle;
    height: 40px;
    width: 20px;
}
input#ship-to-different-address-checkbox {
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
    font-size: 1em;
    border-radius: 3px;
    background-color: #ffffff;
    color: #1d1d1d;
}
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
    border: 1em solid #ffffff;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}
.woocommerce .quantity .qty {
    width: 4em;
    text-align: left;
    height: 3.48em;
    margin-right: 0.5em;
    border-radius: 3px;
}

.woocommerce .products ul, .woocommerce ul.products {
    margin: -0.75em 0 0 0;
}
.woocommerce ul.products li.product .button {
    margin-top: 1em;
    width: 100%;
    letter-spacing: 0.01em;
    font-size: 0.8em;
    text-align: center;
}
.product_meta {
    display: none;
}
section.related.products h2 {
    margin-bottom: 1em;
}
@media only screen and (max-width: 54em) {
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		margin: 0 2% 0.5em 0!important;
		width: 48%!important;
	}
}
@media only screen and (max-width: 34em) {
	.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
		width: 100%!important;
		margin:0 0 2em 0!important;
	}
}
@media only screen and (max-width: 768px) {
  .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, 
  .woocommerce-page div.product div.summary {
    width: 100%;
    padding-right: 1em;
    margin-top: -0.5em;
  }

}
.woocommerce table.shop_table {
    border-radius: 3px;
    font-size: 1em;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 {
    line-height: 1.2em;
}
.woocommerce ul.products li.product a img {
    border: solid 1px #d1d1e0;
    border-radius: 3px;
}

#wc-sidebar {
    background: #01009b;
    margin: 0;
    padding: 0.75em;
    border: solid 1px #0c0b61;
    border-radius: 0px;
	color: #fff;
	margin-bottom: 2em;
}
#wc-sidebar a, #wc-sidebar span.product-title  {
	color: #eca700;
	font-size: 0.85em;
}
.woocommerce div.product div.images .flex-control-thumbs {
    margin-top: 10px;
}
#wc-sidebar span.count {
	color: #fff;
	font-size:0.75em;
}
#wc-sidebar li {
	color: #fff;
}
ul.children {
    padding: 0px 0 0 15px;
    margin: 0;
}
#wc-sidebar .woocommerce .widget_shopping_cart .total, #wc-sidebar .woocommerce.widget_shopping_cart .total {
    color: #fff;
}
#wc-sidebar p.buttons a {
    color: #fff;
	padding: 0.6em 0.75em;
}
.widget_shopping_cart {
    border-bottom: solid 1px #5f5fb3;
}
@media only screen and (max-width: 54em) {
	#wc-sidebar {
		margin: 0 0 0 0;
		border:0 none;
	}
	#wc-sidebar.content-1-4 { 
		width: 100%;
		flex: 1 1 100%;
	}
}

mark.count {
    background-color: transparent;
}

.widget.woocommerce {
    border-top: solid 1px #5f5fb3;
    margin-bottom: 1em;
    padding-top: 0.75em;
}
#wc-sidebar h3.widget-title {
    font-size: 1.25em;
	padding-bottom: 0.1em;
	color: #fff;
}
.woocommerce .widget_shopping_cart .buttons a, .woocommerce.widget_shopping_cart .buttons a {
    width: 100%;
    font-size: 0.9em;
}
.woocommerce ul.cart_list li, .woocommerce ul.product_list_widget li {
    padding: 0.06em 0 0.75em 0;
}
.woocommerce ul.cart_list li a, .woocommerce ul.product_list_widget li a {
    display: block;
    font-weight: 700;
    line-height: 1.25em;
    border: 0 none;
    margin-bottom: 0.1em;
}

.woocommerce.columns-4 {
    padding: 0em 0.5em;
}


/* KUVAGALLERIA */
span.kuvateksti {
    position: absolute;
	color: transparent;
	background: rgba(0, 0, 0, 0.0);
	transition: all 0.3s ease-in-out;
	padding: 0.75em 1em;
	width: 100%;
	bottom: 0;
}
.grid-item {
	cursor:pointer;
    padding: 10px 5px 0 5px;
    overflow: hidden;
}
.grid-item-content {
	position:relative;
}
.grid-item > .grid-item-content > a.gallery > img {
	transition: all 0.5s ease-in-out;
}
.grid-item:hover > .grid-item-content > a.gallery > img {
	-webkit-filter: grayscale(1);
	filter: grayscale(1);
}
.grid-item:hover > .grid-item-content > span.kuvateksti {
    bottom: 0;
	background: rgba(0, 0, 0, 0.8);
	color: #fff;
}

/*** Helpers, plugin related and ACF setting related styles 
------------------------------------------------------------------------------------------------------------ */
/* front page custom area */
#custom-2 p {
    padding-top: 1.5em;
}
/* images for front page */
img.kumppani {
    max-width: 185px;
}
/* contact-page-logo */
img.yhteyslogo {
    margin-left: -22px;
}
@media only screen and (max-width: 34em) {
	img.kumppani {
    	max-width: 160px;
	}
}
img.ikoni {
	width: 60px;
    margin: 0 0 -25px 14px;
}

ul.kuvagalleria {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    display: inline-block;
    line-height: 0;
    font-size: 0;
}
ul.kuvagalleria li {
    float: left;
    padding: 0 21px 0 0;
}
ul.kuvagalleria li:last-child {
    padding-right: 0;
}
ul.kuvagalleria li a {
    border-bottom: 0 none;
}
ul.kuvagalleria li a img {
    width: 176px;
    max-width: 100%;
    margin: 10px 0 4px 0;
    border: solid 1px #e0e0e0;
}
ul.kuvagalleria li:nth-child(4), ul.kuvagalleria li:nth-child(8), ul.kuvagalleria li:nth-child(12) {
    padding: 0;
}
@media only screen and (max-width: 32em) {
    ul.kuvagalleria li a img {
    width: 166px;
    }
}

	.embed-container { 
		position: relative; 
		padding-bottom: 56.25%;
		height: 0;
		overflow: hidden;
		max-width: 98.5%;
		height: auto;
		margin: 1em 1em 1em 1em;
	} 

	.embed-container iframe,
	.embed-container object,
	.embed-container embed { 
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
.content-2-3 .embed-container {
    margin: 0 0 1.25em 0;
}

.reset-pad { padding:0 0 0 0!important ; }
.reset-mar { margin: 0 0 0 0!important ; }
.reset-all { padding: 0 0 0 0!important ; margin: 0 0 0 0!important ; }

.pos-relative { position:relative; } /* used to display WP-content on top of background image, if background image is used on page top area */


/*Contact form 7 */
div.wpcf7 {
    padding: 0 0 1em;
}
/* Contact form 7 messages */
div.wpcf7-response-output {
    margin: 0.5em 0;
}
span.wpcf7-not-valid-tip {
    font-size: 0.8em;
}
div.wpcf7-validation-errors, div.wpcf7-mail-sent-ok {
    /*width: 100%;*/
    margin: 0;
    padding: 0.5em 1em;
}
div.wpcf7-validation-errors {
    border: 2px solid #eca700;
	background: #fff;
}
div.wpcf7-mail-sent-ok {
    border: 2px solid #8bceca;
	background: #fff;
}
.center { margin:0 auto; }

table {
    font-size: 11px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 100%;
}
tr {
    background: #ececec;
}
td {
    padding: 5px;
}


/* Slick slider styles for dias */
.inner-row.diaslider {
    padding: 0 14px 30px;
    margin: 0 auto;
}
.slider {
    max-height: 400px;
	height: 400px!important;
}
.slick-next, .slick-prev {
    transform: scale(2)!important;
}
.slick-next {
    right: -50px!important;
}
.slick-prev {
    left: -50px!important;
}
.diatext {
    position: absolute;
    text-align: center;
    left: 0;
    bottom: 0;
    right: 0;
    margin: 0 auto;
    background: rgba(0, 0, 0, 0.45);
}
.diatext h2, .diatext p {
    color: #fff;
}
.diatext h2 {
	padding: 0.5em 1em 0.5em 1em;
	font-size:1.5em;
	text-decoration: underline;
}
.diatext p {
	padding: 0em;
    line-height: 0.9em;
}
.slick-dots {
    bottom: -30px!important;
}
.slick-dots li button {
    background: rgb(236, 167, 0)!important;
    border-radius: 100px!important;
}
.slick-dots li.slick-active button:before {
    opacity: .9!important;
    color: #202020!important;
}
.slick-dots li button:before {
    opacity: .9!important;
    color: #fff!important;

}
@media only screen and (max-width: 67em) {
	.slick-next {
    	    right: 30px!important;
	}
	.slick-prev {
    	    left: 30px!important;
	    z-index: 9999;
	}
	.diatext h2 {
	    font-size: 2.5em;
	}
}
@media only screen and (max-width: 54em) {
	.slider {
		max-height:320px;
		height:320px;
	}
	.slick-prev, .slick-next {
		top: 40%!important;
	}
	.slick-next {
    	    right: 20px!important;
	}
	.slick-prev {
    	    left: 20px!important;
	    z-index: 9999;
	}
	.diatext {
	    top: auto;
	    bottom: 0;
	}
	.diatext h2 {
	    padding: 0.75em 1em 0 1em;
	    font-size: 1.5em;
	}
}
@media only screen and (max-width: 34em) {
  .diatext p {
	font-size:0.8em;
        padding: 0.4em 1em;
  }
}


/* slick dia image */
.show_dimg {
    position: relative;
    z-index: 999;
}
img.img_dimg {
    max-width: 340px;
    position: absolute;
    left: 40px;;
}
@media only screen and (max-width: 54em) {
  img.img_dimg {
    max-width: 200px;
    left: 14px;
  }
}
@media only screen and (max-width: 34em) {
  img.img_dimg {
    visibility:hidden;
  }
  img.wp-image-766.alignleft {
    max-width: 160px;
  }
}

td {
    font-size: 1.4em;
}