html, body {
 /*font-family: 'Alegreya Sans', sans-serif;*/
 font-family: Roboto, Muli; 
 font-size: 13px;
 padding: 0;
 margin: 0;
 border: 0;
 width: 100%;
 min-width: fit-content;
 /*min-height: 100%;*/
}

h1,h2,h3,h4 {
  font-family: Roboto, Muli;
}
h1 {font-size:26px;}

.uppercase {text-transform: uppercase;}
.strong {font-weight:bold;}

/* https://www.w3schools.com/html/html_responsive.asp */

* {
  box-sizing: border-box; /* universal box-sizing */
}
a, a:visited, a:hover, a:active { 
 color:inherit; 
 text-decoration: none;
}
.link a { color: DarkSlateBlue; opacity:0.9 }
.link a:hover { text-decoration: underline; opacity:1 }

ul {padding-left: 2px;}
li {list-style-type: none;}

/* inputs */
input[type=text], input[type=password], input[type=email], select, option {min-height: 32px; zoom: 1.2; width:100%; max-width: 260px;}
input[type=radio], input[type=checkbox] {height: 22px;width: 22px;}

.inputlist li {
 margin: 8px;	
}
.ace li {
 display:flex;
 flex-wrap: wrap;
 border-bottom:1px solid lightgrey;
}
.ace input {
 border:none;
 background:none;
}
.ace label {
 /*display:inline-block;*/
 flex:1;
 /*min-width:130px;*/
}
.ace span {
 flex:1;
 padding: 8px;
}
.ace span:first-child{
 flex:1;
 max-width: 150px;	
}


/* site main layout */
.main-row {
 display: flex;	
}
.main-left {  
 flex: 30%; /*32%;*/
 padding: 6px;
}
.main-content { 
 flex: 70%; /*68%*/
 padding: 6px;
 padding-left: 20px;
/* border: 1px dashed grey; */
 min-height: 360px;
 font-size: 13px;
}
.main-right {  
 flex: 30%; /*32%*/
 padding: 6px;
}

/* Mega menu */
#megamenu {
 border-bottom:1px solid grey;
 margin-bottom: 0;
}
#megamenu ul, #megamenu li, #megamenu div{
 display: inline-block;
 padding-left: 6px;
}
*
#firstlevel {
 font-size:13px;
}

#megamenu div.has-sub ~ ul {
 display: none;
}

#menudiv a {
 text-decoration: none;	
}
#menudiv li div {
 padding: 3px 6px;
 /*margin: 2px 5px;*/
}

#megamenu li div:hover {
 font-weight: bold;
 border-bottom:2px solid orange;
}


#submenu {
  position: absolute;
  /*top:0px;*/
  width:100%;
  min-height: 0;
  max-height: 580px;
  margin:0;
  padding:0;/* padding-bottom:0;*/
  /*border-bottom:2px solid CadetBlue; /* #888 */
  /*border-bottom:1px solid grey;*/
  overflow: auto;
  background: #fff; /*#ffedcc;*/
  z-index: 5;
  
}
#submenu ul {
  list-style-type: none;
  display: inline-block;
  padding:0 2px;
  vertical-align: top;
}

#submenu ul.level-2 {
 padding-left: 2px;
 max-width:320px;
 margin-right:10px;
}

#submenu li {
  display: inline-block;
  vertical-align: top;
}
#submenu li.level-2 {
 margin: 1px 10px 8px 10px;
}

#submenu li.level-2 div {
  font-weight: bold;
}
#submenu li.level-3 div {
  font-weight: normal;
}
#submenu li div:hover {
 text-decoration: underline;
}
/*#submenu #cat-135 ul li {
 display: block;
}*/

#parent_title_html {
 padding: 22px 2px 2px 20px;
 font-size: 16px !important;
 font-weight:bold;
 opacity: 0.7; 
}
#parent_title_html:hover {
 opacity: 1;
}
#ctree li {
 padding-left:22px;
 padding-bottom: 6px;	
 font-size: 13px;
}
#submenu a:hover, #ctree a:hover{
 font-weight: bold;
}
/*
#subcategorytree li.level-2, #subcategorytree li.level-1.parent- div{
 display:none;
}*/


.breadcrumb {
 width:100%; padding:8px 4px 4px 8px; color: #555; text-transform:uppercase; font-weight:bold; 	
}
.breadcrumb a {margin:5px;opacity:0.8;}
.breadcrumb a:hover {opacity:1;}
.section_news_top {
 background:#FFFF99;
 font-size:12px;
 text-align:center;
 color:brown;
 padding:6px;
 border-top:2px solid orange;
 border-bottom:2px solid orange;
}
.topsection {background: CadetBlue;height: 88px;}

img.respon {
  width: 100%;
  height: auto;
}

.responlogo {
 width: 100%;
 min-width: 200px;
 /*max-width: 340px;*/
 max-width: 300px;
 height: auto;
 margin-right:10px;
 margin-top:2px;
}
.flex-container {
 display: flex;
 flex-wrap: wrap;
 background: CadetBlue;
 color: white;
 min-height: 88px;
 vertical-align:middle;
}
.flex-container a {
 color: white;
 text-decoration: none;
}

