html,body,a,table,tr,td,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,applet,object,iframe,pre,abbr,address,big,em,img,ins,q,s,small,strong,sub,b,u,i,dl,dt,dd,ol,nav ul,nav li,form,tbody,tfoot,thead,th,article,details,embed,figure,footer,header,menu,nav,output,audio,video {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}footer,article,figure,header,menu,nav {
display: block;} ol,ul {list-style:none;margin:0px;padding:0px;}blockquote,q {quotes: none;}blockquote:before,blockquote:after,q:before,q:after {content:'';content: none;}table {border-collapse:collapse; border-spacing:0;}a{ text-decoration:none;}.clear{ clear:both;}img{ max-width:100%;}

body{font-family: 'Open Sans', sans-serif;overflow-x:hidden;background-color:#FFFFFF;}
#body-box{margin-left:auto;margin-right:auto;width:99%;max-width:1180px;box-shadow:0px 0px 7px rgba(0, 0, 0, 0.4);}
.boostrapmenu{max-width:1300px;text-align:left;margin-left:auto;margin-right:auto;background-color:#fff;border-bottom:1px solid #CCCCCC;}

.boo-top{background-image:url('../images/boo-top_tausta.jpg');color:#fff;max-height:70px;height:70px;}

.boo-top-right{
margin-top:13px;margin-right:5px;
color:#fff;float:right;
text-align:right;padding:5px 10px 5px 10px;
box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
}

.navbar-header p {padding:14px 30px 0 25px;font-size:16px;font-style:italic;}
.content {background-color:#ffffff;}
.wrap{width:85%;margin:0 auto;max-width:1350px; padding-top:1.5em}
.header{max-width:1300px;margin-left: auto;margin-right: auto;}
.header-left{float:left;width:45%;padding-top: 4.4%;}
.header-left span{width:831px;height:446px;display:block;background:url('../images/header_keski.png') no-repeat;}
.header-right{float:right;width:54%;margin-top:13%;}
.logo img{display:block;}
.header-right p{
	color: #ffffff;
	font-size: 1.7em;
	width: 67%;
	line-height: 1.3em;
	margin: 1em 0 1.5em 0;
}
.bigbtn{
	background: #000000, inherit:50%;
	color: #ffffff;
	display: inline-block;
	padding: 0.7em 1.5em;
	font-size: 1.2em;
	box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	-o-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.55);
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
}
.bigbtn:hover{
	color:#FF9900;
	background:#000000;
}
.divice-fea {
	margin-top: 1em;
}
.divice-fea-left{
	float:left;
	width: 64%;
}
.divice-fea-right{
	float: right;
	width: 33%;
	text-align: left;
	height:100%;
	vertical-align:bottom;
	padding-left:15px;
}
.divice-fea-left-only{
	float:left;
	width: 97%;
}

.divice-fea-left-grid{
	margin-top:0em;
}

.divice-fea-left-grid span img{
	margin-right:25px;
}

/*table*/
table#hinnasto {width:100%; margin-left:auto; margin-right:auto; margin-bottom:45px;}
table, th, td {border: 0px solid white;border-collapse: collapse; width:33%;}
table#hinnasto th {padding-left: 10%; text-align: left;}
table#hinnasto td {padding-left: 10%; padding-top: 5px; text-align: left;}
table#hinnasto tr:nth-child(even) {background-color: #eee;}
table#hinnasto tr:nth-child(odd) {background-color:#fff;}
table#hinnasto th	{background-color:#666666;color:#ffffff;}
/*table*/

img.center {margin-left:auto; margin-left:auto;}

.divice-fea-right-valitsin{
	float: left;
	width: 33%;
	text-align: left;
	margin-top: 1%;
	margin-left:0px;
	color:#FFFFFF;
}
.divice-fea-right etukuva{background:url('../images/ollilehti.jpg') no-repeat;height:450px;width:350px;display:inline-block;}
.divice-fea-right etukuva_tilataksi{background:url('../images/ollilehti_tilataksi.jpg') no-repeat;height:330px;width:350px;display:inline-block;}

.divice-fea-left-grid h3{
	font-size: 1.8em;
	color:#fff;
	background-color:#999999;
	margin-left:-10px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:10px;
}
.divice-fea-left-grid h3{
	font-weight: 700;
	margin-top:0px;
	margin-bottom:0px;
}
.divice-fea-left-grid h3 span{
	font-size: 0.9em;
	font-style:italic;
	font-weight:400;
	padding-left:10px;
	padding-top:5px;
	color:#fff;
}
.divice-fea-left-grid hr{
	display: block;
	margin-top: 0.2em;
	margin-bottom: 0.2em;
	margin-left: -10px;
	margin-right: auto;
	border-style: inset;
	border-width: 1px;
	background-color:#FFFF00;
	color:#FFFF00;
}
.divice-fea-left-grid p{
	color:#333333;
	line-height: 1.7em;
	font-size: 1.0em;
	margin: 0.5em 0 1.1em 0;
	padding-bottom:10px;
}

p.italic {font-style:italic; font-weight:bold; text-align:center; font-size:1.5em; background-color:#00FFFF;}

#footer {border-top: 2px solid #2E2E2E;padding-left:5%;padding-top:20px;padding-bottom:20px;margin-top: 2em;background:url('../images/footer_tausta.jpg');background-repeat:repeat-y;
	max-width:1300px;
	margin-left: auto;
 	margin-right: auto;
	margin-bottom:0px;
}
#footer h5{
	font-weight:bold;
	font-size: 1.0em;
	color:#fff;
	padding-bottom:0.3em;
}
#footer p a{
	color:#cccccc;
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
}
#footer p a:hover{
	color:#ffff00;
}
#footer ul{
	font-size: 0.875em;
	padding-left:1.0em;
	color:#FFFFFF;
}
#footer ul li:before {
	color:#FF9900;
	content:"\2022";
	font-size:1.2em;
	padding-right:0.25em;position:relative;
	top:0.1em;
}
#footer ul li a{
	color:#ffffff;
}
#footer ul li a:hover{
	color:#FF9900;
}
#footer img{
	padding-right:15px;
}

