header{
	
padding-top:1.25em;
padding-bottom:1.25em;
}

.hero-area{
padding-top:1.75em;
	padding-bottom:1.75em;
}

 .hero-kuvitus{
	background-image: url('../images/hero-kuvitus.svg'); 
	background-position: right 10px  top 10px; 
	background-repeat: no-repeat; 
	background-size: 430px; 
	
	
	}



.hero-image{
	height:280px;
	background-color: #3467FE;
	background-image:url('../images/main-image.jpg');
	background-position: center bottom;
	background-size:contain;
	background-repeat: no-repeat;
	border-radius:36px;
		position:relative;
/*transform-style: preserve-3d;*/
}






#pyyda-tarjous{
	display:none;
}




	
		.box-shadow, #yhteystiedot img, .hero-image{
			box-shadow:  12px 12px 0px #FFFBED;

	}
	

		.decoration-1{
		left:-16px;
		top:-26px;
		width:80px;
		position: absolute;

	}


	
	.decoration-2{
		right:20px;
		bottom:20px;
		width:55px;
		position: absolute;

	}


	.decoration-visuaalinen-suunnittelu{
		left:-120px;
		top:-66px;
		position: absolute;
width:400px;
	}




	
	




#logo, #logo img, footer .logo{
	width:126px;
}



 .nosto-perus img{
	width:120px;
	margin-bottom:1.25em;
	
}



.nosto-container a{
	margin-bottom:1.5em;
	font-size:1.475rem;
	font-weight:700;
	display:block;
	background-image: url('../images/arrow-white.svg');
	padding-top: 40px;
    margin-top: -40px;
    
    	padding-bottom: 40px;
    margin-bottom: -40px;
    
	background-size:76px;
	background-repeat: no-repeat;
	background-position: right center;
	overflow:visible;
}



.nostokuvake{
	margin-top:1.75em;
	margin-bottom:1.25em;
	width:60px;
}

/* !Linkit ja painikkeet */


 a, a:visited, a:hover  {
	color:inherit;
}



p a, p a:visited{
border-bottom: solid 2px #ffffff;
	}


p a:hover {
border-bottom-color: #3467FE;

	
}



 .korostus{
	background-image: url('../images/korostus.svg'); 
	background-position: center center; 
	background-repeat: no-repeat; 
	background-size: contain; 
	overflow:visible;
	
	
	}
	
	
.button, #lomakepainike {
	display: block;
	text-decoration: none;
	padding: 0.65em 1em 0.65em 1em;
	width: 100%;
	max-width:240px;
	color: #FFFFFF;
	background-image: -webkit-linear-gradient(#3467FE 0%, #1854f7 100%);
	font-size:1.275rem;
	border-radius:50px;
	text-align: center;
}




.arrow-link{
	font-size:1.4rem;
	font-weight:600;
	background-image:url('../images/arrow-white.svg');
	background-size: 45px;
	background-repeat: no-repeat;
	padding-right:3em;
	display:inline-block;
	padding-top:0.75em;
	padding-bottom: 0.75em;
	background-position: right center;
	margin-top:1em;
}

	
/* !Lomakkeet*/

#lomakepainike {
	border:0;
	cursor: pointer;
	max-width:300px;
}



label {
	
	display: block;
	margin-bottom: 0.25em;
	cursor: pointer;	
	
}

fieldset{
		margin-top:1em;
		margin-bottom:1em;
}

legend{
		font-size:1.25rem;
		margin-bottom:0.5em;
	

}

input[type="text"], input[type="email"], input[type="tel"], textarea, .fSfield{
padding:1em;
	width: 100%;
	-webkit-appearance: none;
	color:#ffffff;
	border:0;
	background:transparent;
	border: solid 2px #3467FE;
}




textarea{
	
	 overflow: auto;
	 min-height: 184px;	
	
}


/* !Taustavärit*/

.white-bg, .button-white{
	background-color:#ffffff;
}

.button-white, .button-white:visited{
	color:#3467FE;
}