.flex-child:first-child {
 text-align: left;
 margin-left:8px;
}
.flex-child {
 flex: 1;
 height: 80px;
 line-height: 80px;
 vertical-align:middle;
 text-align: center;
}
/* 
.flex-child:last-child {
 text-align: right;
 margin-right:8px;
} */
.flex-child a, .flex-child span{
 vertical-align:middle;
} 
.flex-child input{
 align: center;
 width:100%;height:32px;font-size:16px;border:none;
} 
.flex-child.topcart {
 text-align: right;
 margin-right:8px;
 min-width:150px;
}
.flex-child.topsearch {
 order:0;
}
.flex-child.topsearch input {width:100%;height:32px;font-size:16px;border:none;}
#menutoggle {display:none;}
#topsearch, #menudiv { display:block;}

#topsearch {position: relative;}
#topsearch input {
 width: 100%;
 box-sizing: border-box;
 border: 2px solid #ccc;
 border-radius: 4px;
 font-size: 16px;
 background-color: white;
 /*background-image: url('https://imuritarvike.fi/frame/it/img/search-icon20.png');*/
 background-image: url('/frame/it/img/search-icon20.png');
 background-position: 6px 6px; 
 background-repeat: no-repeat;
 padding: 12px 20px 12px 40px;
}

/* searchpanel */
	.searchpanel {
	  color:#888;
	  font-size:13px;
	  /* min-height: 80px;  Specify a height */
	  /* width: 0;  0 change this with JavaScript */
	  width: 100%;
	  position: absolute; /* Stay in place */
	  z-index: 9; /* Stay on top */
	  top: 44px;
	  
	  /*right: 0;*/
	  background-color: #fff;
	  border: 1px solid grey;
	  /*margin:1px;
	  padding:1px;*/
	  line-height: normal;
	  /*overflow: hidden;  Disable scroll */
	  padding: 6px;
	  transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
	  align:left !important;
	  text-align:left !important;
	  vertical-align:top !important;
	  overflow-y: auto;
	  min-height: 80px;
	  max-height: 440px;
	}
	.searchpanel a{
		color: #0033cc; /*#0f3e3e;#145252;*/
		opacity:0.8;
	}
	.searchpanel a:hover{
		opacity:1;		
	}
	/*.searchpanel li:hover{background-color:lightyellow;}*/
	.searchpanel h3{
		/*height:18px;*/
		margin:12px 4px 2px 4px;
		/*padding-top: 5px;
		padding-bottom: 1px;*/

	  /* text-align:left !important;*/
	}
	.searchpanel li{
		padding: 6px 8px;
		border-bottom:1px solid #ededed;
	}
	
	
	
	
/* Slideshow */	
.set-slides {display: none;}

/* Slideshow container */
.slideshow-cont {
 max-width: 420px;
 position: relative;
 margin: auto;
 height: 400px;
}

.slideshow-cont img {vertical-align: middle;}

/* Caption text */
.slide-text {
 color: grey;
 font-size: 15px;
 padding: 8px 12px;
 position: absolute;
 bottom: 8px;
 width: 100%;
 text-align: center;
}
.slide-text a {
 color: #333333;
}
.slide-text a:hover {
 text-decoration: underline;	
}
.home-text {
 color: grey;
 font-size: 13px;
 padding: 8px 12px;
 width: 100%;
 text-align: center;
}
.home-text a {
 color: #333333;
}
.home-text a:hover {
 text-decoration: underline;
}

/* Number
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}
*/
/* The dots/bullets/indicators */
.slide-dot {
  height: 16px;
  width: 16px;
  margin: 0 4px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
  cursor: pointer;
}

.slide-active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* Finder */
ul.finder-ul-values {}
li.finder-values-parent h3{
 padding: 0px;
 margin: 0px;
 padding-top: 18px;
 padding-bottom: 4px;
}
.finder_selector_select, .finder_selector_select_last {
 margin:4px;
}
.finder-selected {
 -moz-box-shadow: 4px 4px 4px rgba(60, 179, 113, 0.7);
 -webkit-box-shadow: 4px 4px 4px rgba(60, 179, 113, 0.7);
 box-shadow: 4px 4px 4px rgba(60, 179, 113, 0.7);
 border:2px solid Tomato;
 color: #000;
}
.finder-searching {
 border:1px solid Grey;
 color: #777;
 opacity: 0.8;
}
div.finder-description-div {
 margin: 4px;
 padding: 8px;	
}
div.finder-not-found {
 border:1px solid #ccc;
 background: Lightyellow;
 color: #444;
}

/* slide show */
#slideshow {
 position:relative;
 height:410px;
 width: 100%;
}

#slideshow DIV {
position:absolute;
top:0;
left:0;
z-index:1;
opacity:0.0;
height: 410px;
width: 100%;
background-color: #FFF;
text-align:center;
color: #4d4d4d;
padding:0;
max-height: 410px;
}
#slideshow DIV H3 {
color: grey;
padding-left: 5px;
text-align:center;
}

#slideshow DIV.active {
    z-index:3;
    opacity:1.0;
	display:block;/**/
}

#slideshow DIV.last-active {
    z-index:2;
	display:none;/**/
}

#slideshow DIV IMG {
    height: 340px;
    display: block;
    margin-bottom: 2px;
	margin:auto;
}
#slideshow DIV IMG.size200 {
    width:200px;
	height:131px;
    display: block;
    margin-bottom: 2px;
	margin:auto;
}

/* PRODUCT GRID */
.product-grid {
 display: flex;
 flex-wrap: wrap; 
 align-items: center;
}
.product-grid-pic {
 flex: 38%;
 min-width: 248px;	
 white-space: nowrap;
 padding-left: 12px;
 margin: 1em 0;
}
.product-grid-pic img {
 vertical-align: middle;
 max-width: 248px;
 /*max-height: 248px;*/
}
.product-grid-descr {
 flex: 62%;	
 min-width: 260px;
}
.product-grid-end {
 border-bottom: 2px solid lightgrey;
 width: 100%;
 margin-top: 18px;
 margin-bottom: 28px;
}

