@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&family=Roboto:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Satisfy&display=swap');

html{overflow-y:scroll;scroll-behavior:smooth;}
body{font-family:'Rubik',sans-serif;font-size:15px;color:#333;background-color:#f5f5f0;}
	@media(min-width:768px){
	body{font-size:16px;}
	}
p{margin:0 0 1.25em 0;padding:0;line-height:1.75em;}
	@media(min-width:768px){
	p{line-height:1.6em;}
	}
main li{line-height:1.75em;}
	@media(min-width:768px){
	main li{line-height:1.6em;}
	}
h1,h2,h3,h4,h5,h6{font-family:'Rubik',sans-serif;margin:0 0 .75em 0;padding:0;font-weight:bold;line-height:1.375em;color:#46557d;}
h2,h3,h4,h5,h6{font-weight:600;}
h1{font-weight:700;}
footer h2,footer h3,footer h4,footer h5,footer h6{color:#fff;}

h1 a,h1 a:active,h1 a:visited,h1 a:focus,h1 a:hover,
h2 a,h2 a:active,h2 a:visited,h2 a:focus,h2 a:hover,
h3 a,h3 a:active,h3 a:visited,h3 a:focus,h3 a:hover,
h4 a,h4 a:active,h4 a:visited,h4 a:focus,h4 a:hover,
h5 a,h5 a:active,h5 a:visited,h5 a:focus,h5 a:hover,
h6 a,h6 a:active,h6 a:visited,h6 a:focus,h6 a:hover
{color:#46557d;border-bottom:1px dotted #46557d;}

h1{font-size:2.125em;} h2{font-size:1.875em;} h3{font-size:1.5em;}
h4{font-size:1.25em;} h5{font-size:1.125em;} h6{font-size:1em;}
	@media(min-width:768px){
	h1{font-size:2.75em;} h2{font-size:2.25em;} h3{font-size:2em;}
	h4{font-size:1.75em;} h5{font-size:1.5em;} h6{font-size:1.25em;}
	}

a,a:link,a:active,a:visited,a:focus{color:#333399;outline:none;text-decoration:none;border:none;}
a:hover{color:#000066;border:none;}

#main a,#main a:link,#main a:active,#main a:visited,#main a:focus{
color:#333399;outline:none;text-decoration:none;border-bottom:1px dotted #333399;
}
#main a:hover{
color:#000066;border-bottom:1px solid #000066;
}
footer a,footer a:link,footer a:active,footer a:visited,footer a:focus{
color:#ccccff;outline:none;text-decoration:none;border:none;
}
footer a:hover{
color:#ccccff;border-bottom:1px solid #d7b46e;
}
.my-breadcrumb a,.my-breadcrumb a:link,.my-breadcrumb a:active,.my-breadcrumb a:visited,.my-breadcrumb a:focus,.my-breadcrumb a:hover{
border:none!important;
}
a.b-none,a.b-none:link,a.b-none:active,a.b-none:visited,a.b-none:focus,a.b-none:hover{
border:none!important;
}
img{
max-width:100%;width:auto;height:auto;
}
.center{
text-align:center;
}
.center-off-on768{
text-align:left;
}
	@media(min-width:768px){
	.center-off-on768{text-align:center;}
	}
.center-on-off768{
text-align:center;
}
	@media(min-width:768px){
	.center-on-off768{text-align:left;}
	}
p.johdanto-1-125{
font-size:1.125em;line-height:1.6em;
}
p.johdanto-1-25{
font-size:1.25em;line-height:1.6em;
}
.font-size-70-pros{font-size:70%!important;}
.font-size-80-pros{font-size:80%!important;}
.font-size-90-pros{font-size:90%!important;}
.font-size-100-pros{font-size:100%!important;}
.font-size-110-pros{font-size:110%!important;}
.font-size-120-pros{font-size:120%!important;}
.font-size-150-pros{font-size:150%!important;}
.font-size-2em-pros{font-size:2em!important;}
.font-normal{font-weight:normal;font-weight:400!important;}
.font-bold{font-weight:bold;font-weight:700!important;}
.font-black{font-weight:bold;font-weight:900!important;}
.info{display:block;margin:1em 0;padding:1em;border-radius:3px;}
.mwpx-1260{max-width:1260px;margin-right:auto;margin-left:auto;}
.mwpx-1220{max-width:1220px;margin-right:auto;margin-left:auto;}
.mwpx-1200{max-width:1200px;margin-right:auto;margin-left:auto;}
.mwpx-1100{max-width:1100px;margin-right:auto;margin-left:auto;}
.mwpx-1000{max-width:1000px;margin-right:auto;margin-left:auto;}
.bg-light-pink{background-color:#f6cbf6;}
.bg-light-grey{background-color:#d5d5d5;}
.bg-light-green{background-color:#99cccc;}
.bg-light-brown{background-color:#ffcc66;}
.bg-light-blue{background-color:#cdd5e4;}
.bg-light-grey-green{background-color:#bee1d2;}
.bg-light-beige{background-color:#e6dcc8;}
.color-basic-orange{color:#ffa500!important;}
.color-basic-blue{color:#46557d!important;}
.color-basic-light-blue{color:#c8d2e6!important;}
.color-basic-beige{color:#c8b996!important;}
.color-grey{color:#444;}
.color-grey-text{color:#333!important;}
div.clearfix{
display:inline-block;width:100%;margin:0;padding:0;color:transparent;background-color:transparent;
}
.item_anchor{
scroll-margin-top:15em;
}
	@media(min-width:992px){
	.item_anchor{scroll-margin-top:5em;}
	}
.row-flex{
display:flex;flex-wrap:wrap;
}
.my-text-shadow-basic01{
text-shadow:2px 2px 0 #151515;
}
.my-text-shadow-basic02{
text-shadow:0px 2px 4px rgba(0,0,50,.95);
}
ul.my-list{
list-style:none;list-style-type:none;padding-left:1.5em;padding-right:1.5em;
}
ul.my-list li{
text-indent:-1.75em;padding-left:1.25em;
}
ul.my-list li:before{
font-family:FontAwesome;content:"\f00c";padding-right:.75em;
}
#main ul.my-basic-list,#main ul.my-basic-list ul{
list-style-type:none;margin:0;padding:0 0 0 1.5em;
}
#main ul.my-basic-list li{
position:relative;line-height:1.75em;
}
#main ul.my-basic-list li:before{
position:absolute;font-family:FontAwesome;content:"\f105";color:#333;left:-1em;
}
	@media(min-width:576px){
	#main ul.my-basic-list,#main ul.my-basic-list ul{padding:0 0 0 2.5em;}
	}
.bg-bottom-grey-and-img{
background:#d5d5d5 url(../img/bg-bottom-1920w.webp) no-repeat center;background-size:cover;
}
	@media(min-width:992px){
	.bg-bottom-grey-and-img{background-image:url(../img/bg-bottom-1920w.webp);}
	}
.bg-bottom-grey-and-img-second{
background:#d5d5d5 url(../img/bg-bottom-600w.webp) no-repeat center;background-size:cover;
}
	@media(min-width:576px){
	.bg-bottom-grey-and-img-second{background-image:url(../img/bg-bottom-800w.webp);}
	}
	@media(min-width:768px){
	.bg-bottom-grey-and-img-second{background-image:url(../img/bg-bottom-1000w.webp);}
	}
	@media(min-width:992px){
	.bg-bottom-grey-and-img-second{background-image:url(../img/bg-bottom-1920w.webp);}
	}
div.bg-transparent h2{
font-size:1.5em;margin:0;padding:0;
}
	@media(min-width:576px){
	div.bg-transparent h2{font-size:1.75em;}
	}
	@media(min-width:768px){
	div.bg-transparent h2{font-size:2em;}
	}
	@media(min-width:992px){
	div.bg-transparent h2{font-size:2.25em;}
	}
.bg-bottom-grey{background-color:#d5d5d5;}
.bg-transparent{background:transparent;}
.color-white{color:white;}
p.brochures a{margin-right:.75em;margin-left:.1em;}
.bg-lightgray{background-color:#e5e5e5;}
.bg-black{background-color:#000;}
.bg-gray-151515{background-color:#151515;}
div#my-info-bar{border-bottom:10px solid #410005;}
.clearfix{float:left;display:block;clear:both;}
.fa-at{padding-right:1px;padding-left:1px;}
.fa span{font-family:'Rubik',sans-serif;font-weight:700;}

a.click-to-call{
pointer-events:default;cursor:hand;color:#333399;border:0;
}
a.click-to-call:hover{
color:#000066;border-bottom:1px dotted #000066;
}
	@media(min-width:992px){
	a.click-to-call{pointer-events:none;cursor:default;color:#333!important;border:0;}
	a.click-to-call:hover{color:#333;border:0;}
	}
footer a.click-to-call{pointer-events:auto;cursor:pointer;color:#ccccff;border:0;}
footer a.click-to-call:hover{color:#ccccff;border-bottom:1px dotted #ccccff;}
	@media(min-width:992px){
	footer a.click-to-call{pointer-events:none;cursor:default;color:#fff!important;border:0;}
	footer a.click-to-call:hover{color:#fff;border:0;}
	}
.card{border:0;border-radius:0;}
p.info{margin-right:auto;margin-left:auto;}
.bg-img-darken-100{filter:brightness(100%);}
.bg-img-darken-50{filter:brightness(50%);}
p.some-buttons{text-align:center}
	@media(min-width:992px){
	p.some-buttons{text-align:center}
	}
ul.product-list{
display:block;margin:0;padding:0;text-align:left;
}
ul.product-list li{
display:inline-block/*if y want single column, change this 'block'*/;width:auto;margin:0 0 0 2em;padding:0;line-height:1.75em;word-break:break-word;white-space:normal;color:white;text-indent:-1.7em;
}
ul.product-list li::before{
font-family:FontAwesome;content:"\f00c";font-size:1em;margin:0;padding:0 .25em 0 .4em;color:white;
}
	@media(min-width:576px){
	ul.product-list{display:block;}
	ul.product-list li{display:inline-block;}
	}
	@media(min-width:768px){
	ul.product-list{text-align:center;padding:0 1.5em;}
	ul.product-list li{display:inline;margin:0 0.15em;}
	}
hr{
width:100%;margin:1em auto;border-top:1px dotted #46557d;
}
.my-shadow{
box-shadow:0 5px 10px 3px rgba(0,0,0,.25);
}
.my-shadow-top{
box-shadow:0 5px 30px 40px rgba(50,50,80,.85);
}
	@media(min-width:992px){
	.my-shadow-top{-webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;}
	}
/*--------------------------------
---BASIC-ANIMATIONS---
--------------------------------*/
@keyframes fadeIn{from{opacity:0;} to{opacity:1;}}
.fade-in{opacity:0;animation:fadeIn ease-in 1;animation-fill-mode:forwards;}
.fade-in.one{animation-delay:0s;animation-duration:1s;}
.fade-in.two{animation-delay:.5s;animation-duration:1s;}
.fade-in.box-01{animation-delay:0s;animation-duration:.5s;}
.fade-in.box-02{animation-delay:0s;animation-duration:.5s;}
.fade-in.box-03{animation-delay:0s;animation-duration:.5s;}
	@media(min-width:768px){
	.fade-in.box-01{animation-delay:0s;animation-duration:.85s;}
	.fade-in.box-02{animation-delay:.2s;animation-duration:.85s;}
	.fade-in.box-03{animation-delay:.4s;animation-duration:.85s;}
	}
/*--------------------------------
---BASIC-ANIMATIONS-end---
--------------------------------*/
/*--------------------------------
---BACK-TO-TOP-BUTTON---
--------------------------------*/
.back-to-top{
position:fixed;display:none;right:15px;bottom:15px;padding:6px 12px 9px 12px;
font-size:16px;transition:background .5s;border-radius:2px;color:#fff!important;background:rgba(0,0,0,.2);
}
.back-to-top:focus{
outline:none;color:#fff;background:rgba(0,0,0,.2);
}
.back-to-top:hover{
color:#fff;background:rgba(0,0,0,.75);
}
/*--------------------------------
---BACK-TO-TOP-BUTTON-end---
--------------------------------*/
/*--------------------------------
---face-app---
--------------------------------*/
div#face-app{
float:left;width:100%;padding:20px 2.5%;border-top:1px solid #b0bbd9;border-bottom:1px solid #b0bbd9;
clear:both;overflow:hidden;background:white;
}
div.face-app-wrapper{
display:table;width:500px;margin:0 auto;
}
	@media all and (max-width:499px){
	div.face-app-wrapper{width:100%;}
	}
/*--------------------------------
---face-app-end---
--------------------------------*/
/*--------------------------------
---gradients---
--------------------------------*/
.my-hero-grad-black{
background:transparent;
background: -moz-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.80) 20%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.9)), color-stop(20%, rgba(0,0,0,0.80)), color-stop(100%, rgba(0,0,0,0)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.80) 20%, rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.80) 20%, rgba(0,0,0,0) 100%);
}
.my-hero-grad-white{
background:transparent;
background: -moz-linear-gradient(top, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.80) 20%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0.9)), color-stop(20%, rgba(255,255,255,0.80)), color-stop(100%, rgba(255,255,255,0)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.80) 20%, rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.80) 20%, rgba(255,255,255,0) 100%);
}
.my-hero-grad-orange{
background:transparent;
background: -moz-linear-gradient(top, rgba(255,204,0,0.9) 0%, rgba(255,204,0,0.80) 20%, rgba(255,204,0,0) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,204,0,0.9)), color-stop(20%, rgba(255,204,0,0.80)), color-stop(100%, rgba(255,204,0,0)));
background: -webkit-linear-gradient(top, rgba(255,204,0,0.9) 0%, rgba(255,204,0,0.80) 20%, rgba(255,204,0,0) 100%);
background: linear-gradient(to bottom, rgba(255,204,0,0.9) 0%, rgba(255,204,0,0.80) 20%, rgba(255,204,0,0) 100%);
}
/*--------------------------------
---gradients-end---
--------------------------------*/
/*--------------------------------
---HEADER---
--------------------------------*/
#header{
position:fixed;top:0;right:0;left:0;padding:30px 0;transition:all .5s;z-index:997;
}
header#header{
min-width:320px;padding:0;background-color:transparent;
}
	@media(min-width:992px){
	header#header{background-color:rgba(60,60,90,.95);padding:12px 0 6px 0;}
	}
	@media(min-width:992px){
	#header.header-fixed{padding-top:6px;padding-bottom:0;transition:all .5s;background-color:rgba(60,60,90,.5);}
	}
#header .container-fluid{
position:relative;display:block;margin-right:auto;margin-left:auto;max-width:100%;
min-width:320px;
}
/*--------------------------------
---HEADER-end---
--------------------------------*/
/*--------------------------------
---HERO---
--------------------------------*/

#hero{
position:relative;display:block;width:100%;min-width:320px;height:auto;text-align:center;
}
	
#hero::before{
content:"";position:absolute;top:0;left:0;width:100%;height:100%;
background-color:#9edcf5;background-image:url(../img/bg-top-1000w.webp);
background-repeat:no-repeat;background-position:center top;
background-size:cover;
}
	@media(min-width:576px){
	#hero::before{background-image:url(../img/bg-top-1000w.webp);
	background-position:center top;
	background-size:cover;}
	}
	@media(min-width:768px){
	#hero::before{background-image:url(../img/bg-top-1000w.webp);
	background-size:cover;}
	}
	@media(min-width:992px){
	#hero::before{background-image:url(../img/bg-top-1920w.webp);
	background-size:1600px 1067px;}
	}
	@media(min-width:1920px){
	#hero::before{background-image:url(../img/bg-top-1920w.webp);
	background-size:1600px 1067px;}
	}
#hero .top-content-filter{
position:absolute;width:100%;height:100%;background-color:rgba(0,0,0,0);
}
#hero .hero-container{
position:relative;display:block;max-width:1220px;margin:0 auto;padding:80px 1em 30px 1em;text-align:center;
}
	@media(min-width:768px){
	#hero .hero-container{padding:80px 3em 45px 3em;}
	}
	@media(min-width:992px){
	#hero .hero-container{padding:80px 3em 75px 3em;}
	}
		/*-----------BASIC-TOP-SLOGAN----------*/
#hero .hero-container .slogan-bg{
display:block;width:100%;margin:0 auto;padding:.25em;
}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg{display:block;width:100%;padding:1em .5em;}
	}
		/*-----------BASIC-TOP-SLOGAN-end----------*/	
		/*-----------ETUSIVU-TOP-SLOGAN----------*/
