html {
		scroll-behavior: smooth;
	}
	
	@media screen and (prefers-reduced-motion: reduce) {
		html {
			scroll-behavior: auto;
		}
	}
	p {
		line-height: 1.5;
	}

	.item {
		text-transform: none;
	}

	img#logo {
		width: 100%;
		
	}
	@media (max-width: 420px) {
		.ace.jcr {display:grid;justify-items:center;}
	}
	#logotext, #logotext a, #logotext a:visited {
		color:var(--yellow);
	}
	#logotext a, #logotext a:visited {
		text-decoration: none;
	}
	#slogan {
		letter-spacing:.1em;
		font-weight:500;
	}
	.google-maps {
		width:100%;
		border-radius:5px;
		background:var(--abg);
		box-shadow: 0px 2px 5px #888888;
		grid-template-columns: repeat(3, 1fr);
		display:grid;
		grid-gap: 2em;
	}
	.google-maps iframe{
		grid-column: span 2;
	}
	.google-maps div{
		grid-column: span 1;
	}
	ul#tiedot > li { 
		padding:0.5em 0;
	}
	#slider-wrapper {
		width: 100%;
    	height: 320px;
		padding: 0px;
		margin: 0 0 10px 0;
		position: relative;
	  }
	  
	  #slider {
		width: 100%;
		height: 320px;
		border-radius: 10px;
		background-color: var(--greywhite);
		padding: 0px;
		margin: 0;
		position: relative;
	  }
	  
	  .slide {
		position: absolute;
		width: 100%;
		height: 250px;
		overflow: hidden;
		opacity: 1;
		color: #FFF;
	  }
	  #slide1,#slide2,#slide3 {
		width: 100%;
		height: 320px;
		border-radius: 10px;

	  }
	  #slide1 {
		background: url(https://munfirma.fi/img/ape2.jpg) no-repeat center;
		background-size: cover;
		background-position: 50% 50%;
	  }
	  
	  #slide2 {
		background: url(https://munfirma.fi/img/1.png) no-repeat center;
		background-size: cover;
		background-position: 50% 50%;
	  }
	  
	  #slide3 {
		background: url(https://munfirma.fi/img/2.png) no-repeat center;
		background-size: cover;
		background-position: 50% 50%;
	  }
	  
	  #progressBar {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 2;
		width: 100%;
		height: 5px;
		background: rgba(255, 255, 255, 0.6);
		
	  }

	  .span4.infobox {
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f7ce88+19,faa916+94 */
		background: rgb(247,206,136); /* Old browsers */
		background: -moz-linear-gradient(top,  rgba(247,206,136,1) 19%, rgba(250,169,22,1) 94%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  rgba(247,206,136,1) 19%,rgba(250,169,22,1) 94%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  rgba(247,206,136,1) 19%,rgba(250,169,22,1) 94%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ce88', endColorstr='#faa916',GradientType=0 ); /* IE6-9 */
		width:95%;
		color:var(--gray-1);box-shadow: 0px 2px 5px #888888;
				border-radius: 15px;
				max-height:190px;
				height:150px;
				
		}
		.infobox > span {
			text-shadow: #1b1b1ec1 2px 2px 7px;
			font-size:15px;
			text-transform: none;
			padding:1em 2em;
			text-align:center;
			font-weight: 500;
			
		}
		.infobox > h3 {
			text-shadow: #1b1b1ec1 0 2px 5px;
			text-transform: capitalize;
			letter-spacing: .01em;
			margin:0;
			align-self:end;
			font-size:20px;
		}
	.palvelut {
			display: grid;
			grid-template-areas:
				'1'
				'2'
				'3'
				'4';
			justify-items: center;
			width:100%;
	}
	h6.titletys {
		text-transform: uppercase;
		letter-spacing: 0.1em;
		font-size:0.9em;
		color:var(--gray-10)
	}
	h5 {text-transform: none;}
	button, a.button {
		margin:0 1em 0 0;
	}

	.tiedotteet {
		background:var(--abg); 
		width:95%;
		color:var(--gray-10);
		border-radius:5px;
		padding: 1em 1em;
		box-shadow: 0px 2px 7px #888888;
		height:100%;
				
		}
	a.button:hover {
		background: rgb(247,206,136);
   		background: -moz-linear-gradient(top, rgba(247,206,136,1) 19%, rgba(250,169,22,1) 94%);
    		background: -webkit-linear-gradient(top, rgba(247,206,136,1) 19%,rgba(250,169,22,1) 94%);
    		background: linear-gradient(to bottom, rgba(247,206,136,1) 19%,rgba(250,169,22,1) 94%);
    		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ce88', endColorstr='#faa916',GradientType=0 );
		color:#fff;
		}