/* PRODUCT DETAILS */
.prod-details {
 display: flex;
 flex-wrap: wrap; 
}
.img-container {
 flex: 60%;
 min-width: 260px;
}
.prod-price {
 flex: 40%;	
 min-width: 248px;
}
.grid-price li{
 margin-top:8px;
}
.price {
 color: #555;
 font-weight: bold;
 font-size:24px; 
}
.prod-price .price {
 font-size:32px; 
}
.regural-price {
 font-size:20px;
 text-decoration:line-through;
 color: #888;
 /*font-weight: bold;*/
}
.special-price {
 color: #ff3300;
}
.savings {
 padding-top: 8px;
 color: #555;
}
.savings span {
 padding: 4px;
 background: #ffdb4d;
 /*background: #ffe066;
 background: #ffce0e;*/
}

li.list-group-prices {
 padding: 3px;	
}

li.list-group-prices div:before {
 color:green;
 font-family: FontAwesome;
/* content: "\f00c"; */
 content: "\f058"; 
 padding-right: 4px;	
}

 
/* Style the tab */
.tab {
 width: 100%;
 overflow: hidden;
  height: 40px;
}


/* Style the buttons that are used to open the tab content */
.tab button {
  /*background-color: inherit;*/
  background-color: #fafafa;
  float: left;
  /*border: none;*/
  border: 1px solid #ccc;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  /*transition: 0.3s;*/
  display:inline;
  height: 40px;
  color:#888;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #f1f1f1;
  color:#222;
}

/* Create an active/current tablink class */
.tab button.active_tab {
  background-color: #fff; /*#ccc;*/
  border-bottom: none;
  color:#444;
  font-weight: bold
}

/* Style the tab content */
.tabcontent {
  width: 98%;
  display: none;
  padding: 24px 12px;
  border: none; /*1px solid #ccc;*/
  border-top: none;
}
.tab-attribute-rows td {
 padding: 2px 6px;
}
.tab-attribute-rows td:first-child {
 font-weight:bold;
}
.tab-attribute-row-textarea td:first-child {
 vertical-align:top;
}


/* MOBILE */
/* MOVED TO BOTTOM
@media only screen and (max-width:680px) {
	

 #topsearch , #menudiv {display:none;}
 .main-row {flex-direction: column;}
 .main-left, .main-content {flex: 100%;padding:4px;}
 .main-left div {width: 100%;}
 .flex-container {height:48px !important;}
 .flex-child {height:48px !important;line-height: 48px;}

 #topsearch-mobile {display:block;text-align:center;height:32px !important;}
 #topsearch-mobile input{width:80% !important;margin: 3px;}
 #menutoggle {display:block;}
 .responlogo{margin-right: 2px;}
 #tocheckout{display:none;}
 #catstree{display:none;} 
 #slideshow {height:240px;}
 #slideshow DIV {height: 240px;}
 #slideshow DIV IMG {height: 190px;}
 #slideshow DIV H3 {font-size:11px;}
 
}

@media only screen and (min-width:680px) {	
 #menuPanel {display:none;}
}
*/















/* OLD STYLES CHECK */
/* Menu */

/*toggle*/
.toggle-menu {

float: left;
display: block;
width:32%; /* 38px */
/*height: 100%;
margin-top: 26px;*/
margin-left: 1%;
margin-right: 1%;
height: 32px;
border-right: none;
/*background-color: #96962E;*/
background: #b3714d;
background-repeat: no-repeat;
background-position: 94% 10%;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAE1JREFUeNpi/P//PwOtARMDHQBdLGFBYt+nkR2KjEhxQqvIYaR7cD2glSWMo0mY3DiJo5Edi4ZPEqZ7nMSP5pPRon60qB9NwpQDgAADAMIxHUJvWs/TAAAAAElFTkSuQmCC);
background-size: 20px 20px;
	}
/*.toggle-menu.actived {
background-color: #b3714d;
}*/

/* Toplinks */
.it-toplinks ul {
list-style-type: none;
margin:0;
padding:0;
overflow: hidden;
}
.it-toplinks ul li{
float: left;
display: inline;
/* padding-left:1px; 
border-right:1px solid white;*/
}

.it-toplinks a:link, .it--toplinks a:visited {
display: block;
font-weight: normal;
color: #FFFFFF;
/*background-color: #b3714d;*/
background-color: #B8734C; /* #92775C */
text-align: center;
padding: 9px;
text-decoration: none;
text-transform: uppercase;
border-right:1px solid white;
}
.it-toplinks a:hover {
background-color: #DB875E;
}
.it-toplinks ul li a:active {
background-color:#DB875E;
}



/* ---------------------------------------
  Product details page image gallery
 ----------------------------------------- */
/* Position the image container (needed to position the left and right arrows) */
.img-container {
  position: relative;
  display:inline-block;
}