#etusivu #hero .hero-container .slogan-bg{
display:block;width:auto;max-width:992px;padding:1em 0;background:transparent;
	}
	@media(min-width:768px){
	#etusivu #hero .hero-container .slogan-bg{padding:1em;}
	}
	@media(min-width:992px){
	#etusivu #hero .hero-container .slogan-bg{padding:2em;}
	}
div.slogan-text{position:relative;display:block;padding:10px 0;}
	@media(min-width:576px){
	div.slogan-text{position:relative;padding:10px 50px;}
	}
.slideInDown{
-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none;
}
	@media(min-width:992px){
	.slideInDown{animation-name:slideInDown;}
	.slideInDown{animation-duration:1.5s;animation-fill-mode:both;animation-delay:1s;}
	}
	@keyframes slideInDown{from{margin-top:-200px;opacity:0;} to{margin-top:0;opacity:1;}
	}
@keyframes zoomIn{from{opacity:0;transform:scale3d(0.2,0.2,0.2);} 50%{opacity:0.5;}}
.zoomIn{animation-name:zoomIn;}
.animated{animation-duration:1s;animation-fill-mode:both;animation-delay:.25s;}
		/*-----------ETUSIVU-TOP-SLOGAN-end----------*/
		/*-----------TOP-SLOGAN-H2-H3----------*/