.button-white:hover{
		    animation: button-white-animate 2s linear infinite;}
		    
		    .button-blue:hover{
			    		    animation: button-blue-animate 2s linear infinite;

		    }

.blue-bg, .button, #lomakepainike{
	background-image: -webkit-linear-gradient(#3467FE 0%, #3467FE 100%);
}





.blue-light-bg, .nosto-perus{
	
	background-color: #191B23;
}








.grey-bg{
	background-color:#f7f7f7;
}



.blue-dark-bg, body{
	background-color:  #121319;
}


/* !Muut*/


.rounded, .tyonaytteet img, #yhteystiedot img, .nosto-perus, .hero-img{
	border-radius:16px;
}

.rounded-bottom{
border-bottom-left-radius: 16px;
border-bottom-right-radius: 16px;

}


.page-content ul li{
	background-image: url('../images/li-blue.svg');
	background-repeat: no-repeat;
	background-size:9px;
	background-position: left 15px;
	padding-left:1.1em;
}







textarea:focus, input:focus, input:focus + .checkmark,  input:focus + .radio
    {
      outline: 1px solid rgba(13, 24, 66, 0.69);
  outline-offset: 1px;
    
    }








	
	








.nyt{

position:relative;
    overflow: visible;
}





.nyt:before{
content: '';
position:absolute;
bottom:-16px;
left: 33%;
  margin-left: auto;
  margin-right: auto;
width: 0;
height: 0;
border-style: solid;
border-width: 16px 16px 0px 16px;
border-color: #191B23 transparent;
	overflow: visible;
	z-index: 99999;

}


.ofv, .owl-stage, .owl-stage-outer{
	
	overflow:visible!important;
}

.owl-prev, .owl-prev:hover, .owl-next, .owl-next:hover{
    background-color: transparent;
	
}



#juuri-nyt{
	margin-top:2em;
}

#juuri-nyt-nav{
	position:absolute;
	top:-3px;
	right:1.25em;
	float:none;
	width:116px;
}

.disabled{
	opacity:1;
}


.owl-next, .owl-prev{
width:40px;
height:40px;

	text-indent: -9999em;
border:0;
background-size:40px;
background-repeat: no-repeat;
background-position: center center;

}





#juuri-nyt-nav .owl-next{
float:right;
margin-left:1.75em;
background-image: url('../images/arrow-white.svg');

}


#juuri-nyt-nav .owl-prev{
float:left;
background-image: url('../images/arrow-white.svg');
transform: scale(-1, 1);
}
   
#juuri-nyt img, .author img{
	float:left;
	width:70px;
	height:70px;
	margin-top:1.75em;
	margin-left:5em;
	border-radius:50%;
}


.some{
	display:flex;
	justify-content: space-between;
	margin-bottom:2em;
	margin-top:2em;
}


.some img{
	width:36px;
	display:flex;
	justify-content: center;
	align-items: center;
	}
	
	
.some img:hover{
		    animation: light-blue-animate 2s linear infinite;
		    border-radius:50%;
}


.linkedin, .dribbble{
	width:22px;
	height:22px;
}









.tyonayte{
	position:relative;

	display:block;
}

.nuoli{
	width:65px;
	height:65px;
	
}


.tyonayte-teksti-container{
	position: absolute;
	left:1em;
	top:1em;
}

.tyonayte .nuoli{
position: absolute;
	bottom:1em;
	right: 1em;
	z-index:999999999999999999999!important;
	width:40px;
	height:40px;

}





.nuoli .st0{fill:#FFFFFF;}






 #lomakepainike:hover {
		    animation: button-blue-animate 2s linear infinite;
		   }



.nosto:hover .nuoli{
	opacity:0.8;
}


.tyonayte img {
object-fit: cover;
  width: 100%;
   height: 100%;
}



@keyframes button-white-animate {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7), 0 0 0 0 rgba(255, 255, 255, 0.7);
    }

    40% {
        box-shadow: 0 0 0 25px rgba(255, 255, 255, 0), 0 0 0 0 rgba(255, 255, 255, 0.7);
    }

    80% {
        box-shadow: 0 0 0 25px rgba(255, 255, 255, 0), 0 0 0 10px rgba(255, 255, 255, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0), 0 0 0 10px rgba(255, 255, 255, 0);
    }
}