/* Hide the images by default */
.img-slides {
  display: none;
	height: 500px;
 	max-width: 500px;
	/*border: 1px solid grey; */
}
.img-container img{
	max-height: 100%;
	max-width: 100%;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

/* Add a pointer when hovering over the thumbnail images */
.pointer {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 40%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: #e6e6e6;
  font-weight: bold;
  font-size: 30px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}
.prev:hover,
.next:hover {
  color:#b3b3b3;
  /*background-color: rgba(0, 0, 0, 0.8);*/
}

/* Container for image text */
.caption-container {
  text-align: center;
  color: #777;
  font-weight: bold;
  padding: 2px 16px;
}

.img-row:after {
  content: "";
  display: table;
  clear: both;
}

/* thumbnail columns side by side */
.img-column {
  float: left;
  /*width: 16.66%;*/
	height: 106px;
 	max-width: 106px;
	
}
.img-column:hover {
	/*border:1px solid #ccc;*/
}

/* Add a transparency effect for thumnbail images */
.img-demo {
  opacity: 0.6;
}


.img-active, .img-demo:hover {
  opacity: 1;
}

/* misc */

td.left {text-align:left !important;}
td.right {text-align:right !important;}
td.center {text-align:center !important;}
.inlineblock {display : inline-block;}
.inline {display : inline;}
.nomargin {margin:0px !important;}
.nopadding {padding:0px !important;}
.black00 {color:#000 !important;}
.black50 {color:#808080 !important;}

/* td {border:1px solid grey;} */
.bold{font-weight:bold;}



/* Menu styles */
#sidebarmenu {
 display: block;
 list-style: none;
 padding: 0 0 0 0;
 width:;
 margin-top:33px;
 margin-left: 1%;
 margin-right: 1%;
}
#sidebarmenu div {
 display: block;
	/*background-color: #96962E;*/
 font-weight: normal;
 /*border-bottom: 1px solid white;*/
 cursor: pointer;
 padding: 10px 0 10px 14px;
 list-style: none;
	color:black;
	font-size: 16px;
}
#sidebarmenu div:hover {
	/*background-color: #96940A;*/
	background-color: #ededed;
}

#sidebarmenu div.has-sub span:after{
 float: right;
 margin-right: 12px;
 /*font-family:arial;
 font-weight: 700;
 font-size: 26px;
	color: black;/#ffffff;*/
	content: url(/frame/it/img/right-arrow.svg); width: 16px; height: 16px; /* "x" */
	opacity: 0.6;
	/*background-image: url('../it/img/right-arrow.svg');
	background-size: 26px 26px;
	height: 26px;
	width: 26px;*/
}

#sidebarmenu li.open div.has-sub span:after {
 margin-right: 18px;
 /*font-weight: 600;
	color: black; /#C8C8C8;*/
	content: url(/frame/it/img/down-arrow.svg); width: 16px; height: 16px;
	opacity: 0.8;
	/*
 -webkit-transform: rotate(45deg);  /* Saf3.1+, Chrome /
 -moz-transform: rotate(45deg);  /* FF3.5+ /
 -ms-transform: rotate(45deg);
 -o-transform: rotate(45deg);  /* Opera 10.5 /
 transform: rotate(45deg);
 filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5);  /* IE6,IE7 /
 -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5)"; /* IE8 /
 */
}
#sidebarmenu li.open div.has-sub {
	font-weight: bold;
	background-color: #ededed;
}

#sidebarmenu  ul {
 list-style: none;
 padding: 0 0 0 0;
 width: 100%;
}
#sidebarmenu  ul{
 display: none;
}

#sidebarmenu  ul li  {
 /*border-bottom: 1px solid white;*/
}
#sidebarmenu  ul li a div {
 font-weight: normal;
 font-size: 16px;
 cursor: /*auto;*/ pointer;
	/* background-color: grey;*/
 padding: 10px 0 10px 20px;
 /*border-bottom: 1px solid white;*/
}
#sidebarmenu  a {
 text-decoration: none;
	color: black; /*#FFFFFF;*/
 text-transform: uppercase;
}
#sidebarmenu a:hover {
 text-decoration: underline;
}
#sidebarmenu  ul li a div:hover {
 background-color: #f2f2f2;
}

#sidebarmenu li.open div.has-sub + ul{
	border-top: 1px solid #ededed;
	border-bottom: 1px solid #ededed;
}

/* Fix 2022-03-10 */
#sidebarmenu li.level-2 div {
 font-weight: normal !important;
 font-size: 13px !important;
 padding-left: 16px !important;
}
#sidebarmenu li.level-3 div {
 font-weight: normal !important;
 font-size: 12px !important;
 padding-left: 23px !important;
}
#sidebarmenu .level-2  .has-sub span:after {
 content: url(https://it.demo.jakemark.fi/frame/it/img/right-arrow.svg) !important;
}
#sidebarmenu .level-2.open  .has-sub span:after {
 content: url(https://it.demo.jakemark.fi/frame/it/img/down-arrow.svg) !important;
}
#sidebarmenu li.level-2 div.has-sub {
 background-color: #fff !important;
}
.rotate15 {
 -webkit-transform: rotate(15deg);  /* Saf3.1+, Chrome */
 -moz-transform: rotate(15deg);  /* FF3.5+ */
 -ms-transform: rotate(15deg);
 -o-transform: rotate(15deg);  /* Opera 10.5 */
 transform: rotate(15deg);
 filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.2);  /* IE6,IE7 */
 -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.2)"; /* IE8 */	
}