#hero .hero-container .slogan-bg h2,#hero .hero-container .slogan-bg h3{
margin:0;padding:0;line-height:1.5em;max-width:1220px;color:#fff;
}
#hero .hero-container .slogan-bg h2{
font-weight:bold;font-weight:800;text-shadow:0px 2px 4px rgba(0,0,50,.95);
}
#hero .hero-container .slogan-bg h3{
font-weight:bold;font-weight:600;text-shadow:0px 2px 4px rgba(0,0,50,.95);
}
#hero .hero-container .slogan-bg h2{
font-size:2em;line-height:1.5em;
}
	@media(min-width:576px){
	#hero .hero-container .slogan-bg h2{font-size:2.25em;line-height:1.5em;}
	}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg h2{font-size:2.75em;line-height:1.5em;}
	}
	@media(min-width:992px){
	#hero .hero-container .slogan-bg h2{font-size:3.25em;line-height:1.5em;}
	}
#hero .hero-container .slogan-bg h2 span{
font-size:60%;line-height:1.5em;
}
#hero .hero-container .slogan-bg h3{
font-size:1em;line-height:1.5em;margin:.5em 0;
}
	@media(min-width:576px){
	#hero .hero-container .slogan-bg h3{font-size:1.0625em;line-height:1.5em;}
	}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg h3{font-size:1.125em;line-height:1.5em;}
	}
	@media(min-width:992px){
	#hero .hero-container .slogan-bg h3{font-size:1.25em;line-height:1.5em;}
	}