.footer-left p,.footer-right p,.footer-middle p{font-size:1.0em;color:#CCCCCC;}
.footer-left a[href^="mailto:"],.footer-right a[href^="mailto:"],.footer-middle a[href^="mailto:"]{color:#ffff00;}
.footer-left a[href^="tel:"],.footer-right a[href^="tel:"],.footer-middle a[href^="tel:"]{color:#ffff00;}

.footer-left{float:left;
	margin-left:5px;
	margin-bottom:20px;
	text-align:left;
	width:24.975%;
	min-width:125px;
	max-width:150px;
}
.footer-middle{
	float:left;
	width:24.975%;
	min-width:125px;
	max-width:150px;
}
.footer-right p a{
	color:#FFFFFF;
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
}
.footer-right p a:hover{
	color:#FF0000;
}
.footer-right{
	float:right;
	margin-right:20px;
}
.tuotenelio{
	position:relative;
	width:96%;
	max-width:960px;
	margin:0px auto;
	margin-top: 0px;
	margin-right-value: auto;
	margin-bottom: 0px;
	margin-left-value: auto;
	margin-left-ltr-source: physical;
	margin-left-rtl-source: physical;
	margin-right-ltr-source: physical;
	margin-right-rtl-source: physical;
	text-align:center;
	}
	
.tuotenelio	img {
 width:100%;
	height: auto;
}

.kuvakeskitys{
	position:relative;
	width:100%;
	max-width:700px;
	margin:0px auto;
	margin-top: 0px;
	margin-right-value: auto;
	margin-bottom: 0px;
	margin-left-value: auto;
	margin-left-ltr-source: physical;
	margin-left-rtl-source: physical;
	margin-right-ltr-source: physical;
	margin-right-rtl-source: physical;
	text-align:center;
	}
	
.kuvakeskitys img {width:100%; max-width:100px; height: auto;}
	
.breakpoint{
	max-width: 24%;
	display: inline-block;
}

@media only screen and (max-width:1440px) and (min-width:1366px) {
	.wrap{
		width:85%;
	}
	.box2-info {
		width: 68%;
	}
	.header-left span {
		width: 831px;
		height: 446px;
		background-size: 100%;
	}
	#footer{
	padding-left:10%;
	}
	.footer-left {
		width:25%;
		margin-left:5px;
	}
	.footer-middle {
		width:25%;
	}
}
@media only screen and (max-width:1366px) and (min-width:1280px) {
	.wrap{
		width:85%;
	}
	.header-right {
		width: 52%;
	}
	.header-right p {
		width: 84%;
	}
	.header-left span {
		width: 831px;
		height: 446px;
		background-size: 100%;
	}
	.header {
		min-height: 300px;
	}
	.footer-left {
		width:25%;
	}
	.footer-middle {
		width:25%;
	}
}
@media only screen and (max-width:1280px) and (min-width:1024px) {
	.wrap{
		width:88%;
	}
	.header-right {
		width: 52%;
	}
	.header-right p {
		width: 84%;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 831px;
		height: 446px;
		background-size: 100%;
	}
	.header {
		min-height: 200px;
	}
	.header-right {
		margin-top: 10%;
	}
	.divice-fea-left-grid p {
		margin: 0.5em 0 0.5em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.6em;
	}
	.header-left span {
		width: 831px;
		height: 446px;
		background-size: 100%;
	}
	#footer{
	padding-left:10%;
	}
	.footer-left {
		width:25%;
		margin-left:5px;
	}
	.footer-middle {
		width:25%;
	}
}
@media only screen and (max-width:1024px) and (min-width:768px) {
	
	.navbar-header p {
		padding:15px 8px 0 10px;
		font-size:15px;
		font-style:italic;
	}
	.wrap{
		width: 90%;
	}
	.header-right {
		width: 52%;
	}
	.header-right p {
		width: 100%;
		font-size: 1.5em;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 831px;
		height: 397px;
		background-size: 100%;
	}
	.header {
		min-height: 100px;
		background-size: 100% 100%;
	}
	.header-right {
		margin-top: 7%;
	}
	.divice-fea-left-grid p {
		margin: 0.5em 0 0.5em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.5em;
	}
	.divice-fea-left {
		width: 54%;
	}
	.divice-fea-right{
		width: 44%;
	}
	.header-left {
		float: left;
		width: 40%;
	}
	#footer {
	padding-left:10%;
	}
	.footer-left {
		width:25%;
		margin-left:5px;
	}
	.footer-middle {
		width:25%;
	}
}
@media only screen and (max-width:768px) and (min-width:640px) {
	.wrap{
		width: 90%;
	}
	.header-right {
		width:100%;
	}
	.header-right p {
		width: 60%;
		font-size: 1.5em;
		margin: 0.5em auto 0.6em auto;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 337px;
		height: 397px;
		background-size: 100%;
	}
	.header {
		min-height: 100px; 
		background-size: 100% 100%;
	}
	.header-right {
		margin-top: 4%;
		text-align: center;
	}
	.divice-fea-left-grid p {
		margin: 0.5em 0 0.5em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.5em;
	}
	.divice-fea-left {
		float:none;
		width:100%;
	}
	.divice-fea-right{
		display:none;
		float:none;
	}
	.header-left {
		display:none;
	}
	.logo{
		display:none;
	}
	#footer {
	padding-left:10%;
	}
	.footer-left {
		width:25%;
		margin-left:5px;
		min-width:250px;
	}
	.footer-middle {
		width:25%;
		min-width:250px;
		margin-left:5px;
	}
}
@media only screen and (max-width:640px) and (min-width:480px) {
	.wrap{
		width: 90%;
	}
	.header-right {
		width:100%;
	}
	.header-right p {
		width: 62%;
		font-size: 1.5em;
		margin: 0.5em auto 0.6em auto;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 337px;
		height: 397px;
		background-size: 100%;
	}
	.header {
		min-height: 100px; 
		background-size: 100% 100%;
	}
	.header-right {
		margin-top: 4%;
		text-align: center;
	}
	.divice-fea-left-grid p {
		margin: 0.5em 0 0.5em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.5em;
	}
	.divice-fea-left {
		float:none;
		width:100%;
	}
	.divice-fea-right{
		display:none;
		float:none;
	}
	.header-left {
		display:none;
	}
	.logo{
		display:none;
	}
	.footer-left {
		width:50%;
		min-width:200px;
		margin-left:10px;
	}
	.footer-middle {
		width:50%;
		min-width:200px;
		margin-left:10px;
	}
	.footer-right {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
	}
}
@media only screen and (max-width:480px) and (min-width:320px) {
	.navbar-brand img{
		width:200px;
	}
	.navbar-header p {
		padding:14px 30px 0 25px;
		font-size:14px;
		font-style:italic;
	}
	.wrap{
		width: 90%;
	}
	.header-right {
		width:100%;
	}
	.header-right p {
		width: 80%;
		font-size: 1.2em;
		margin: 0.5em auto 0.6em auto;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 337px;
		height: 397px;
		background-size: 100%;
	}
	.header {
		min-height: 100px; 
		background-size: 100% 100%;
	}
	.header-right {
		margin-top: 4%;
		text-align: center;
	}
	.divice-fea-left-grid p {
		margin:0.4em 0 0.7em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.5em;
		font-size: 0.875em;
	}
	.divice-fea-left {
		float:none;
		width:100%;
	}
	.divice-fea-right{
		display:none;
		float:none;
	}
	.header-left {
		display:none;
	}
	.logo{
		display:none;
	}
	.divice-fea-left-grid h3 {
		font-size: 1.2em;
	}
	.footer-left {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
	}
	.footer-middle {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
	}
	.footer-right {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
	}
	.footer-left {
		width:100%;
	}
	.footer-middle {
		width:100%;
	}
}
@media only screen and (max-width:320px) and (min-width:240px) {
	.navbar-brand img{
		width:180px;
	}
	.navbar-header p {
		padding:14px 10px 0 25px;
		font-size:13px;
		font-style:italic;
	}
	.wrap{
		width: 90%;
	}
	.header-right {
		width:100%;
	}
	.header-right p {
		width: 100%;
		font-size: 1.1em;
		margin: 0.5em auto 0.6em auto;
	}
	.header-left {
		padding-top: 0%;
	}
	.header-left span {
		width: 337px;
		height: 397px;
		background-size: 100%;
	}
	.header {
		min-height: 100px;
		background-size: 100% 100%;
	}
	.header-right {
		margin-top: 4%;
		text-align: center;
	}
	.divice-fea-left-grid p {
		margin:0.4em 0 0.7em 0;
	}
	.divice-fea-left-grid p {
		line-height: 1.5em;
		font-size: 0.875em;
	}
	.divice-fea-left {
		float:none;
		width:100%;
	}
	.divice-fea-right{
		display:none;
		float:none;
	}
	.header-left {
		display:none;
		width:100%;
	}
	.logo{
		display:none;
	}
	.divice-fea {
		margin-top: 1em;
	}
	.divice-fea-left-grid h3 {
		font-size: 1.05em;
	}
	.footer-left {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
		margin-bottom:30px;
	}
	.footer-middle {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
		margin-bottom:30px;
	}
	.footer-right {
		margin:1em 1em;
		float: none;
		text-align:left;
		width:100%;
		margin-bottom:30px;
	}
}