/* Footer styles */
DIV.footer {
margin-top:20px;
margin-bottom: 28px;
border: 1px solid #FFD4AA;
/*border-radius: 6px;*/
width: 100%;
background: CadetBlue; /*#ffefdf;*/
color: #fff; /*#686868;*/
/*font-size: 11px;*/
text-align:center;
}
DIV.footer a {
 color: #f2f2f2;
}
DIV.footer a:hover {
 color: #fff;
 text-decoration: underline;
}
DIV.footer ul {
list-style: none;
margin:0;
padding:2px;
}
DIV.footer li {
 padding:2px;
}
div.foot {
 display:flex; 
 flex-wrap: wrap;
 font-size: 14px;
}
DIV.foot-first {
/*display:inline-block;*/
 flex: 1;
 margin: 12px; /*new*/
padding-top: 6px;
padding-left: 10px;
/*margin-top: 12px;*/
/*width: 180px;*/
min-width: 180px;
height:auto;
/*margin-right: 5px;*/
vertical-align:top;
text-align:left;
/*margin-left: 10px; */
}
DIV.foot-second {
/*display:inline-block;*/
 flex: 1;
 margin: 12px; /*new*/
/*margin-top: 10px;*/
vertical-align:top;
padding-top: 6px;
padding-left: 10px;
/*width: 180px;*/
min-width: 180px;
/*margin-right: 5px;*/
text-align:left;
}
DIV.foot-third {
/*display:inline-block;*/
 flex: 1;
margin: 12px; /*new*/
/*margin-top: 10px;*/
vertical-align:top;
padding-top: 6px;
padding-left: 10px;
/*width: 180px;*/
min-width: 180px;
/*margin-right: 5px;*/
text-align:left;
}
DIV.foot-fourth {
/*margin-top: 12px;*/
vertical-align:top;
min-width: 230px;
 margin: 12px; /*new*/
/*margin-right: 10px;*/
/*display:inline-block;*/
 flex: 1;
}
/*
DIV.foot-fourth img.maksukaista {
margin-top:1px;
margin-bottom:5px;
width:154px;
height:85px;
}
DIV.foot-fourth img.posti {
margin-top:0px;
margin-bottom:0px;
margin-right:10px;
height:26px;
width:auto;
float:right;
}*/

DIV.footerend {
margin-top: 10px;
width: auto;
padding:10px;
background: none; /*#B8734C;*/
display:block;
/*color: #835900;*/
font-size: 11px;
text-align: center;
}
DIV.footerend  img {
height:22px !important;
vertical-align: bottom;
}
DIV.footerend span {
 font-size:12px;
}

/* cart styles */
table.cartcontent {
width:100%;	
border-collapse: separate;
border-spacing: 1px;
}
tr.carthead td{
padding:4px;
vertical-align:bottom;	
text-align:right;
font-size: 11px;
color: #4e757c;
}
tr.cartlines td{
padding:4px;
text-align:right; /*center*/
font-size:13px;
border-bottom:1px solid #f3f3f3;
} 

tr.cartsummary td {
font-size:13px;
padding:5px;
color: #4e757c;
border-bottom:1px solid #f3f3f3;
} 
td.nomarginpadding {
margin:0px !important;
padding:0px !important;	
}
INPUT.button-cart {
background: none;
border: none;
/*color: #0066ff;*/
color: #686868;
text-decoration: underline;
cursor: pointer;
padding: 3px;
}

.info_345 {
 /*font-size: 100%;*/
 color: #ff4040;
 font-weight: normal;	
}
.info_save {
 color: #ff4040;
}

.description-short {
 padding: 4px;
}
.description-long {
}
.description-extra {
 color: #777777;
}

/* ACCORDION (core)*/
div.accord-div {
font-size: 13px;
}
.accord-div ul {
list-style: none;
padding: 0px;
margin: 2px;
}

.accord-div ul li {
padding-left: 2px;
margin-bottom: 3px;
}
.accord-div span:hover {
background:white;
cursor:pointer;
color: #404040;
}

div.cont-banks {
color: Black;
padding:3px;
line-height: 28px;
}
img.middle {
vertical-align: middle;
max-height: 34px;
}
.cont {
display: none;
font-size: 13px;
border-top : 1px solid #f3f3f3;
border-bottom : 1px solid #f3f3f3;
background-color : #ffffb3;
padding:5px;
margin-top:1px;
margin-left:20px;
color: Brown;
}
div.cont-IE {
background-color : #ffffb3;
padding:3px;
}

input[type="radio"]:checked ~ .cont {
display: block;
}
.accord-div input[type="radio"]:checked + label { 
font-weight: bold;
color: #303030;	
}
.cont IMG {
max-width:70px;
height:auto;
vertical-align:top;
}
.cont div.tuotekuvaus {
display:inline;
vertical-align:top;
}

.cart-options {
max-width: 96%;
border:0;
}

/* delivery method list (user)*/
li.cart-delivery-method, li.checkout-payment-method  {
/* border-top: 1px solid #ccc;*/
 padding: 10px 2px 8px 2px;
 border: 0;
 margin-bottom: 1px;
}

li.cart-delivery-method.accord-checked-radio, li.checkout-payment-method.accord-checked-radio {
 border-top: 1px solid #ccc;
 border-bottom: 1px solid #ccc;
 background:ivory;
}

li.cart-delivery-method > div.cont {
 background: ivory;
 border:0;
 min-height: 80px;
 padding: 8px;
}
li.checkout-payment-method > div.cont {
 background: ivory;
 border:0;
 min-height: 20px;
 padding: 8px;
}
span.cart-delivery-method-img, span.checkout-payment-method-img {
 display:inline-block;
 width:42px;
 margin-right:3px;
 text-align:left;
}
span.cart-delivery-method-img img, span.checkout-payment-method-img img {
 max-width:40px;
 padding:0;
}

#payment-methods-section {
 margin-bottom:22px;
} 

#toimitustavat {
 margin-bottom: 6px;
 flex:360px;
 /*width: 360px;*/
}
/*#asiakastyyppi {
margin-bottom: 1px;
padding:10px;
}*/
/* end accordion */