#hero .hero-container .slogan-bg h3.spc2{
font-size:1.25em;
}
	@media(min-width:576px){
	#hero .hero-container .slogan-bg h3.spc2{font-size:1.5em;}
	}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg h3.spc2{font-size:1.75em;}
	}
	@media(min-width:992px){
	#hero .hero-container .slogan-bg h3.spc2{font-size:2em;}
	}
#hero .hero-container .slogan-bg h3.button{
display:inline-block;width:100%;max-width:240px;min-width:220px;color:white;background-color:rgba(255,150,50,1);margin-right:.15em;margin-left:.15em;padding:9px 20px;border-radius:2em;border:none;
box-shadow:0 10px 14px 0 rgba(0,0,0,.15);
}
	@media(min-width:576px){
	#hero .hero-container .slogan-bg h3.button{display:inline-block;width:auto;max-width:300px;min-width:300px;}
	}
	#hero .hero-container .slogan-bg h3.button:hover{
	background-color:rgba(255,170,90,1);
    box-shadow:0 10px 14px 0 rgba(0,0,0,.35);
	}

#hero .hero-container .slogan-bg p{
margin:0;padding:0;line-height:1em;
}
#hero .hero-container .slogan-bg h3 a{
color:#fff;border:0;
}
#hero .hero-container .slogan-bg h3 a:hover{
color:#fff;border-bottom:0px dotted #ffcc99;
}
#hero .hero-container .slogan-bg h3 a.click-to-call-slogan{
pointer-events:auto;cursor:pointer;color:#ffcc99;border:0;
}
#hero .hero-container .slogan-bg h3 a.click-to-call-slogan:hover{
color:#ffcc99;border-bottom:1px dotted #ffcc99;
}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg h3 a.click-to-call-slogan{pointer-events:none;cursor:default;color:#fff;border:0;}
	#hero .hero-container .slogan-bg h3 a.click-to-call-slogan:hover{color:#fff;border:0;}
	}
#hero .hero-container .slogan-bg h3.button a.click-to-call-slogan{
pointer-events:auto;cursor:pointer;color:#fff;border:0;
}
#hero .hero-container .slogan-bg h3.button a.click-to-call-slogan:hover{
color:#ffcc99;border-bottom:1px dotted #fff;
}
	@media(min-width:768px){
	#hero .hero-container .slogan-bg h3.button a.click-to-call-slogan{pointer-events:none;cursor:default;color:#fff;border:0;}
	#hero .hero-container .slogan-bg h3.button a.click-to-call-slogan:hover{color:#fff;border:0;}
	}
		/*-----------TOP-SLOGAN-H2-end----------*/
		/*ota-yhteytta-nappula*/
