html,body{background: #fff; font-family: 'Raleway',arial,sans-serif; font-weight: 400; height: 100%; margin: 0; padding: 0;}
header{width:90%; margin:0 auto; margin-bottom:1em;}

div.table{display:table; width:100%;}
div.table-row{display:table-row;}
div.table-cell{display:table-cell;}

div#logo{width:30%;}
div#slogan{color:#27873d; font-weight:bold; width:40%; text-align:center;}
div#slogan2{color:#27873d; font-weight:bold; text-align:left;}

div#shoppingcard{width:30%; vertical-align:top; text-align:right; font-size:.8em; }
div#shoppingcard div.shoppingcard-content{padding-right:.5em;} /*padding-top:1em;*/
div#shoppingcard div.shoppingcard-content div#chopcardimg{float:right; padding-top:.85em;margin-left:.5em;}
div#shoppingcard span.shoppingcard-kpl{font-size:1.5em;}
div.chopcardsisaltolinkki{margin-top:3px; margin-right:30px;}
div.chopcardsisaltolinkki a{color:#000; text-decoration:none;}
div.chopcardsisaltolinkki a:hover{text-decoration:underline;}

div.content{width:90%; margin:0 auto; margin-top:.5em;}
div.content-text{float:right; width:76%; border:.1em solid #f4f4f4; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}


footer{width:90%; margin:0 auto; margin-top:.5em; border-top:.1em solid #f4f4f4; font-size:.75em;}
footer table{margin:0 auto; margin-bottom:1em;}
footer table tr td{vertical-align:top; padding-right:5em;}
img:not(.lb-image){border: 0 none; height: auto !important; max-width: 100% !important;}
div.c{clear:both;}

div.leftnavi{width:23%; float:left;}
div.leftnavi-header{background:#cb181e; color:#fff; font-weight:bold; padding:.3em .5em .3em .5em; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px;
border-top-right-radius: 3px;}
div.leftnavi-content{border:.1em solid #f4f4f4; border-top:none; min-height:372px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px;
border-bottom-left-radius: 3px;}
div.leftnavi-content ul{margin:0; padding:0; list-style-type: none;}
div.leftnavi-content ul li{margin:0; padding:.4em .4em .2em .4em; border-bottom:.1em solid #f4f4f4; font-size:.85em;}
div.leftnavi-content ul li:last-child{}
div.leftnavi-content ul li.selected{text-decoration:underline;}
div.leftnavi-content ul li a{color:#000; text-decoration:none;}
div.leftnavi-content ul li a.selected, div.leftnavi-content ul li a:hover{text-decoration:underline;}
div.leftnavi-content ul ul{margin-left:10px;}
div.leftnavi-content ul ul li{border-bottom:0; font-size:.85em;}
div.leftnavi-content ul ul li:hover{background:transparent;}
div.leftnavi-content ul ul li.selected{background:transparent url("../images/naviarr.png"); background-repeat: no-repeat; background-position: right;}
div.leftnavi-content ul ul ul li{border-bottom:0; font-size:1em;}

div.uutuudet{width:90%; margin:0 auto; margin-top:1em;}
div.uutuudet-header{padding:.5em; border:.1em solid #f4f4f4; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
div.uutuudet-content{width:90%; margin:0 auto; margin-bottom:1em;}
div.uutuudet-content div.uutuudet-cell div.uutuudet-data{margin:.5em; padding-top:1em; border:.1em solid #f4f4f4; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align:center; height:180px;}
div.uutuudet-content div.uutuudet-cell div.uutuudet-data:hover{background:#f5f5f5; cursor:pointer;}
div.uutuudet-content div.uutuudet-cell div.uutuudet-data:first-child{margin-left:0;}
div.uutuudet-content div.uutuudet-cell:nth-child(4) div.uutuudet-data{margin-right:0;}
div.uutuudet-content div.uutuudet-cell a{color:#000; text-decoration:none;}

span.ale{font-size:6em; color:#cb181e; font-weight:600;}
span.saasta{font-size:2em; color:#cfcfcf; font-weight:600;}
span.hinta{color:#000;} /*008735*/
span.saastaprosentti{font-size:.6em; color:#cfcfcf; font-weight:600;}
span.lisatiedot{color:#000; font-size:.8em;}
input.addcard{background:#cb181e; color:#fff; border:.1em solid #c81b1f; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding:.3em 1em .3em 1em; font-size:.9em; cursor:pointer; text-align:center;}
input[type=number], input.text{border-radius: 3px; border:.1em solid #b0b0b0; padding:.2em .1em .2em 1em;}
textarea{border-radius: 3px; border:.1em solid #b0b0b0;}
input.text:focus{background:#f5f5f5;}

div.verkkokauppa-tuotelista{font-size:.85em; border-bottom:.1em solid #f5f5f5; padding:.3em 1em .3em 1em;}
div.verkkokauppa-tuotelista-yhteensa{border:none;}
div.verkkokauppa-tuotelista:hover{background:#f5f5f5;}
div.verkkokauppa-tuotenimi{float:left;}
div.verkkokauppa-tuotekoriin{float:right;}
div.verkkokauppa-tuotekoriin input.tuotekpl{max-width:70px;}

div.message{margin-bottom:2em; padding:1em; border:.1em solid #cfcfcf; background:#f5f5f5; font-weight:.95em; line-height:1.3em;}

div#waypoint{display:none; text-align:center;}
div#waypoint img{margin-bottom:-10px;}
div.tulostaLisaaTuotteita{text-align:center;}
div.tulostaLisaaTuotteita input[type="button"]{background:#fff; border:.1em dotted #cfcfcf; padding:.4em 2em .4em 2em; color:#989797; font-weight:bold; margin-top:.5em; cursor:pointer;}

ul.kaupanehdot{margin-left:0; padding-left:15px;}
ul.kaupanehdot li{padding-bottom:5px;}


div.verkkokauppa-tuotelista-valinta{border-bottom:.1em solid #f5f5f5; padding: .2em 0 .2em 0; position:relative;}
div.verkkokauppa-tuotenimi-tiedot h4{margin:1em 0 0 0; padding:0;}
div.verkkokauppa-tuotenimi-tuotenumero{font-size:.8em; color: #8c8c8c;}
div.verkkokauppa-tuotenimi-tuotenumero a{color:#8c8c8c; text-decoration:none;}
div.verkkokauppa-tuotenimi-tuotenumero a:hover{text-decoration:underline;}
div.verkkokauppa-tuotenimi-tuoteesittely{margin-top:.5em; font-size:.9em;}
div.verkkokauppa-tuotekoriin-valinta input.addcard{background: url('../images/ico_lisaa_koriin.png') no-repeat; border:0; height:38px; width:120px; text-align:left; padding-left:.4em; font-weight:bold; font-size:.75em;}
div.verkkokauppa-tuotenimi-tiedot table{width:100%; }
div.verkkokauppa-tuotekoriin-hinta{font-size:.95em; text-align:right; padding-right:.3em; padding-bottom:.3em;}
div.lisattyTuotekoriin{display:none; background:#f5f5f5; border:.1em dotted #cfcfcf; margin-top:1em; padding:1em; color:#cb181e; font-weight:bold;}
span.require{color:#cb181e;}

.text-orange{color:#e98504;}
.text-blue{color:#169fe6;}
table tr td.verkkokaupantarjoaa{text-align:center; font-size:1em;}
table tr td.verkkokaupantarjoaa a{text-decoration:none;}
table tr td.verkkokaupantarjoaa a:hover{text-decoration:underline;}

div.oneImage{}
div.multibleImages{box-shadow: 1px 1px 0px #ccc, 2px 2px 0px #fff, 3px 3px 0px #ccc, 4px 4px 0px #fff, 5px 5px 0px #ccc;}
div.multibleImagesPadding{height:6px;}

table.tilaajantiedotLomake tr td{font-size:.9em;}
table.tilaajantiedotLomake tr td.header{font-size:.85em; font-weight:bold}

.numberUpdateOk{background-color:#aaee85;}
.numberUpdateError{background-color:#ee9b85;}



/*********************************************************************************************************
*	Leveämpi kuin 850px
*********************************************************************************************************/
@media screen and (min-width:850px) {
	div.content-text-margin{margin:3em;}
	/*div#slogan{display:block;}*/
	div#slogan2{display:none;}
	
	div.content-text{min-height:400px;}

	/* Tilaajan tiedot */
	table.tilaajantiedot{width:100%;}
	table.tilaajantiedot tr td:first-child{width:150px;}
	table.tilaajantiedot tr td input.text{width:100%; max-width:350px;}
	table.tilaajantiedot tr td textarea{width:100%; height:150px; max-width:500px;}

	/* Tuotelista */
	div.verkkokauppa-tuotekuva-kuva{float:left; width:15%; margin-top:1em;}
	div.verkkokauppa-tuotenimi-valinta{float:left;width:60%;}
	div.verkkokauppa-tuotekoriin-valinta{position:absolute; float:left;  text-align:right; margin:0; bottom:.5em; right:0; width:25%;}
	div.verkkokauppa-tuotenimi-box{padding-left:2em;}
	
	/* Ostoskori yhteenveto */
	table.ostoskoriyhteenveto{width:100%;}
	table.ostoskoriyhteenveto tr td:nth-child(1){text-align:right; width:80%;}
	table.ostoskoriyhteenveto tr td:nth-child(2){text-align:right; width:20%;}

	/* Etusivun suositukset */
	div.uutuudet-content div.uutuudet-cell{float:left; width:25%; height:200px; transition: transform .2s ease;}
	div.uutuudet-content div.uutuudet-cell:hover{opacity:.9; transform: scale(1.05);}
	div.uutuus-content{width:calc(90% - 2em); margin:0 auto; border:.1em solid #f4f4f4; padding:1em;}
	
	div.uutuus-content img{transition: transform .2s ease;}
	div.uutuus-content img:hover {opacity:.9; transform: scale(1.01);}


	/* Päänavi */
	#tuotevalikko{display:none;}

	nav{width:90%; margin:0 auto; background:#383838; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
	nav ul{display: inline; list-style-type: none; margin:0; padding: 0; text-align: left; }
	nav ul li {display: inline-block; margin:0; position: relative; color:#fff; font-weight:bold; padding: .5em 1em .5em 1em; background:url("../images/naviborder.gif") repeat-y right top}
	nav ul li:hover{}
	nav ul li a{ color:#fff !important; text-decoration:none;}
	nav ul li a:hover, nav ul li a.selected{text-decoration:underline;}
	nav div.search{float:right; width:180px; margin:.5em; 0 0 0;}
	nav input[type="search"]{ background:#fff; border:.1em solid #f4f4f4; border-right:0; height:19px;}
	nav input[type="submit"]{border:.1em solid #f4f4f4; background:#fff url("../images/hakuikoni.gif"); background-repeat: no-repeat; background-position: right; cursor:pointer; margin-left:-20px;}
	a.navimenu{display:none;}
	div.mobilesearch{display:none;}
}


/*********************************************************************************************************
*	Kapeampi kuin 850px
*********************************************************************************************************/
@media screen and (max-width:850px) {
	div.content-text h1{font-size:1.4em;}
	div.content-text h2{font-size:1.2em;}

	div.content-text-margin{margin:2em 1em 2em 1em;}
	div#slogan{display:none;}
	div#slogan2{display:block; font-size:.6em;}
	div#logo img{max-width:150px !important;}

	/* Tilaajan tiedot */
	table.tilaajantiedot{width:100%;}
	table.tilaajantiedot tr td{display:table; width:100%;}
	table.tilaajantiedot tr td input.text{width:100%; max-width:350px;}
	table.tilaajantiedot tr td textarea{width:100%; height:150px; max-width:500px;}

	/* Tuotelista */
	div.verkkokauppa-tuotekuva-kuva{float:none; margin-top:1em;}
	div.verkkokauppa-tuotekuva-kuva img{max-width:150px !important; max-height:150px !important;}
	div.verkkokauppa-tuotenimi-valinta{float:none;}
	div.verkkokauppa-tuotekoriin-valinta{text-align:right; margin:0; bottom:.5em; right:0; width:100%; padding-top:.5em;}
	div.verkkokauppa-tuotenimi-box{padding-left:0em;}
	
	/* Ostoskori yhteenveto */
	table.ostoskoriyhteenveto{width:100%;}
	table.ostoskoriyhteenveto tr td:nth-child(1){text-align:left;}
	table.ostoskoriyhteenveto tr td:nth-child(2){text-align:right;}

	/* Etusivun suositukset */
	div.uutuudet-content div.uutuudet-cell div.uutuudet-data{height:230px;}
	div.uutuudet-content div.uutuudet-cell{float:left; width:50%; height:250px;}
	div.uutuus-content{width:calc(90% - 2em); margin:0 auto; border:.1em solid #f4f4f4; padding:1em;}	
	div.uutuus-content img{transition: transform .2s ease;}
	div.uutuus-content img:hover {opacity:.9; transform: scale(1.01);}


	/* Päänavi */
	#navigointi{width:90%; margin:0 auto;}
	#navivalikko{width:38%; float:left;}
	#tuotevalikko{width:58%; float:right;}

	nav ul{display:none;}
	nav{width:100%; margin:0 auto; border-top: 1px solid #383838; border-bottom: 1px solid #383838;}
	nav ul{display: none; list-style-type: none; margin:0; padding: 0; text-align: left; }
	nav ul li { margin:0; position: relative; color:#383838; font-weight:normal; padding: .1em 1em .1em 1em;}
	nav ul li:hover{}
	nav ul li a{ color:#383838 !important; text-decoration:none; font-size:.8em;}
	nav ul li a:hover, nav ul li a.selected{text-decoration:underline;}
	
	a.navimenu, a.navimenu-2{display:block; cursor:pointer; background:url('../images/navimenu.png') right no-repeat; padding:.3em;}
	
	div.leftnavi{display:none;}
	div.content-text{width:100%;}
	footer table tr td{padding-right:2em;}
	nav div.search{display:none; float:right; width:180px; margin:.5em; 0 0 0;}
	nav input[type="search"]{ background:#fff; border:.1em solid #f4f4f4; border-right:0; height:19px;}
	nav input[type="submit"]{border:.1em solid #f4f4f4; background:#fff url("../images/hakuikoni.gif"); background-repeat: no-repeat; background-position: right; cursor:pointer;}

	div.mobilesearch{display:block; width:90%; margin:0 auto; margin-top:.5em;}
	div.mobilesearch input[type="search"]{border: .1em solid #383838; width:100%; padding-top:.4em; padding-bottom:.4em;}
	div.mobilesearch input[type="submit"]{border: .1em solid #f4f4f4; background: #fff url("../images/hakuikoni.gif"); background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-repeat: no-repeat; background-position: right; cursor: pointer; margin-left:-20px;}

}