.input-form input[type=text] {
 width: 220px;	 
}

.hovero {
 opacity:0.85;
}
.hovero:hover {
 opacity:1;
}

.abutton {
    /*display: block;*/
    width: 84px;
    height: 20px;
    background: #4E9CAF;
    padding: 3px;
    text-align: center;
    border-radius: 5px;
	border:0;
    color: white;
    font-weight: normal;
	font-size:11px;
	text-transform: uppercase;
	margin-left: 14px;
	cursor: pointer;
}

/* loading spinner */
.loader {
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #3498db;
  width: 38px;
  height: 38px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Load more */
h2.load-more{
	width: 99%; 
	background: #0073e6;
	text-align: center;
	color: white;
	padding: 10px 0px;
	font-weight: normal;
	font-size: 15px;
}
h2.load-more span{
	font-size: 13px;
	padding: 4px 20px;
	float: right;
}

h2.load-more:hover{
	cursor: pointer;
	/*opacity: 1;*/
}


/* messages box */
.msg {
 font-size: 13px;
 padding:20px;
 margin:auto; 
 width: 98%;
}
.error {
 color:#DB0000;
 background-color: #f2dede;
 border:1px solid #ebccd1;
}
.success {
 color: #3c763d;
 background-color: #dff0d8;
 border:1px solid #d6e9c6;
}
.advice {
 color: #3c763d;
 background-color: #ffeecc;
 border:1px solid #d6e9c6;
}
.msg a{
 color: blue;
 text-decoration: underline;
}

/* List with icons */
.list-with-icons ul {
  list-style: none;
  padding: 0;
}
.list-with-icons li {
  display:flex;
  flex-wrap: wrap;
  align-items: center;
  padding:6px;
  padding-left: 1.3em; /* DoNotTch */
  margin-left: 8px;
}
.list-with-icons li > div {
 min-width: 160px;
 color: #444;
 padding: 1px 4px;
}
.list-with-icons li > div:last-child {
 font-weight: bold;
 color: #555;
}
.list-with-icons li:before {
  /*content: "\f00c";  FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  margin-left: -1.3em; /* DoNotTch same as padding-left set on li */
  width: 1.3em; /* DoNotTch same as padding-left set on li */
  color:green;
  font-size: 22px;
}

li.list-checked:before {
 content: "\f00c"; /*FontAwesome Unicode*/
}
li.list-info-circle:before {
 content: "\f05a"; /*info-circle*/
}

li.list-disabled:before {
 content: "\f00d"; /*times*/
 color: red !important;
}
li.list-disabled > div:last-child {
 color: red;
 opacity: 0.8;
}
li.list-yes > div:last-child {
 color: green;
 opacity: 0.9;
}





/* product grid item details */
.list-product-grid li {
 padding: 1px;
 padding-left: 12px;
}
.list-product-grid li:before {
 font-size: 14px;
}


/*cart progress bar*/
.progressbardiv {
	width: 100%;
	margin-top:16px;
	}
.progressbar {
  counter-reset: step;
  display:flex;
}
.progressbar li {
  list-style: none;
  display: inline-block;
  /*width: 30.33%;*/
  flex:1;
  position: relative;
  text-align: center;
  cursor: pointer;
  color:#ddd;
}
.progressbar li:before {
  content: counter(step);
  counter-increment: step;
  width: 30px;
  height: 30px;
  line-height : 30px;
  border: 1px solid #ddd;
  border-radius: 100%;
  display: block;
  text-align: center;
  margin: 0 auto 10px auto;
  background-color: #ddd;
  color: #fff;
}
.progressbar li:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #ddd;
  top: 15px;
  left: 0%;
  z-index : -1;
}
/*.progressbar li:first-child:after {
  /*content: none;
 background-color: green;
}*/

.progressbar li.active {
  color: CadetBlue;
}
.progressbar li.active:before {
  border-color: CadetBlue;
  background-color: CadetBlue;
  color:white;
} 
.progressbar li.active + li:after {
  color:#ddd;
}

.progressbar li.active:after {
  background-color: CadetBlue;
}

.modal2 {
  position: relative; /* Stay in place */
  z-index: 1;
 /* left: 0;
  top: 0;
  width: 100%;
  height: 100%;*/
  /* overflow: auto; Enable scroll if needed */
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.2);
}
	
.cartpanel {
  height: 100%; /* Specify a height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 9; /* Stay on top */
  top: 0;
  right: 0;
  background-color: #fff;
  overflow: hidden; /* Disable scroll */
  padding-top: 60px; /* Place content 60px from the top */
  padding-left: 0;
	padding-right: 0;
	margin-right: 0;
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
}
.cartpanel h2{
 margin-left: 8px;
 font-size: 20px;
}

.cartpanel table {
 width: 100%;
 padding-right: 8px;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
 overflow:auto;
}
/* Disable scroll bar chrome */
.cartpanel table::-webkit-scrollbar {
  display: none;
}


.cartpanel td {
 height: 60px;
 border-bottom: 1px solid LightGrey;	
}
.cartpanel tr:last-child td {
 border-bottom: none;
}
.cartpanel span {
 font-family: Roboto, Muli;
 font-size: 14px;	
}
/* shopping cart icon number */

.badge {
  padding-left: 9px;
  padding-right: 9px;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
  border-radius: 9px;
}