#hero .btn-get-started{
display:inline-block;margin:0 auto 10px auto;padding:10px 0;font-family:'Rubik',sans-serif;font-size:1.25em;font-weight:800;
text-transform:uppercase;border-radius:5px;letter-spacing:.25px;transition:.5s;color:#fff;background:#908900;
}
	@media(min-width:768px){
	#hero .btn-get-started{margin:10px auto;padding:10px 0;font-size:1.5em;font-weight:900;}
	}
#hero .btn-get-started:hover{
color:#474300;background:#fff200;
}
#hero p.btn-get-started a{
margin:0;padding:10px 40px;color:#fff;font-weight:900;background:transparent;
}
#hero .btn-get-started:hover a{
color:#474300;
}
#hero p.hero-btn-second a{
pointer-events:auto;cursor:pointer;
}
	@media(min-width:768px){
	#hero p.hero-btn-second a{pointer-events:none;cursor:default;}
	}
/*--------------------------------
---HERO-end--
--------------------------------*/
/*--------------------------------
---LOGO-FOR-BASIC-PAGE---
--------------------------------*/
div#logo{
position:absolute;display:inline-block;left:5%;margin:0;padding:0;
}
img.logo{
max-width:96%;height:auto;max-height:33px;margin-top:16px;padding:2px 70px 2px 2px;background-color:transparent;
}
	@media(min-width:768px){
	img.logo{max-height:36px;margin-top:15px;}
	}
	@media(min-width:992px){
	img.logo{max-height:38px;margin-top:6px;}
	}
div.logo-img{
float:left;
}
div.logo-txt{
float:left;
}
div.logo-txt h4{
font-family:'Roboto Condensed',Sans-serif;font-size:.75em;margin:15px 2px 0 2px;
}
	@media(min-width:768px){
	div.logo-txt{float:left;}
	div.logo-txt h4{font-family:'Roboto Condensed',Sans-serif;font-size:.937em;margin:20px 2px 0 2px;}
	}
	@media(min-width:992px){
	div.logo-txt{float:left;}
	div.logo-txt h4{font-family:'Roboto Condensed',Sans-serif;font-size:1.125em;margin:25px 5px 0 5px;}
	}
/*--------------------------------
---LOGO-FOR-BASIC-PAGE-end---
--------------------------------*/
/*--------------------------------
---BREADCRUMB---
--------------------------------*/
section.my-breadcrumb,div.my-breadcrumb{
margin:0;padding:0;text-align:center;
}
	@media(min-width:992px){
	section.my-breadcrumb,div.my-breadcrumb{margin-top:-46px;margin-bottom:2em;padding:0;text-align:center;}
	}
section.my-breadcrumb .container-fluid,div.my-breadcrumb .container-fluid{
display:inline-block;max-width:1220px;background-color:#f5f5f0;
}
section.my-breadcrumb ol.breadcrumb,div.my-breadcrumb ol.breadcrumb{
padding:1em .25em;background-color:transparent;
}
/*--------------------------------
---BREADCRUMB-end---
--------------------------------*/
/*--------------------------------
---MAIN-CONTENT---
--------------------------------*/	
main#main{
position:relative;width:100%;min-width:320px;height:auto;min-height:10px;word-break:break-word;
}
div.main-bg{
position:absolute;top:55px;width:100%;height:100%;margin:0;padding:0;
background:#f5f5f0;z-index:-1;
}

		/*---------sections---------*/
section,div,div.content-section{
width:100%;margin:0;padding:0;word-wrap:break-word;
}
.container-fluid{position:relative;padding-right:1.5em;padding-left:1.5em;}
	@media(min-width:768px){
	.container-fluid{padding-right:4%;padding-left:4%;}
	}
section .container-fluid,footer .container-fluid,div.content-section .container-fluid{
display:table;max-width:576px;margin-right:auto;margin-left:auto;
}
	@media(min-width:768px){
	section .container-fluid,footer .container-fluid,div.content-section .container-fluid{max-width:1220px;}
	}
section#main-content{
margin-top:0;margin-bottom:0;padding-top:0;
}
	@media(min-width:768px){
	section#main-content{margin-top:0;padding-top:0;}
	}
	
section#main-content h3 span{
padding-right:1em;padding-left:.5em;line-height:1.75em;white-space:nowrap;
}
section#main-content h3 a:link{
border:0;
}
section#main-content h3 a:hover{
border-bottom:1px dotted #46557d;
}
section#main-content .container-fluid{
padding-top:0;padding-bottom:0;max-width:1220px;
}
	@media(min-width:768px){
	section#main-content .container-fluid{padding-top:0;}
	}
#yhteystiedot #main-content .container-fluid{
background-image:none;
}
	@media(min-width:768px){
	#main-content .container-fluid{background-position:100px 50px;}
	}
	@media(max-width:768px){
	#main-content .container-fluid,#main-content .container-fluid .row .col-lg-9{padding-top:0!important;padding-bottom:0!important;}
	}
/*--------------------------------
---MAIN-CONTENT-end---
--------------------------------*/
/*--------------------------------
---SECTION-MAIN-HEADER---
--------------------------------*/
section.main-header{
background-color:rgba(5,5,5,.25);padding:0;
}
	@media(min-width:768px){
	section.main-header{background-color:rgba(5,5,5,.5);}
	}