@keyframes button-blue-animate {
    0% {
        box-shadow: 0 0 0 0 rgba(50, 104, 255, 0.7), 0 0 0 0 rgba(50, 104, 0.7);
    }

    40% {
        box-shadow: 0 0 0 25px rgba(50, 104, 255, 0), 0 0 0 0 rgba(50, 104, 255, 0.7);
    }

    80% {
        box-shadow: 0 0 0 25px rgba(50, 104, 255, 0), 0 0 0 10px rgba(50, 104, 255, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(50, 104, 255, 0), 0 0 0 10px rgba(50, 104, 255, 0);
    }
}




@keyframes light-blue-animate {
    0% {
        box-shadow: 0 0 0 0 rgba(23, 35, 79, 0.7), 0 0 0 0 rgba(23, 35, 79, 0.7);
    }

    40% {
        box-shadow: 0 0 0 25px rgba(23, 35, 79, 0), 0 0 0 0 rgba(23, 35, 79, 0.7);
    }

    80% {
        box-shadow: 0 0 0 25px rgba(23, 35, 79, 0), 0 0 0 10px rgba(23, 35, 79, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(223, 35, 79, 0), 0 0 0 10px rgba(23, 35, 79, 0);
    }
}












hr, .wp-block-separator{
	border:0;
	border-top: solid 1px #191B23;
	
	background:transparent;
}


.border-bottom{
	border-bottom: solid 1px #191B23;
}


.blue-light-bg hr{
	border-top-color:#231919;
}


hr{
	border-bottom:0;
	border-left:0;
	border-right:0;
	margin-top:3em;
	margin-bottom:3em;
	display: block;
}

#footer-palstat{
	display:flex;
	align-content: center;
	flex-direction: column;
	justify-content: center;
}


#footer-palsta-1{
	order:3;
}

#footer-palsta-2{
	order:1;
}

#footer-palsta-3{
	order:2;
}




#yhteystiedot ul li{
	margin-bottom:1.75em;
	background-image:none;
	padding-left:0;
}


#yhteystiedot a[href^="mailto"], #yhteystiedot a[href^="tel"]{
	background-image: url('../images/phone.svg');
	background-size:36px;
	background-repeat: no-repeat;
	background-position: left center;
	padding-left:2.55em;
	padding-top:0.75em;
	padding-bottom:0.75em;
	font-weight:600;
	

}


#yhteystiedot a[href^="mailto"]{
	background-image: url('../images/email.svg');
	

}


#yhteystiedot img{
	width:180px;
	border-radius: 16px;
}




.asiakaslogo img{
	height:60px;
	margin-top:0.75em;
	margin-bottom:0.75em;
	}


.sitaatti {
	width:70px;
margin-bottom:1.75em;	
	
}

.yhteydenottokehote{
	display:flex;
	align-items: center;
}

.yhteydenottokehote img{
	width:125px;
}

.tyokalupakissa{
	display: flex;
	justify-content: space-between;
}

.tyokalupakissa img{
	width:70px;

}


.author-kuva{
	width: 100px;
	border-radius: 50%;
	margin-bottom: 1.5em;
	
}


.share-buttons{
	display:flex;
	gap:1.5em;
	margin-top:1em;
	margin-bottom:1em;
	padding-bottom: solid 1px #1F5CF2;
	
}

.share-buttons img{
	width:45px;
}

.tags{
	padding-left:2.75em;
	background-image: url('../images/tag.svg');
	background-repeat: no-repeat;
	background-position: left 12px;
	background-size:40px;
	padding-top:0.5em;
	padding-bottom:0.5em;
	margin-bottom:0;
}

.blue-light-bg .tags{
		background-image: url('../images/tag-darker.svg');

	
}




.author img{
	margin:0 1.5em 0 0;
}