.label-warning[href],
.badge-warning[href] {
  background-color: #c67605;
}
#lblCartCount, #lblLoggedIn {
    font-size: 12px;
    background: #ff0000;
    color: #fff;
    padding: 2px 5px;
    vertical-align: top;
    margin-left: -8px; 
}
a.tocheckout {
 font-size: 11px !important;
 text-transform:uppercase;
 padding-right:10px;
}
/*
.cartpanel input {
 width: 42px;
 height: 30px;
 border: 1px solid LightGrey;
 text-align: center; 
 padding: 5px;
 border: 1px dotted #ccc;
 margin: 2%;
}*/
.flex {
 display:flex;
 flex-wrap: wrap;
}
.flexchild {
 flex: 1;
}
/* https://stackoverflow.com/questions/16670931/hide-scroll-bar-but-while-still-being-able-to-scroll */
#cartcontent_rows {
 /*overflow: auto;*/
 /*overflow-y: scroll;
 height: 100%;*/
}
#cartcontent_summary {
 position: sticky;
 /*z-index: 3;  Stay on top */
 bottom: 0;
 right: 0;
 /*margin: 20px 10px 20px 2px;*/
 font-size: 14px;
 height: 160px;
 /*width: 0;*/
 /*width: 358px; 2021-04-12*/
 width: 100%;
 background: #fff;
 border-top: 1px solid lightgrey;
 padding: 12px 4px 16px 0;
 transition: 0.5s;
}
#cartcontent_sumline {
 width: 100%;
 padding: 10px 8px 10px 4px;
}
#cartcontent_summary ul {
 align: center;
 padding: 2px; 
 margin-top: 16px;
 width: 100%;
}

.checkout-delivery {
 display: flex;
 flex-wrap: wrap;	
}
.checkout-delivery div {
 min-width:200px;
 max-width:300px; 
}
#formCheckout input.editadmin, #formCheckout input.editadmin-addr { 
 max-width:200px; 
 min-height:20px;
 height:22px;
 font-size:11px;
}

.termspanel {
  height: 100%; /* Specify a height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 10; /* Stay on top */
  top: 0;
  right: 0;
  background-color: #fff;
  overflow: auto;
  padding-top: 60px; /* Place content 60px from the top */
  padding-left: 0;
  padding-right: 0; /* must be */
  margin-right: 0;
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
}


/* cart quantity box */
.quantity {
 display: inline-block; }

.quantity .input-text.qty {
 width: 45px;/*35px;*/
 height: 39px;
 padding: 0 5px;
 text-align: center;
 background-color: transparent;
 border: 1px solid #efefef;
}

.quantity.buttons_added {
 text-align: left;
 position: relative;
 white-space: nowrap;
 vertical-align: top; }

.quantity.buttons_added input {
 display: inline-block;
 margin: 0;
 vertical-align: top;
 box-shadow: none;
}

.quantity.buttons_added .minus,
.quantity.buttons_added .plus {
 padding: 7px 10px 8px;
 height: 41px;
 background-color: #ffffff;
 border: 1px solid #efefef;
 cursor:pointer;}

.quantity.buttons_added .minus {
 border-right: 0; }

.quantity.buttons_added .plus {
 border-left: 0; }

.quantity.buttons_added .minus:hover,
.quantity.buttons_added .plus:hover {
 background: #eeeeee; }

/* remove arrows, spinners Chrome, Safari, Edge, Opera*/
.quantity input::-webkit-outer-spin-button,
.quantity input::-webkit-inner-spin-button {
 -webkit-appearance: none;
 margin: 0; 
 }
 /* firefox */
input[type=number] {
  -moz-appearance: textfield;
}
 
 
.quantity.buttons_added .minus:focus,
.quantity.buttons_added .plus:focus {
 outline: none; }



.menupanel {
  margin-left: 0;
  height: 100%; /* Specify a height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 9; /* Stay on top */
  top: 0;
  left: 0;
  background-color: #fff;
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  padding-left: 0; /* Have to be 0*/
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
}
.menupanel h2{
 margin-left: 8px;
 font-size: 20px;
}
.closebtn {
  position: absolute;
  top: 20px;
  right: 25px;
  margin-left: 50px;
}

/* The Modal (background) */
/* Modal popup box */
.modal {
  display: none;
  position: fixed; /* Stay in place */
  z-index: 8;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.2);
}
.menu-after {
  position: relative;	
}
.modal-content {
  background-color: #fefefe;
  margin: 15% auto;
  padding: 40px 20px;
  border: 1px solid #888;
  width: 80%;
}
.modal-close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

.button, a.button {
 color: #fff;
 background: orange;
 opacity: 0.9;
 padding: 16px 28px;
 border: 0;
 text-transform: uppercase;
 margin-top: 8px;
 text-align: center;
 min-width:230px;
 cursor: pointer;
}
a.button {
 display: block;
}

.button:hover, a.button:hover {
 opacity: 1;
}

.print-button {
 display: inline-flex;
 align-items: center;
 font-size:14px;
 /*vertical-align:middle;*/
 cursor: pointer;
 padding: 2px;
}
.print-button > i {
 font-size:24px;
 color:red;
 background:white;
 padding:0;
 margin-left:4px;
}
.print-button:hover {

}

#account_navigation li {
 padding:12px;
 background: grey;
 border-top:1px solid lightrey;
 border-bottom:1px solid lightrey;
 margin-bottom: 2px;
 color: white;
 text-transform: uppercase;
 font-size: 13px;
 opacity:0.8;
}
#account_navigation li:hover {
 opacity:1;
 cursor:pointer;
}
#account_navigation li span {
 font-weight: bold;
 padding-right:8px;
}