section.main-header h2{
color:#fff;margin:.25em 0;padding:0;text-align:center;
}
/*--------------------------------
---SECTION-MAIN-HEADER-end--
--------------------------------*/
/*--------------------------------
---BASIC-CONTENT---
--------------------------------*/
section#basic-content{
background-color:#fff;padding-top:1.5em;padding-bottom:0;
}
	@media(min-width:768px){
	section#basic-content{background:#fff;padding-top:1.5em;padding-bottom:2.25em;}
	}
section#basic-content .container-fluid{
margin-top:0;padding-top:0;padding-bottom:0;background-color:#fff;max-width:600px;
}
	@media(min-width:768px){
	section#basic-content .container-fluid{max-width:1134px;margin-top:0;padding-top:2em;padding-bottom:2em;}
	}
	@media(min-width:1240px){
	section#basic-content .container-fluid{margin-top:.75em;box-shadow:0 8px 30px 0 rgba(50,50,90,0.25);}
	}
/*--------------------------------
---BASIC-CONTENT-end---
--------------------------------*/
/*--------------------------------
---SECTION-BASIC-GALLERY---
--------------------------------*/
section#basic-gallery{
padding-top:1.5em;padding-bottom:1.5em;background-color:#e5e5e5;
}
	@media(min-width:768px){
	section#basic-gallery{padding-top:1.5em;padding-bottom:2.25em;}
	}
section#basic-gallery .container-fluid{
margin-top:0;padding-top:0;padding-bottom:2em;max-width:1220px;
}
	@media(min-width:768px){
	section#basic-gallery .container-fluid{margin-top:0;padding-top:3em;padding-bottom:2em;}
	}
/*--------------------------------
---SECTION-BASIC-GALLERY-end---
--------------------------------*/
/*--------------------------------
---DIV-BOTTOM---
-------------------------------*/
div#bottom{
position:relative;display:block;width:100%;height:auto;text-align:center;
background:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),url(../img/blanco.webp) repeat center top;
}
	@media(min-width:768px){
	div#bottom{	background:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),url(../img/blanco.webp) no-repeat center top;background-size:cover;}
	}
#bottom-navi{
background-color:#410005;
}
#bottom-navi a:hover{
color:#fff;
}
/*--------------------------------
---DIV-BOTTOM-end---
--------------------------------*/
/*--------------------------------
---SECTION-BOTTOM-CONTENT---
--------------------------------*/
section#bottom-content h3 span{
line-height:1.75em;white-space:nowrap;
}
section#bottom-content h3 a:link{
border:0;margin-right:.5em;margin-left:.5em;
}
section#bottom-content h3 a:hover{
border-bottom:1px dotted #46557d;
}
section#bottom-content .es-bottom-header-container{position:absolute;bottom:0;width:100%;background-color:rgba(5,5,5,.25);}
section#bottom-content .es-bottom-header-container h4{color:white;margin:.5em;}
section#bottom-content hr.my-bottom-links-top{margin-top:0;}
section#bottom-content hr.my-bottom-links-bottom{margin-bottom:1.5em;}
/*--------------------------------
---SECTION-BOTTOM-CONTENT-end---
--------------------------------*/
/*--------------------------------
---TUOTTEET-SECTION---
--------------------------------*/
section#main-content ul.tuotteet{
display:inline-block;width:100%;margin-bottom:.5em;
}
section#main-content ul.tuotteet li{
float:left;width:100%;padding-right:1.5em;font-size:1.125em;
}
	@media(min-width:768px){
	section#main-content ul.tuotteet li{float:left;width:50%;padding-right:1.5em;font-size:1.125em;}
	}
#tuotteet-img.col-lg-3{
display:block;flex:none;width:100%;max-width:500px;height:auto;max-height:100%;margin:0 auto;
}
#tuotteet-img img{max-width:100%;height:auto;max-height:100%;}
	@media(min-width:992px){#tuotteet-img.col-lg-3{flex:auto;max-width:25%;}
	}
#tuotteet-img p{
position:relative;background-color:#c31441;
}
#tuotteet-img p a span{
position:absolute;top:2px;left:2px;font-size:.875em;font-weight:normal;font-weight:500;
color:#ddd1bf;background-color:#444444;padding-right:5px;padding-left:5px;
}
	@media(min-width:992px){
	#tuotteet-img p a span{top:2px;left:2px;font-size:.75em}
	}
#tuotteet-img p a span:hover{
color:#fff;background-color:#555;
}
#tuotteet-img p a.current{pointer-events:none;cursor:default;}
#tuotteet-img p a span:before{font-family:FontAwesome;content:"\f0c1";margin-right:.35em;}
#tuotteet-img p a.current span:before{content:"\f054";}
#tuotteet-img p a.current span{
color:#eee;background-color:#c31441;padding-right:5px;padding-left:5px;
}
	@media(min-width:992px){
	#tuotteet-img p a.current span{top:2px;left:2px;}
	}