.date {
	margin-bottom:0;
	font-size:1.1rem;

}

.author{
	display:flex;
	align-items: center;
	margin-top:1em;
}





 .tyonayte-teksti-container span:not(:last-of-type)::after {
content:",";
	text-transform: inherit;


}

 .tyonayte-teksti-container span:not(:first-of-type){
	text-transform: lowercase;
 }
 
 
.breadcrumb-home{

background-image:url('../images/breadcrumb-home.svg');
background-size:19px;
background-position: center 19px;
background-repeat:no-repeat;
padding:0.75em;  
border-bottom:0;
}

.breadcrumb-separator{
	margin-right:0.75em;
	margin-left:0.75em;
	color:#3467FE;
}

#breadcrumbs{
	margin-top:0;
	margin-bottom:0.75em;
		font-size:1.25rem;

}

#breadcrumbs a{
	border-bottom:0;
}


.palvelut-linkki{
	display:flex;
	align-items: center;
	justify-content: center;
}
.palvelut-linkki img{
	width:100px;
	margin:0;

}









 
 @media (min-width: 600px) {



}



@media (max-width: 768px) {
    .reverse-mobile {
        flex-direction: column-reverse;
    }
    
    }




@media all and (min-width: 1023px) {


.hero-area{
padding-top:5.75em;
	padding-bottom:5.75em;
}





.palvelut-linkki img{
	width:170px;

}
	
		.decoration-1{
		left:-94px;
		top:-64px;
		width:194px;

	}


	
	.decoration-2{
		right:40px;
		bottom:40px;
		width:130px;

	}





.hero-image{
height:500px;
margin-top:0;




}

	
	
	
	
	.hero-kuvitus{
	background-position: right 70px  top 50px; 
	background-size: 760px; 
	
	
	}
	
	
	
	
	
	
	
	
		.box-shadow, #yhteystiedot img,  .hero-image{
			box-shadow:  22px 22px 0px #FFFBED ;

	}


.nostokuvake{
	margin-bottom:0;
	
	width:80px;
}












.sitaatti {
	clear:right;
	width:136px;
	margin-top:1em;
	margin-bottom:0;
	
	
}
.nyt{
	min-height:180px;
}

#footer-palstat{
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}


#footer-palsta-3{
	order:1;
		width:400px;

}

#footer-palsta-2{
	order:2;
	width:200px;
			width:400px;

}

#footer-palsta-1{
	order:3;
		width:400px;
		text-align: right;

}



#juuri-nyt{
	margin-top:0;
}

#juuri-nyt-nav{
	
	top:28px;

}


#juuri-nyt img, .author img{
	
	width:80px;
	height:80px;
	
}



.some{
	justify-content: start;
	gap:1.5em;
		margin-top:0;


	}


footer .logo, .some{
	margin-bottom:0;
}


.nosto .nuoli{
	
	
}



.nosto p{
	padding-right:4.5em;
	}
	
	
	#yhteystiedot img{
	float:right;
	width:280px;
	
}







.tyonayte .nuoli{

	bottom:2em;
	right: 2em;
	width:60px;
	height:60px;

}




	

}



@media all and (min-width: 1260px) {
	
#logo, #logo img{
	width:150px;
}

 footer .logo{
	width:140px;
	}


.tyonayte-teksti-container{
	left:2.5em;
	top:1.5em;
}



#pyyda-tarjous{
	
	display:block;
}

 .pyyda-tarjous-kuvake{
	width:100px;
animation: rotating 18s linear infinite;
}



 .pyyda-tarjous-kuvake:hover{
	
animation-play-state: paused;
}






@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}










.pyyda-tarjous-kuvake .st0{fill:#3268FE;
	
}
	

	}
	




@media all and (min-width: 1280px) {
	



#top-container{
	display:flex;
	align-items: center;
}


#logo{
	margin-right: auto;
}





label{
	font-size:1.375rem;
}



}


@media all and (min-width: 1400px) {



	
	
	
	
	
	
	
	
}



@media all and (min-width: 1600px) {




}