.like-disabled { color: lightgrey; background: #efefef4d; border:1px solid lightgrey;}

.opt_addr_li_bill, .opt_addr_li_ship {
 background: lightyellow;
 padding:6px;
 border:1px solid grey;	
}

.opt_active {
 background: lightgreen;
}

/* tooltip */
a.tooltip{
 display: inline;
 position: relative;
 font-size: 13px;
 padding-left: 12px;
}
a.tooltip i {
 color:green;	
}

a.tooltip:hover{
text-decoration: none;
cursor: help;
}
a.tooltip:hover:after{
    /*background: #333;*/
	background: #fff;
    /*background: rgba(219,135,94,.9);*/
	 background: rgba(3,3,3,.7);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
	font-size:13px;
	font-weight:normal;
    content: attr(title);
    /*left: 20%;*/
	right:-10%;
	border:1px solid lightgrey;
    padding: 5px;
    position: absolute;
    z-index: 98;
    width: 400px;
	white-space: pre-line;
	box-shadow: 2px 3px 2px #888888;
}
a.tooltip.default:hover:after{
    left: 20%;
}
a.tooltip.pleft:hover:after{
    left: 50px;
}
a.tooltip.mleft:hover:after{
    left: -30px;
}
a.tooltip.pright:hover:after{
    right: 20px;
}
a.tooltip.mright:hover:after{
    right: -50px;
}

/* account order details*/
.li_order_details {
 display: none;
 padding-top: 4px;
 padding-bottom: 10px;
 margin: 0;
}
.li_order_details td {
 padding: 8px 4px;
 vertical-align: text-top; 
}
.li_order_details label {
 font-size: 12px; 
 font-weight:bold;
}
.li_order_details span {
 font-weight:normal;
 font-size: 13px;	
}
.li_order_details a {
 color: darkblue;	
}
.opened_order {
 font-weight: bold; 
 border-bottom:none !important;
}

#addresses_selection_bill, #addresses_selection_ship {
 display:inline;
 margin-left: 6px; 
}

.category_description_div {
 padding: 8px;
}
.category_description_div h3,h4,h5{
 margin-bottom: 2px;
}
.category_description_div p{
 margin-top: 1px;
}

/* Cookies*/
.cookies { 
  width: 100%;
  /*margin: 0;*/
  padding: 0.5em 10%;
  background: rgba(86,86,86,0.92);
  border-bottom: solid 1px rgb(225,225,225);
  position: fixed;
  bottom: 0;
}
 
.cookies p {
 /* font-family: sans-serif;*/
  font-size: 13px;
  /*font-weight: normal; 700;
  letter-spacing: 1px;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.35);*/
  text-align: center; 
  color: rgb(255,255,250);
  margin: 2px;
  z-index: 999;
}
.cookies a { text-decoration: underline; }

.cookie-accept {
 background: #f1d600;
 opacity: 0.9;
 padding: 4px; 
 margin:4px;
 margin-left:28px;
 border: 0px;
 border-radius: 5px;
 cursor: pointer;
 min-width: 100px;
 color: rgb(86,86,86);
}
.cookie-accept:hover {
 opacity: 1;
}
div.vismapay-div-right {
 text-align:right !important;
}
img.vismapay-column {
 float:right;
 max-width: 170px;	
}

.mail_me_button {
 font-size: 12px;
 padding: 10px 6px; 
}
.mail_me_list li{
 margin-bottom: 10px;
}

/* MOBILE 650 */
@media only screen and (max-width:650px) { /*ex: 680*/

 .flex-child.topsearch { order:1;}	/* new search */
 .flex-child.menuicon {max-width:60px;}
 .flex-child.toplogo { min-width:210px; }
 .flex-child.topcart { min-width:110px; } /*130*/
 #search-top-id {min-width:310px; width:90% !important;}
 .topsection, .flex-container {height:98px;}
 #cart_lang_links, #menutoggletext, #account_icon {display:none;}

 #menudiv {display:none;}
 /*#topsearch , #menudiv {display:none;}*//* new search */
 .main-row {flex-direction: column;}
 .main-left, .main-content {flex: 100%;padding:6px; padding-left: 8px;}
 .main-left div {width: 100%;}
 .flex-container {height:48px !important;}
 .flex-child {height:48px !important;line-height: 48px;}

/* #topsearch-mobile {display:block;text-align:center;height:32px !important;}
 #topsearch-mobile input{width:80% !important;margin: 3px;}*/
 #menutoggle {display:block;}
 .responlogo{margin-right: 2px;}
 #tocheckout{display:none;}
 #catstree{display:none;} 
 #slideshow {height:240px;}
 #slideshow DIV {height: 240px;}
 #slideshow DIV IMG {height: 190px;}
 #slideshow DIV H3 {font-size:11px;}
 .menupanel, .cartpanel { max-width: 280px; }
 .button.add_cart_button { 
   width: 100%; 
  }
 .prod-price, .product-grid {
  width: 100%;
  /*display:block;*/
  margin: 0 auto;	
  padding:16px;
 }
 a.tooltip:hover:after{ width:300px; }
 img.vismapay-column { display:none;}
 img.vismapay-square { display:block !important;}
}

/* max-width 360 */
@media only screen and (max-width:360px) {
	
 .responlogo { min-width: 170px;}
 .flex-child.toplogo { min-width:170px; }
 .flex-child.topcart { min-width:54px; } 
 #search-top-id {min-width:240px; width:90% !important;} 
  a.tooltip:hover:after{ width:250px; }
  
}