#tuotteet-img p a img{
position:relative;border:2px solid #444444;
}
#tuotteet-img p a.current img{
position:relative;border:2px solid #c31441;
}
h3.slogan-main{
margin-left:0;margin-top:3em;color:#ddd;line-height:1.5em;
}
	@media(min-width:992px){
	h3.slogan-main{margin-left:3em;margin-top:3em;color:#ddd;line-height:1.5em;}
	}
h3.slogan-main span{
margin-top:3em;margin-left:auto;color:#ff9900;
}
	@media(min-width:768px){
	h3.slogan-main span{margin-left:3em;}
	}
/*--------------------------------
---TUOTTEET-SECTION-end---
--------------------------------*/
/*--------------------------------
---CONTACT-SECTION-AND-FORM---
--------------------------------*/	
#contact{padding:80px 0 40px 0;background:#f7f7f7;}
#contact #google-map{height:300px;margin-bottom:20px;}
#contact .info{color:#333;}
#contact .info i{float:left;font-size:32px;color:#6666cc;}
#contact .info p{margin-bottom:20px;padding:0 0 10px 50px;font-size:14px;line-height:22px;}
#contact .info .email p{padding-top:5px;}
#contact .social-links{padding-bottom:20px;}
#contact .social-links a{
display:inline-block;width:36px;height:36px;padding:8px 0;font-size:18px;line-height:1em;
text-align:center;color:#fff;background:#333;border-radius:50%;transition:.3s;
}
#contact .social-links a:hover{color:#fff;background:#6666cc;}
#contact .form #sendmessage{
display:none;margin-bottom:15px;padding:15px;text-align:center;font-weight:700;
color:#6666cc;border:1px solid #6666cc;
}
#contact .form #errormessage{
display:none;margin-bottom:15px;padding:15px;text-align:center;font-weight:700;color:red;border:1px solid red;
}
#contact .form #sendmessage.show, #contact .form #errormessage.show, #contact .form .show{display:block;}
#contact .form .validation{display:none;margin:0 0 20px;font-size:13px;font-weight:400;color:red;}
#contact .form input, #contact .form textarea{font-size:14px;border-radius:0;box-shadow:none;}
#contact .form button[type="submit"]{padding:10px 24px;color:#fff;background:#555;border:0;transition:.4s;}
#contact .form button[type="submit"]:hover{background:#656565;}
/*--------------------------------
---CONTACT-SECTION-AND-FORM-end---
---------------------------------*/
/*--------------------------------
---STAFF---
---------------------------------*/
div.staff .card{background-color:transparent;}
div.staff .card-img-top{display:block;margin:0 auto;width:172px;height:200px;}
div.staff .card-body{text-align:center;}
div.staff .polygon-shape{clip-path: polygon(50% 1%, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);}
/*--------------------------------
---STAFF-end---
---------------------------------*/
/*--------------------------------
---FOOTER---
---------------------------------*/
#footer{
font-size:1em;min-width:320px;padding:30px 0;color:#eee;background-color:#3d3d59;
}
#footer p{font-weight:400;margin:0;padding:1em 0 0 0;text-align:center;}
#footer p,#footer li,#footer a{font-size:100%;}
footer a:link,footer a:visited,footer a:active,footer a:focus{text-decoration:none;color:#f8f8ff;border-bottom:1px dotted #f8f8ff;}
footer a:hover{text-decoration:none;color:#f8f8ff;border-bottom:1px solid #f8f8ff;}
#footer .copyright{text-align:center;}
#footer .credits{padding-top:10px;text-align:center;font-size:13px;color:#ccc;}
#footer .card{background:transparent;height:auto;margin:0;}
	@media(min-width:768px){
	#footer .card{padding:10px;}
	}
#footer .card-body{margin:0;padding:0;}
#footer .card-body h4{text-align:left;}
#footer .card-body p{text-align:left;margin:0;padding:0;}
#footer .card-body ul{width:100%;text-align:left;list-style:none;padding:0;}
#footer .card-body li{margin-left:20px;line-height:2.25em;}
	@media(min-width:768px){
	#footer .card-body li{line-height:1.75em;}
	}
#footer .card-body.sec-01 li{margin-left:0;}
#footer .card-body.sec-02 li{display:inline-block;line-height:1.6em;}
#footer .card-body li:before{font-family:FontAwesome;content:"\f105";margin-left:-1em;padding-right:.5em;}
#footer .card-body.sec-01 li:before{display:none;}
#footer a.click-to-call{pointer-events:auto;cursor:pointer;color:#f8f8ff;border-bottom:1px dotted #f8f8ff;}
#footer a.click-to-call:hover{color:#f8f8ff;border-bottom:1px solid #f8f8ff;}
	@media(min-width:992px){
	#footer a.click-to-call{pointer-events:none;cursor:default;color:#fff;border:0;}
	#footer a.click-to-call:hover{color:#fff;border:0;}
	}
/*---FOOTER-NAVI---*/
div.footer_navi{
display:inline-block;width:100%;height:auto;margin:1em 0 1em 0;padding:0;line-height:1em;
}
div.footer_navi ul{
display:block;width:100%;height:auto;margin:0;padding:0;text-align:center;line-height:1em;
}
div.footer_navi  ul li a{
display:block;margin:0 .5em;padding:.35em 1em;font-size:.875em;font-weight:500;text-transform:uppercase;background-color:#353535;
}
div.footer_navi  ul li a:hover{border:0;}
	@media(min-width:576px){div.footer_navi  ul li a{padding:.35em 1em;font-size:1em;}
	}
#etusivu div.footer_navi ul li a{
display:block;margin:0 .5em;padding:8em 1em .35em 1em;font-size:.875em;font-weight:500;text-transform:uppercase;
background:#444444 url('../img/blanco.webp') no-repeat center 20px;background-size:55%!important;
}
#etusivu div.footer_navi  ul li a:hover{border:0;}
	@media(min-width:576px){#etusivu div.footer_navi ul li a{padding:8em 1em .35em 1em;font-size:1em;}
	}
#etusivu div.footer_navi ul li a.tuote-01{background:#444444 url('../img/blanco.webp') no-repeat center 20px;}
#etusivu div.footer_navi ul li a.tuote-02{background:#444444 url('../img/blanco.webp')no-repeat center 20px;}
#etusivu div.footer_navi ul li a.tuote-03{background:#444444 url('../img/blanco.webp')no-repeat center 20px;}
#etusivu div.footer_navi ul li a.tuote-04{background:#444444 url('../img/blanco.webp')no-repeat center 20px;}
#etusivu div.footer_navi ul li a.tuote-05{background:#444444 url('../img/blanco.webp')no-repeat center 20px;}
	/*---FOOTER-NAVI-end---*/
/*--------------------------------
---FOOTER-end---
---------------------------------*/
/*--------------------------------
---CONTACT-FORM---
---------------------------------*/
div.my-form{width:100%;max-width:700px;margin:10px auto 0 auto;}
div.my-form label{display:block;width:100%;margin:1em 0 -1.25em 0;padding:0;font-size:.875em;text-align:center;line-height:1em;}
div.my-form label span{font-size:.75em;font-style:italic;}
div.my-form p{font-family:'Rubik',Sans-serif;font-size:.875em;margin:0;padding:0;text-align:center;}
div.my-form input,div.my-form textarea{font-family:'Rubik',Sans-serif;font-size:.875em;
width:100%;margin:0;padding:12px 10px;border-radius:2px;background:#fff;border:1px solid #bbb;}
div.my-form textarea{resize:none;}
div.my-form input[type="radio"]{width:auto;border:0}
div.my-form input[type="submit"]{width:auto;margin-top:20px;padding:10px 80px;color:#fff;background-color:rgba(255,150,50,1);
border:0;font-size:1em;font-weight:bold;border-radius:25px}
div.my-form input[type="submit"]:hover{background-color:rgba(255,170,90,1);cursor:pointer;}
*:focus{outline:none}
div.my-form input:focus,div.my-form textarea:focus{background-color:#ffffcc;border:1px solid orange;}
/*--------------------------------
---CONTACT-FORM-end--
---------------------------------*/
a.b-none-rsp,a.b-none-rsp:link,a.b-none-rsp:active,a.b-none-rsp:visited,a.b-none-rsp:focus{
color:#333399;border-bottom:1px dotted #333399;
}
a.b-none-rsp:hover{
color:#000066;border-bottom:1px dotted #000066;
}
	@media(min-width:992px){
	a.b-none-rsp,a.b-none-rsp:link,a.b-none-rsp:active,a.b-none-rsp:visited,a.b-none-rsp:focus,a.b-none-rsp:hover{color:#333;border:none!important;}
	}
div.mw-1260{
max-width:1260px!important;
}
.my-padding-t8-b7{
padding-top:8rem;padding-bottom:7rem;
}

.my-padding-t5-b4{
padding-top:5rem;padding-bottom:3.5rem;
}

.my-padding-t2-b2{
padding-top:2rem;padding-bottom:2rem;
}

/*--------------------------
VARI-FIX
--------------------------*/
header#header{
background-color:transparent;
}
	@media(min-width:992px){
	header#header{background-color:rgba(49,40,136,1);}
	}
	@media(min-width:992px){
	#header.header-fixed{background-color:rgba(49,40,136,.5);}
	}
#footer{
background-color:#312888;
}
h1,h2{
color:#312888;
}
h3,h4,h5,h6{
color:#333;
}
.my-shadow-top{
box-shadow:0 0 0 63px rgba(49,40,136,1);
}
	@media(min-width:992px){
	.my-shadow-top{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
	}
#hero .hero-container .slogan-bg h2{
color:#312888;
}
#hero .hero-container .slogan-bg h3{
color:#312888;
}
#hero .hero-container .slogan-bg h2{
text-shadow:
0px 3px 15px rgba(255,255,255,.5),0px -3px 15px rgba(255,255,255,.5),
3px 0px 15px rgba(255,255,255,.5),-3px 0px 15px rgba(255,255,255,.5);
}
#hero .hero-container .slogan-bg h3{
text-shadow:none;
}
#hero .hero-container .slogan-bg h3.button{
color:white;background-color:rgba(255,150,50,1);text-shadow:none;
}
	#hero .hero-container .slogan-bg h3.button:hover{
	background-color:rgba(255,170,90,1);
	}
.slogan-bg h2 a{
color:#312888;border:none;
}
ul.my-ul-list{
width:102%;margin:0 1% 0 -1%;padding:0;list-style:none;
}
ul.my-ul-list li{
display:inline-block;float:left;width:calc(100% - 2%);
margin:.75em 1%;padding:1em;background-color:rgba(255,225,195,1);border-radius:6px;
}
	@media(min-width:768px){
    ul.my-ul-list li{width:calc(50% - 2%);min-height:160px;margin:1%;padding:1em;}
    }
ul.my-ul-list li span{
font-weight:bold;
}

/*--my-ul-list-BG-COLOR--*/
ul.my-ul-list li{
background-color:rgba(255,225,195,1);
}
body{
background-color:#f8f5f2;
}
section.my-breadcrumb .container-fluid{
background-color:#f8f5f2;
}
.bg-light-blue{
background-color:#dad6f5/*#c8c3f0*/;
}
/*span.huom{font-weight:normal!important;background-color:yellow;}*/
span.huom{}
/*-END-*/