/*

Theme Name:   HR Solution

Theme URI:    https://wordpress.org/themes/neve/

Description:  Neve child theme

Author:       Themeisle

Author URI:   https://themeisle.com/

Template:     neve

Version:      1.0.0

Text Domain:  nevechild

*/





:root {

  color-scheme: light;

}



html, body {

  /*background-color:#fcf8f5 !important;*/

}



body {

    font-family: 'Fustat', sans-serif;

    font-size:.9em;

    margin:0 auto !important;

}

p, li { 

    font-size:1.2em;

    /*line-height:1.4em;*/

}

p.italic {

    font-style: italic;

}

strong {

    font-weight: 700;

}

strong.italic {

    font-weight: 700;

    font-style: italic;

}

h1, h2, h3, h4, h5, h6 {

    font-family: 'HRSolutionsFont', sans-serif;

    line-height:1.2em !important;

}



h1, h2, h3 {

    font-weight: 600;

}

h4, h5, h6 {

    font-weight: 400;

}



footer h1, footer h2, footer h3, footer h4, footer h5, footer h6 {

    font-family: 'HRSolutionsFont', sans-serif !important;

    text-decoration:none;

    margin:0 0 0 0;

}

footer, footer p, footer li, footer span, footer a {

    font-family: 'Fustat', sans-serif !important;

    text-decoration:none;

}

.hrsolutions-otsikko h1{

    font-size:3.5em;

}

.hrsolutions-otsikko span{

    font-family: 'HRSolutionsFont', sans-serif;

    font-size:3.5em;

    line-height:1.2em;

    font-weight: 600;

}

.hrsolutions-otsikko span::after {

    content: "\f004";

    font-family: "Font Awesome 5 Free"; 

    font-weight: 400;

    font-size:.5em;

    display: inline;

    margin: 0px 0px 0px 12px;

    vertical-align: 2px;

}

.hrsolutions-alaotsikko span{

    font-family: 'HRSolutionsFont', sans-serif;

    font-weight:600;

}

.search-form .search-field {

    font-family: 'HRSolutionsFont', sans-serif;

}



.tyonhakijalle span{

    font-family: 'HRSolutionsFont', sans-serif;

    font-size:1.1em;

    line-height:1.2em;

    font-weight: 400;

    text-transform:uppercase;

}

.tyonhakijalle span::after {

    content: "\f004";

    font-family: "Font Awesome 5 Free"; 

    font-weight: 400;

    font-size:.8em;

    display: inline;

    margin: 0px 0px 0px 6px;

    vertical-align: 2px;

}





/*Piilottaa ylävalikon Elementor-näkymästä*/

.elementor-editor-active .hrsolutions-header {

	z-index:0;

}



html[lang^="fi"] .foo-en {

  display: none !important;

}



html[lang^="en"] .foo-fi {

  display: none !important;

}



/*HERO-alue*/

#hero {

    position: relative !important;

    z-index: 1 !important;

    background-size: auto 100% !important;

    background-position: left center !important;

    background-repeat: no-repeat !important;

}

#hero::before {

    content: '' !important;

    position: absolute !important;

    inset: 0 !important;

    background: #093b6d !important;

    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    mask-size: 100% 100% !important;

    -webkit-mask-size: 100% 100% !important;

    z-index: 0 !important;

    pointer-events: none !important;

}

#hero > .elementor-container {

    position: relative !important;

    z-index: 1 !important;

}



.e-con>.elementor-background-slideshow, :is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container {

	position: relative !important;

	z-index:-1 !important;

	width:49% !important;

	height:auto !important;

}



#hero-ala {

    position: relative !important;

    z-index: 1 !important;

    /*background-size: cover 100% !important;

    background-position: left center !important;*/

    background-repeat: no-repeat !important;

}

#hero-ala::before {

    content: '' !important;

    position: absolute !important;

    inset: 0 !important;

    background: #093b6d !important;

    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    mask-size: 100% 100% !important;

    -webkit-mask-size: 100% 100% !important;

    z-index: 0 !important;

    pointer-events: none !important;

}



/*Painikkeet*/

/*Vihreä - Default*/

a.elementor-button {

    position: relative;

    display: inline-flex;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0) !important;

	transition:0s;

	font-size:1.1em;

	padding:10px 25px;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	z-index: 0;

}

a.elementor-button::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

a.elementor-button:hover::before {

	transform: translateX(0) skewX(-10deg);

}

a.elementor-button::after {

    content: "\f061";

    font-family: "Font Awesome 5 Free"; 

    font-size:.8em;

    font-weight: 600; 

    margin-left: 8px;

}

a.elementor-button:hover {

	color:#000 !important;

}

/*Punainen */

a#punainen-button {

    position: relative;

    display: inline-flex;

	border-radius:50px;

	border:3px solid #ef5050;

	background-color:rgba(0,0,0,0) !important;

	transition:0s;

	font-size:1.1em;

	padding:10px 25px;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	z-index: 0;

}

a#punainen-button::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #ef5050;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

a#punainen-button:hover::before {

	transform: translateX(0) skewX(-10deg);

}

a#punainen-button::after {

    content: "\f061";

    font-family: "Font Awesome 5 Free"; 

    font-size:.8em;

    font-weight: 600; 

    margin-left: 8px;

}

a#punainen-button:hover {

	color:#fff !important;

}



/*Alkovi-kortti - Muotoilu*/





.h-container {

    border:2px solid #093b6d !important;

    border-top: none !important;

    border-radius: 0 0 20px 20px !important;

    margin:-2px 0 0 0 !important;

    background-color: #fcf8f5 !important;

}

.h-container::before {

    position: absolute !important;

	content: '' !important;

	width: 18px !important;

	height: 16px !important;

	aspect-ratio: 1 !important;

	background: transparent !important;

    border: 2px solid #093b6d !important;

    border-left: none !important;

    border-bottom: none !important;

    border-radius: 0 20px 0 0px !important;

    box-shadow: inset 10px 10px 10px 999px #fcf8f5 !important;

    

    left: -18px !important;

	top: 0px !important;

	

	z-index:2;

}



.h-container::after {

    position: absolute !important;

	content: '' !important;

	width: 18px !important;

	height: 16px !important;

	aspect-ratio: 1 !important;

	background: #fcf8f5 !important;

    

    left: -18px !important;

	top: 0px !important;

	

	z-index:1;

}



.a-container {

	background-color: #093b6d;

	border:2px solid red;

	border-radius: 20px !important;

	position:relative;

}

.a-container .a {

	display: flex;

	position: absolute;

	height: 60px;

	background-color: #fcf8f5;

	width: 60%;

	bottom: 0;

	left: 0;

	border-top-right-radius: 20px;

}

.a-container .a::before,

.a-container .a::after {

	position: absolute;

	content: '';

	width: 24px;

	height: 24px;

	aspect-ratio: 1;

	background: transparent;

	

  border: 2px solid red;

  border-right: none;

  border-top: none;

  border-radius: 0 0 0 20px;

  box-shadow: inset 10px 10px 10px 999px #fcf8f5;

}

.a-container .a::before {

	left: 100%;

	top: 36px;

}

.a-container .a::after {

	left: 0px;

	top: -24px;

}

/*Alkovi-kortti versio 2*/

.m-container {

	background-color: #093b6d;

	border-radius: 20px !important;

	position:relative;

}

.m-container .m {

	display: flex;

	position: absolute;

	height: 60px;

	background-color: #fcf8f5;

	width: 60%;

	bottom: 0;

	left: 0;

	border-top-right-radius: 20px;

}

.m-container .m::before,

.m-container .m::after {

	position: absolute;

	content: '';

	width: 24px;

	height: 24px;

	aspect-ratio: 1;

	background: radial-gradient(circle 24px at top right, transparent 98%, #fcf8f5);

}

.m-container .m::before {

	left: 100%;

	top: 36px;

}

.m-container .m::after {

	left: 0px;

	top: -24px;

}

/*Alkovi-kortti versio 3*/

.n-container {

	background-color: #fcf8f5;

	border:2px solid #093b6d;

	border-radius: 20px !important;

	position:relative;

}

.n-container .n-wrapper {

    position: absolute;

    height: 60px;

	width: 60px;

	bottom: -2px;

	left: -2px;

	background:#fcf8f5;

    border:2px solid #fcf8f5;

}

.n-container .n {

	display: flex;

	position: absolute;

	align-items:flex-end;

	justify-content:flex-start;

	height: 30px;

	width: 30px;

	background-color: #fcf8f5;

	bottom: 14px;

	left: 12px;

	padding:0;

	border-top-right-radius: 20px;

	box-sizing: border-box;

	border-color:#093b6d;

	border-style:solid;

	border-width:2px 2px 0 0;

}

.n-container .n img {

    margin:20px 0 0 0;



    width:15px !important;

    height:15px !important;

}

.n-container .n::before,

.n-container .n::after {

	position: absolute;

	content: '';

	width: 18px;

	height: 16px;

	aspect-ratio: 1;

	background: transparent;

  border: 2px solid #0a4850;

  border-right: none;

  border-top: none;

  border-radius: 0 0 0 20px;

  box-shadow: inset 10px 10px 10px 999px #fcf8f5;

}

.n-container .n::before {

	left: 100%;

	top: 28px;

}

.n-container .n::after {

	left: -14px;

	top: -16px;

}

/*

.prosessi-grid .e-con-inner{

  display: grid;

  grid-template-columns: repeat(3, 1fr); 

  grid-template-rows: repeat(2, auto); 

  

  border:2px solid red;

}



.prosessi-grid .e-con-inner > :nth-child(1) { 

    grid-column: 1; 

    grid-row: 1; 

    border:2px solid red;

}

.prosessi-grid .e-con-inner > :nth-child(2) { 

    grid-column: 1; 

    grid-row: 2; 

    border:2px solid blue;

}





.prosessi-grid > :nth-child(3) { grid-column: 2; grid-row: 2; }

.prosessi-grid > :nth-child(4) { grid-column: 2; grid-row: 1; }





.prosessi-grid > :nth-child(5) { grid-column: 3; grid-row: 1; }

.prosessi-grid > :nth-child(6) { grid-column: 3; grid-row: 2; }



*/



.prosessin-vaihe {

    position: relative;

    counter-increment: step-counter; 

    background-color:#fcf8f5;

    z-index: 1;

}

.prosessin-vaihe::after {

    content: counter(step-counter);

    position:absolute;

    top:-20px; left:-20px;

    width:50px;

    height:50px;

    transition: ease all .5s;

    z-index:2;

    

    display: flex;

    align-items: center;

    justify-content: center;

    

    border:2px solid #093B6D;

    border-radius:50px;

    background-color:#fcf8f5;

    

    font-family: 'HRSolutionsFont', sans-serif;

    font-size:1.8em;

    font-weight:600;

}

/*

.prosessin-vaihe:nth-child(3), .prosessin-vaihe:nth-child(6), .prosessin-vaihe:nth-child(9) {

  counter-increment: none;

  margin:0 auto;

  height:275px;

  width:275px;

  padding:20px;

  border-radius:50%;

  border:3px solid #093B6D !important;

}

.prosessin-vaihe:nth-child(3)::after, .prosessin-vaihe:nth-child(6)::after, .prosessin-vaihe:nth-child(9)::after {

  content: "";

  border:0px solid #093B6D;

  width:0;

  height:0;

}*/



.prosessin-vaihe:nth-child(1), .prosessin-vaihe:nth-child(3), .prosessin-vaihe:nth-child(5) {

  min-height:250px;

}



.prosessin-vaihe:nth-child(1)::before, .prosessin-vaihe:nth-child(5)::before {

    content: '';

    position: absolute;

    top: 100%;          /* start from bottom of the element */

    left: 50%;          /* center horizontally relative to the element */

    width: 2px;         /* thickness of the line */

    height: 150px;       /* length of the vertical line */

    background-color: #093B6D;

    transform: translateX(-50%); /* center the line horizontally */

    z-index: 0;

}

.prosessin-vaihe:nth-child(3)::before {

    content: '';

    position: absolute;

    top: 0;        

    left: 50%;      

    width: 2px;      

    height: 150px;      

    background-color: #093B6D;

    transform: translate(-50%, -100%);

    z-index: 0;

}

.prosessin-vaihe:nth-child(2)::before, .prosessin-vaihe:nth-child(4)::before {

    content: '';

    position: absolute;

    top: 50%;

    left: 100%; 

    height: 4px;

    background-color: #093B6D;

    transform: translateY(-50%);

    z-index: 0;

}



/*Etusivu*/

/*Ikoni ja taustaväri*/

.icon-container, .img-container {

  position: relative;

}

.elementor-element.icon-container::before {

	content: '';

	position: absolute;

	inset: 0;

	background: #bccf02;

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='80,0 100,0 100,100 70,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='80,0 100,0 100,100 70,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 0;

	pointer-events: none;

}

.icon-container .icon-overlay {

  position: absolute;

  top: 50%;

  left: 87%;

  transform: translate(-50%, -40%);

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;

}

.icon-container .icon-overlay img,

	.icon-overlay {

    display:block !important;

    opacity:1 !important;

    max-width: 150px;

    height: auto;

}



.elementor-element.img-container::before {

	content: '';

	position: absolute;

	inset: 0;

	background-image: url("https://hrsolutions.fi/wp-content/uploads/2025/07/istockphoto-625596352-1024x1024-1.jpg");

	background-position: 30% 50%;

	background-repeat:no-repeat;

	background-size: auto 800px;

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='70,0 100,0 100,100 60,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='70,0 100,0 100,100 60,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 0;

	pointer-events: none;

}

.elementor-element.nosto-container::before {

    content: '';

	position: absolute;

	inset: 0;

	background-image: url("https://hrsolutions.fi/wp-content/uploads/2025/11/HR-Solutions-OlgaMalyavko-Tietokone-scaled.webp");

	background-position: 7% 40%;

	background-repeat:no-repeat;

	background-size: auto 700px;

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 0;

	pointer-events: none;

}

.elementor-element.banner-container::before {

    content: '';

	position: absolute;

	inset: 0;

	background-image: url("https://hrsolutions.fi/wp-content/uploads/2025/11/HR-Solutions-Yasmine-Harkimo-Lagerstrom-2-scaled.webp");

	background-position: 138% 40%;

	background-repeat:no-repeat;

	background-size: auto 500px;

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 0;

	pointer-events: none;

}



/*Palvelu-linkit*/

#heart-line {

	width: auto;

	height: 100vh; 

	max-height: 300px;

	display: block;

	margin:0 0 0 33px;

}

#haitari-nosto.palvelu-linkki span::after{

	content: "\f0a9";

	font-family: "Font Awesome 5 Free"; 

	font-size:1.4em;

	font-weight: 600;

	margin-left: -30px;

	color:#ef5050;

	transition:ease all 0.2s;

}

#haitari-nosto.palvelu-linkki span:hover::after {

  margin-left: 0px;

}

#haitari-nosto .e-n-accordion-item {

	border-style:solid;

	border-color:#000;

	border-width:0 0 0px 0;

}

#haitari-nosto.elementor-widget-n-accordion .e-n-accordion-item-title>span {

    width:100%;

}

#haitari-nosto .e-n-accordion-item-title-text {

    font-size:1.2em !important;

	font-weight:600;

	padding:10px 0px 10px 55px;

	width:100%;

}

#haitari-nosto .e-n-accordion-item-title-text::after{

    content: "";

    position: absolute;

    top: 55px;

    right: 0;

    height: 2px;

    width: 84%;

    margin-right:42px;

    background-color: black;

    transition: width 0.2s ease-out;

}

#haitari-nosto .e-n-accordion-item-title-text:hover::after{

    width: 93%;

}



/*

#haitari-nosto.palvelu-linkki span{

	font-size:1.2em;

	font-weight:600;

}

.palvelu-linkki span a{

	position: relative;

    display: inline-block;

	width: 390px;

	padding:20px 0 10px 100px;

}

.palvelu-linkki span a::after {

  content: "";

  position: absolute;

  bottom: 0;

  right: 0;

  height: 2px;

  width: 290px;

  background-color: black;

  transition: width 0.2s ease-out;

}

.palvelu-linkki span a:hover::after {

  width: 100%;

}

*/

/*Haitari

.e-n-accordion-item {

	border-style:solid;

	border-color:#000;

	border-width:0 0 2px 0;

}

.e-n-accordion-item .haitari-valkoinen {

	border-style:solid;

	border-color:#000;

	border-width:0 0 2px 0;

}

h4.e-n-accordion-item-title-text{

	font-size:1.25em !important;

	font-weight:500;

	padding:10px 0;

}

.e-n-accordion-item-title {

	border-width:0 !important;

	padding:10px 0 10px 0 !important;

	justify-content:space-between !important;

}

.e-n-accordion-item p{

    font-size:1.1em !important;

    padding:0 !important;

}

haitari-valkoinen

.haitari-valkoinen .e-n-accordion-item{

	border-style:solid;

	border-color:#fff !important;

	border-width:0 0 2px 0;

}

*/





/*Miksi valita juuri meidät - Slider*/

.card-slider {

	margin:30px 0 0 0;

}

.swiper-slide h3{

    width:75%;

    font-size:1.5em;

    margin:0 0 20px 0;

}

.card-content {

  position: relative;

  padding: 0px 30px 35px 30px;

  box-sizing: border-box;

  overflow: visible;

}

.card-content .card-excerpt {

    margin:0 0 20px 0;

}

.card-border-anim {

  position: absolute;

  top: 0;

  left: -7px;

  width: 100%;

  overflow: visible;

  height:100%;

}

.heart-svg {

  width: 100px;

  height: 100%; 

}

.valinta-controls {

	display: flex;

	position: absolute;

	left: 100%;

	transform: translateX(-100%);

	gap: 1rem;

	bottom:-30px;

	padding:0;

	z-index: 10;

}



.valinta-controls .fa-solid.fa-arrow-right, .valinta-controls .fa-solid.fa-arrow-left {

	margin:0 0 0 0;

}



.suositus-controls .fa-solid.fa-arrow-right, .suositus-controls .fa-solid.fa-arrow-left {

	margin:2px 0 0 0;

}



.matka-controls .fa-solid.fa-arrow-right, .matka-controls .fa-solid.fa-arrow-left {

	margin:2px 0 0 0;

}



.card-slider-controls {

	justify-content: center;

	gap: 20px;

	margin-top: 20px;

}



/*Matkamme - Slider*/

.matka-slider .swiper {

 /* overflow: visible !important;*/

 padding:10px;

 margin:-10px 0 0 -10px;

}

.matka-slider .swiper-wrapper {

  /*overflow: visible !important;*/

}

.matka-slide {

  position: relative;

  padding: 30px;

  box-sizing: border-box;

  overflow: hidden;

  min-height:400px !important;

  background-color:#fff;

  border-radius:20px;

  box-shadow: 0px 0px 5px rgba(0,0,0,.3);

}

.matka-content {

    display: flex;

    gap: 20px;

    align-items: stretch; /* make image take full height of the card */

}

.matka-text {

    max-width:58%;

}

.matka-image {

    position:absolute;

    width: 250px;

    height:100%;

    top:0;

    right:0;



    display: flex;

}

.matka-image img {

    width: 100%;

    height: 100% !important; /* stretch to full height of container */

    object-fit: cover; /* crop nicely if aspect ratio differs */

    object-position:center center;

    display: block;

    clip-path: polygon(0 100%, 20% 0, 100% 0%, 100% 100%);

}

.matka-controls {

	display: flex;

	position: absolute;

	left: 100%;

	transform: translateX(-100%);

	gap: 1rem;

	bottom:-30px;

	padding:0;

	margin:0 0 0 -10px;

	z-index: 10;

}

.quote::before {

    content: '';

    position: absolute;

    background-image: url("https://hrsolutions.fi/wp-content/uploads/2025/07/HR-Solutions-Lainausmerkit.svg");

    background-size: contain;      /* Scales image to fit within the box */

    background-position: center;   /* Centers it inside */

    background-repeat: no-repeat;

    width: 50px;

    height: 50px;

    margin: -55px 0 0 -65px;

}

.nimi-vino {

    margin:0 0 0 30px;

}

.nimi-vino::before {

    content: '';

    position: absolute;

    background-image: url("https://hrsolutions.fi/wp-content/uploads/2025/07/HR-Solutions-Viiva1.svg");

    background-size: auto 100px;

    background-position: 50% 50%;

    background-repeat:no-repeat;

    width:20px;

    height:45px;

    margin:0 0 0 -30px;

}



/*Counter*/

.counter-wrapper {

	text-align:center;

	font-family: 'HRSolutionsFont', sans-serif;

}

.counter {

	font-size:2.5em;

	font-weight:700;

}

.counter-teksti {

	font-size:1.5em;

	font-weight:600;

}



/*Fade-in kortit*/

.fade-card {

  opacity: 0;

  transform: translateY(30px);

  transition: none;

}

.elementor-editor-active .fade-card {

  opacity: 1 !important;

  transform: none !important;

}



/*Lomake*/

.wpcf7 {

	font-family: 'HRSolutionsFont', sans-serif;

	color:#000;

}

.wpcf7 p {

	max-width:100%;

}

.wpcf7 label{

	width:100%;

}

.wpcf7 input[type="text"],

.wpcf7 input[type="email"],

.wpcf7 input[type="tel"],

.wpcf7 textarea

{

	border:2px solid #093b6d;

	border-radius:10px;

	background-color: #fff;

	color: #000;

	width: 100%;

	font-family: 'HRSolutionsFont', sans-serif;

	font-size:.9em;

}

input[type=checkbox] {

	transform: scale(1.2);

	margin:0 5px 0 0;

}

.wpcf7-list-item {

	margin:0;

}

.wpcf7-list-item.first {

	margin:0 20px 0 0;

}

.wpcf7 select {

    font-family: 'HRSolutionsFont', sans-serif;

	width:100%;

	border:2px solid #093b6d;

	border-radius:10px;

	background-color:#fff;

}





.cf7-select-wrapper {

  position: relative;

  display: inline-block;

  width: 100%;

}

.cf7-select-wrapper select {

  appearance: none;

  -webkit-appearance: none;

  -moz-appearance: none;

  width: 100%;

  padding-right: 40px;

}

.cf7-select-wrapper::after {

  font-family: "Font Awesome 6 Free";

  content: "\f078";

  font-weight: 600;

  position: absolute;

  right: 20px;

  top: 43px;

  pointer-events: none;

}









.wpcf7 option {

    font-family: 'HRSolutionsFont', sans-serif;

}

.wpcf7 input[type="submit"] {

    position: relative;

    display: inline-flex;

	font-family: 'HRSolutionsFont', sans-serif;

	font-weight:400;

	border:3px solid #bccf02;

	border-radius:50px;

	padding:10px 45px;

	background-color:rgba(0,0,0,0) !important;

	color:#000;

}

.wpcf7 input[type="submit"]:hover {

	background-color:#bccf02 !important;

	color:#000;

}

#yhteys-lomake .wpcf7{

	color:#000000;

}

#yhteys-lomake .wpcf7 input[type="submit"]{

	color:#000000;

}



/* Suositukset - Slider - Swiper */

.suositus-outer-container {

	width: 100%;

}

.suositus-outer-container::before {

	content: '';

	position: absolute;

	inset: 0;

	background: rgba(255,255,255,.9);

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 0;

	pointer-events: none;

}

.suositus-container {

	position: relative;

	width: 50%;

	margin-left: auto; 

	box-sizing: border-box;

}

.suositus-slide {

	width: 100% !important;

	box-sizing: border-box;

	padding:50px 100px;

	display:flex;

	flex-direction:column;

}

.suositus-lainausmerkki img{

	margin:0 0 20px -60px;

}

.suositus-text {

	margin:0 0 50px 0;

}

.suositus-titteli, .yrityksen-nimi {

    font-size:.9em;

}

.suositus-info {

	font-family: 'HRSolutionsFont', sans-serif;

	font-size:1.2em;

	display:flex;

	align-items:center;

}

.suositus-vino {

	display:flex;

	align-items:center;

	margin:0 20px 0 0;

	width:20px;

	height:auto;

}

.suositus-controls {

	display: flex;

	position: absolute;

    bottom: 60px;

    left: 100%;

    transform: translateX(-100%);

    gap: 1rem;

    z-index: 10;

	padding:0 100px;

}



.swiper-pagination-1, .swiper-pagination-2, .swiper-pagination-3 {

    display: flex !important;

}



.swiper-pagination-bullet {

    width:12px !important;

    height:12px !important;

    background: #cac6c4 !important;

    border-radius:100%;

    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);

    cursor: pointer;

    opacity:1 !important;

}

.swiper-pagination-bullet-active {

    background: #bccf02 !important;         /* active color */

    transform: scale(1.5);    /* optional: slightly bigger */

    transition: all 0.3s;     /* smooth animation */

}

/*

.swiper-button-prev,

.swiper-button-next {

	position: static !important;

	color: #000 !important;

	width:40px !important;

	height:40px !important;

	border-radius:50px;

	font-size: 1.2em;

	cursor: pointer;

	background-color:#c5ca2a;

}

.swiper-button-prev:hover,

.swiper-button-next:hover {

	position: static !important;

	color: #fff !important;

	background-color:#ef5050;

}

.swiper-button-prev::after,

.swiper-button-next::after {

  content: none !important;

}*/



/*Haitari*/

.e-n-accordion-item {

	border-style:solid;

	border-color:#000;

	border-width:0 0 2px 0;

}

.e-n-accordion-item .haitari-valkoinen {

	border-style:solid;

	border-color:#000;

	border-width:0 0 2px 0;

}

h4.e-n-accordion-item-title-text{

	font-size:1.25em !important;

	font-weight:500;

	padding:10px 0;

}

.e-n-accordion-item-title {

	border-width:0 !important;

	padding:10px 0 10px 0 !important;

	justify-content:space-between !important;

}

.e-n-accordion-item p{

    font-size:1.1em !important;

    padding:0 !important;

}

/*haitari-valkoinen*/

.haitari-valkoinen .e-n-accordion-item{

	border-style:solid;

	border-color:#fff !important;

	border-width:0 0 2px 0;

}



/*Artikkeli*/

.nv-tags-list a{

	border-radius:50px;

	border:4px solid #98C541;

	background-color:rgba(0,0,0,0) !important;

	padding:10px 20px;

	color:#000000 !important;

}

.nv-tags-list a:hover {

	background-color:#98C541 !important;

	color:#000000;

}

.nv-post-cover {

    /*

    width:1920px;

    margin:0 auto;

    */

}

.nv-overlay {

    opacity:.85;

}

.artikkeli-content {

	display: flex;

	flex-wrap:wrap;

	gap: 35px;

}



/*Täysleveä kortti*/

.fullwidth-post {

	margin:0 0 50px 0;

}

.fullwidth-post .fullwidth-content {

	display: flex;

	flex-wrap: wrap;

	color:#000;

	background-color: #fff;

    border-radius: 20px;

    box-shadow: 0px 0px 10px rgba(0, 0, 0, .3) !important;

    overflow:visible !important;

}

.fullwidth-text .artikkeli-title-link {

    z-index: 1;

}

.fullwidth-text h2.artikkeli-title {

	color:#000;

	margin:0px 0 20px 0;

	z-index: 1;

}

.fullwidth-text .artikkeli-meta {

	font-size: 1em;

	font-weight:bold;

	margin:0 0 10px 0px;

	z-index: 1;

}

.fullwidth-container .artikkeli-meta {

	font-size: 1em;

	font-weight:bold;

	margin:0px 30px 10px 30px;

}

.fullwidth-post .fullwidth-text {

	flex: 1 1 50%;

	display: flex;

	flex-direction: column;

	padding:40px;	

}

.fullwidth-post .fullwidth-text::before {

	content: "";

	position: absolute;

	width:50%;

	top: 0; left: 0; right: 0; bottom: 0;

	background: url('') no-repeat 95% 100%;

	background-size: 150px;

	opacity: .1;

	z-index: 0; 

}

.fullwidth-post .fullwidth-text .artikkeli-text{

	overflow: hidden !important;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 8; 

	-webkit-box-orient: vertical;

	max-height: 14em; 

	margin:0 0 20px 0;

	font-size: 1.1em;

	z-index: 1;

}

.fullwidth-post .fullwidth-image-link {

	flex: 1 1 50%;

	z-index: 1;

}

.fullwidth-post .artikkeli-image,

.fullwidth-post .artikkeli-image.no-thumbnail {

	width: 100%;

	height: 100%;

	object-fit: cover;

	z-index: 1;

	border-radius:0 20px 20px 0;

}

.fullwidth-post .artikkeli-image.no-thumbnail {

    content: "";

	position: absolute;

	top: 0; left: 0; right: 0; bottom: 0;

	background: url('https://hrsolutions.fi/wp-content/uploads/2025/06/HR-Solutions-Icon-512px.png') no-repeat 85% 50%;

	background-size: 300px;

}



.fullwidth-post a.artikkeli-card-link-btn {

	position:relative;

    display: inline-flex;

    display:flex;

    width:200px;

    height:40px;

    align-items:center;

    justify-content:center;

	padding: 10px 25px 7px 25px;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0);

	transition:ease all .3s;

	color: #000;

	text-decoration: none;

	font-size:1.1em;

	overflow: hidden;

}

.fullwidth-post a.artikkeli-card-link-btn::after {

    content: "\f061";

    font-family: "Font Awesome 5 Free"; 

    font-size:.8em;

    font-weight: 600; 

    margin-left: 8px;

}

.fullwidth-post a.artikkeli-card-link-btn::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

.fullwidth-post a.artikkeli-card-link-btn:hover::before {

	transform: translateX(0) skewX(-10deg);

}





/*Alkovi-muotoilu blogi-korteille*/

.grid-post {

    position:relative;

    display: block;

	width: calc(33.8% - 30px);

}

.artikkeli-wrapper {

	position: relative;

	background-color: #093b6d;

    border-radius: 20px;

 /*   overflow:hidden; */

}

.grid-post .o {

	display: flex;

	position: absolute;

	height: 50px;

	background-color: #fcf8f5;

	bottom: 0;

	left: 0;

	border-top-right-radius: 20px;

}

.grid-post .o::before,

.grid-post .o::after {

	position: absolute;

	content: '';

	width: 24px;

	height: 24px;

	aspect-ratio: 1;

	background: radial-gradient(circle 24px at top right, transparent 98%, #fcf8f5);

}

.grid-post .o::before {

	left: 100%;

	top: 26px;

}

.grid-post .o::after {

	left: 0px;

	top: -24px;

}

.grid-post a.artikkeli-card-link-btn {

    position:relative;

    display: inline-flex;

    display:flex;

    width:100%;

    height:40px;

    align-items:center;

    justify-content:center;

    margin: 10px 10px 0 0;

	padding: 10px 25px 7px 25px;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0);

	transition:ease all .3s;

	color: #000;

	text-decoration: none;

	font-size:1.1em;

	overflow: hidden;

}

.grid-post a.artikkeli-card-link-btn::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

.grid-post a.artikkeli-card-link-btn:hover::before {

	transform: translateX(0) skewX(-10deg);

}

.grid-post a.artikkeli-card-link-btn::after {

    content: "\f061";

    font-family: "Font Awesome 5 Free"; 

    font-size:.8em;

    font-weight: 600; 

    margin-left: 8px;

}

.grid-post .artikkeli-image{

	width: 100%;

	height: 300px;

	object-fit: cover;

	background: #fff;

	border-radius:20px 20px 0 0;

}

.grid-post .artikkeli-image.no-thumbnail {

	width: 100%;

	height: 300px;

	object-fit: cover;

	background: #fff;

	border-radius:20px 20px 0 0;

	position: relative;

}

.grid-post .artikkeli-image.no-thumbnail::before {

	content: "";

	position: absolute;

	top: 0; left: 0; right: 0; bottom: 0;

	background: url('https://hrsolutions.fi/wp-content/uploads/2025/06/HR-Solutions-Icon-512px.png') no-repeat 50% 50%;

	background-size: 200px;

}



.grid-post h3.artikkeli-title {

	padding:20px 30px;

	font-size:1.5em;

	color:#fff;

	margin:0;

}

.grid-post .artikkeli-meta {

    color:#fff;

}

.grid-post .artikkeli-text {

	font-size: 1.1em;

	padding:0px 30px;

	margin:0 0 100px 0;

	overflow: hidden;

	text-overflow: ellipsis;

	display: -webkit-box;

	-webkit-line-clamp: 3; 

	-webkit-box-orient: vertical;

	max-height: 6em;

	color:#fff;

}

.pagination {

	margin: 60px 0 50px 0;

}

.pagination .page-numbers {

	margin: 0 5px 0 0;

	padding: 7px 25px;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0);

	transition:0s;

	color: #000000;

	text-decoration: none;

	font-size:1.1em;

}

.pagination .page-numbers:hover {

	background: #bccf02;

	color:#000000;

}

.pagination .page-numbers.current {

	border:3px solid #ef5050;

	background-color:rgba(0,0,0,0);

}

.pagination i{

	font-size:.9em;

}

.next.page-numbers i{

    margin: 0 0 0 5px;

}

.prev.page-numbers i{

    margin: 0 5px 0 0;

}



/*Vihko-muotoilu*/

#vihko-sininen, #vihko-punainen, #vihko-vihrea {

    position:relative;

}

#vihko-sininen {

    border:5px solid #093b6d;

}

#vihko-punainen {

    border:5px solid #ef5050;

}

#vihko-vihrea {

    border:5px solid #bccf02;

}



/*Artikkelin kirjoittaja*/

.author-info-widget {

	display: flex;

	align-items: center;

	margin: 20px 0;

	max-width:100%;

}

.author-info-widget .author-image {

	flex-shrink: 0;

	margin-right: 30px;

}

.author-info-widget .author-image img {

	width: 150px;

	object-fit: cover;

	border-radius:50%;

}

.author-info-widget .author-text {

    width:100%;

}

.author-info-widget .author-text h5 {

    font-weight:600;

	margin: 0;

	white-space: nowrap;

}

.author-info-widget .author-text p {

	margin: 5px 0;

	font-size:1em;

	white-space: nowrap;

}

.author-info-widget .author-text a {

	color: #000000;

	text-decoration: none;

	font-size:1em;

	white-space: nowrap;

}

.author-info-widget .author-text a:hover {

	text-decoration: none;

}



/*Avainsanat*/

.post-tags {

	display:flex;

	flex-wrap:wrap;

}

.post-tags .tag-item{

	border-radius:50px;

	border:3px solid #ef5050;

	font-weight:bold;

	padding:5px 15px;

	margin: 0 5px 5px 0;

	font-size:.9em;

	color:#000000;

}

.post-tags .tag-item:hover {

	background-color:#ef5050;

	color:#fff;

}



/*Artikkelien navigaatio*/

.post-navigation {

	display:flex;

	justify-content:space-between;

}

.nav-next {

	text-align:right;

	margin-left: auto;

	margin-right: 0;

}



/*Avainsanat alasivu*/

.hero-tag {

    position: relative !important;

    z-index: 1 !important;

    width:1300px;

    margin:0 auto;

}

.hero-tag h1{

	font-size:3.5em;

	padding:10px;

	margin:50px 0;

}

.tag-content {

	display: flex;

	flex-wrap:wrap;

	gap: 20px;

	margin:50px 0;

}

.ajankohtaista-button-container {

  margin: 40px 0;

}

.ajankohtaista-button {

    position: relative;

    display: inline-flex;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0) !important;

	transition:0s;

	color:#000;

	font-size:1.1em;

	font-weight:600;

	padding:8px 25px 4px 25px;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	z-index: 0;

}

.ajankohtaista-button::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

.ajankohtaista-button:hover::before {

	transform: translateX(0) skewX(-10deg);

}

.ajankohtaista-button::after {

    content: "\f061";

    font-family: "Font Awesome 5 Free"; 

    font-size:.8em;

    font-weight: 600; 

    margin-left: 8px;

}

.ajankohtaista-button:hover {

	color:#000 !important;

}



/*Interaktiivinen kuva*/

.imgl-theme-light .imgl-tooltips .imgl-tooltip-form {

    padding:15px !important;

}



.imgl-theme-light .imgl-tooltips .imgl-tooltip-form p span {

    font-family: 'Fustat', sans-serif !important;

    line-height:1em !important;

}

/*Footer*/

.site-footer {

	padding:50px 10px 50px 10px;

	background:#000000;

}



footer .widget {

	word-break: break-word;

	margin-bottom: 20px;

}

.footer-bottom {

	display:none;

}

.footer-some {

	gap:20px;

}



/*Footer*/

footer#site-footer.site-footer{

	position:relative;

	background:rgba(0,0,0,0);

	margin:0 0 50px 0;

	padding:0;

}

footer .hfg_footer {

	position:relative;

	background:#093b6d;

	margin:0 0 0px 0;

	padding:50px 10px 100px 10px;

}





/*Footer alkovi*/

.site-footer {

	width: 100%;

	max-width: 1920px; 

	left: 50%;

	transform: translateX(-50%);

	background-color:#093b6d !important;

}

.site-footer .container {

	max-width:100%;

}

.hfg_footer {

	width: 100%;

	max-width: 1366px;

	bottom: 0;

	left: 50%;

	transform: translateX(-50%);

}

.footer-main{

	position: absolute;

	height: 59px;

	background-color: #fcf8f5;

	width: 50%;

	bottom: 0;

	left: 0%;

	transform: translateX(0%);

	border-top-right-radius: 20px;

}

.footer-main .footer-main-inner .row .hfg-slot.left .widget-area{

    display:flex;

    flex-direction:row;

    align-items:center;

    justify-content:space-between;

    padding:5px 0 0 0;

}

.footer-main .footer-main-inner .row .hfg-slot.left .widget-area a{

    color:#000 !important;

}

.footer-main .footer-main-inner .row .hfg-slot.left .widget-area a:hover{

    text-decoration:underline;

}



.footer-main .footer-main-inner .row .hfg-slot.left .widget-area .widget {

    margin:0 0 0 0;

}

.footer-main .footer-main-inner .row .hfg-slot.left .widget-area .widget:last-child {

    margin:0 20px 0 0;

}

.footer-main::before {

	position:absolute;

	content:'';

	width:100%;

	height:70px;

	left:-280px;

	background:#fcf8f5;

}

.footer-main::after {

	position: absolute;

	content: '';

	width: 24px;

	height: 24px;

	aspect-ratio: 1;

	background: radial-gradient(circle 24px at top right, transparent 98%, #fcf8f5);

	left: 99.9%;

	top: 36px;

}

.footer-main .footer-some {

	transform: translateX(0%);

}

.site-footer::before {

	content: '';

	position: absolute;

	inset: 0;

	background: #bccf02;

	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='90,0 100,0 100,100 82,100'/%3E%3C/svg%3E");

	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='90,0 100,0 100,100 82,100'/%3E%3C/svg%3E");

	mask-size: 100% 100%;

	-webkit-mask-size: 100% 100%;

	z-index: 999;

	pointer-events: none;

	opacity:1;

}



footer#site-footer.site-footer h2, 

footer#site-footer.site-footer p, footer#site-footer.site-footer p a{

	color:#fff;

}

footer#site-footer.site-footer p a:hover{

    text-decoration:underline;

}



footer#site-footer.site-footer h2{

	font-size:1.7em;

}

footer#site-footer.site-footer p{

	font-size:1em;

}

.footer-top-inner .row{

	grid-template-columns:1fr 1fr 1fr !important;

	grid-column-gap: 50px;

}

.footer-top-inner .hfg-slot.left {

	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 35 112' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.62,1c.24,0,.5.01.78.04,1.69.17,3.65,1.72,3.89,4.69v.99c-.22,2.84-2.37,6.35-8.65,10.76C3.37,13.07,1.22,9.56,1,6.72v-.99c.24-2.97,2.2-4.52,3.89-4.69.28-.03.54-.04.78-.04,1.96,0,2.9.85,3.97,2.13,1.08-1.28,2.01-2.13,3.97-2.13' fill='none' stroke='%23fff' stroke-width='3' transform='translate(27,1) scale(.3)'/%3E%3Cpath d='M30 0 V95 A5 5 0 0 1 25 100 H15' stroke='%23fff' stroke-width='.7' fill='none' transform='translate(0, 10)'/%3E%3Ccircle cx='12' cy='100' r='1.5' fill='white' transform='translate(0, 10)'/%3E%3C/svg%3E");

  background-repeat: no-repeat;

  background-position: right center;

  background-size: contain;

	padding:0 50px 0 0;

}

.footer-top-inner .hfg-slot.c-left {

	margin:0 0 0 100px;

}

.footer-top {

	margin:0 0 50px 0;

}





/*Footer painikkeet*/

a.wp-block-button__link {

	position: relative;

	display: inline-flex;

	border-radius:50px;

	border:3px solid #bccf02;

	background-color:rgba(0,0,0,0) !important;

	transition:0s;

	font-size:1em;

	font-weight: 500;

	padding:7px 25px;

	align-items: center;

	justify-content: center;

	overflow: hidden;

	color:#fff;

	z-index: 0;

}

a.wp-block-button__link::before {

	content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

a.wp-block-button__link:hover::before {

	transform: translateX(0) skewX(-10deg);

}

a.wp-block-button__link::after {

	content: "\f061";

	font-family: "Font Awesome 5 Free"; 

	font-size:.8em;

	font-weight: 600; 

	margin-left: 8px;

}

a.wp-block-button__link:hover {

	color:#000;

}

/*Päävalikko */

.hrsolutions-header {

	display: flex;

	position: relative;

	justify-content:space-between;

	width: 100%;

	max-width: 1920px; 

	top: 0;

	left: 50%;

	transform: translateX(-50%); 

	padding: 10px 20px;

	z-index:9998;

}

.logo-container {

	max-width: 250px;

	margin:20px 0 0 0;

}

.hrsolutions-mega-menu .mega-menu-items {

	display: flex;

	list-style: none;

}

.hrsolutions-mega-menu .mega-menu-items > li {

	font-family: 'HRSolutionsFont', sans-serif;

	margin-right: 20px;

}

.hrsolutions-mega-menu .mega-menu-items > li:last-child {

	margin-right: 0;

}

.hrsolutions-mega-menu .mega-menu-items > li a{

    position: relative;

	color:#000;

	font-weight:500;

	font-size:1em;

}

.underline-hover {

  position: relative;

  text-decoration: none;

  color: black;

}

.hrsolutions-mega-menu .mega-menu-items > li a::after {

  content: "";

  position: absolute;

  left: 0; bottom: 0;

  width: 100%;

  height: 2px;          /* thickness of the border */

  background-color: black;

  transform: scaleX(0);

  transform-origin: left;  /* grow from left */

  transition: transform 0.3s ease;

}

.hrsolutions-mega-menu .mega-menu-items > li a:hover::after {

  transform: scaleX(1);

}



/* Submenu asettelu */

.hrsolutions-mega-menu .mega-menu-container {

	position: absolute;

	display: none;

	left: auto !important; right: 0;

	background: #fff;

	padding: 10px;

	z-index: 9999;

	border-radius:0;

	box-shadow: 0px 5px 10px rgba(0,0,0,.4);

}

.hrsolutions-mega-menu .mega-menu-container.active {

	display: block;

	position: fixed;

	top: 100% !important; 

	width: 100%;

	max-width: 800px;

}	

.hrsolutions-mega-menu .mega-menu-container.active::before {

    content: "";

    position: absolute;

    top:-48px;right:0;

    height:60px;

    width:100%;

}



/*Submenu otsikko*/

.mega-menu-container.active .submenu-left .submenu-title a{

	font-size:1.1em;

	font-weight: 500;

	color:#000;

	margin:0 10px 10px 10px;

	border-radius:10px;

	padding:10px 0;

}

.mega-menu-container.active .submenu-left .submenu-title a:hover{



}

.mega-menu-container.active .submenu-left .submenu-title .fa-solid.fa-arrow-right {

	font-size: .9em;

	margin:8px 10px 0 0;

	transition:ease all .2s;

}

.mega-menu-container.active .submenu-left .submenu-title a:hover .fa-solid.fa-arrow-right  {

	margin:8px 0 0 0;

}

.mega-menu-columns{

	display: flex;

	width: 100%;

	padding:10px;

}

.mega-menu-columns a {

	text-shadow: 1px 1px 5px rgba(0,0,0,0) !important;

}

/* Vasen kolumni */

.submenu-left {

	width: 50%;

}

.submenu-list {

	width: 100%;

	list-style: none;

}

.submenu-left .submenu-list li{

	margin:0 0 10px 0;

}

.submenu-left .submenu-list li:last-child {

	margin:0 0 0 0;

}

.submenu-left .submenu-list li a {

	font-size:.8em;

	font-weight:400;

	text-decoration: none;

	color: #000;

	border-radius:5px;

	background:#fcf8f5;

	padding:5px 10px;

	margin: 0 0 0 0px;

	position:relative;

	overflow:hidden;

}

.submenu-left .submenu-list li a::before {

    content: '';

	position: absolute;

	top: 0;

	left: -10px;

	width: 120%;

	height: 100%;

	background: #bccf02;

	transform: translateX(-100%) skewX(-10deg);

	transition: transform 0.3s ease;

	z-index: -1;

}

.submenu-left .submenu-list li a:hover::before {

	transform: translateX(0) skewX(-10deg);

}

.submenu-left .submenu-list li a::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 0px;

  background-color: black;

  transform: scaleX(0);

  transform-origin: left;

  transition: transform 0.3s ease;

}

.submenu-left .submenu-list li a:hover {

	color:#000;

}

.fa-solid.fa-arrow-right {

	float:right;

	font-size: 1em;

	margin:4px 0 0 0;

	opacity:1;

}

.submenu-left .submenu-list li a .fa-solid.fa-arrow-right{

	margin: 6px 10px 0 0;

	transition:ease all .2s;

}

.submenu-left .submenu-list li a:hover .fa-solid.fa-arrow-right{

	margin: 6px 0 0 0;

}





.fa-solid.fa-chevron-down {

	font-size: .9em;

	transition: transform 0.2s ease; 

}

.mega-menu-container a {

	padding: 10px;

	display: block;

}

/* Oikea kolumni */

.submenu-description {

	display:flex;

	width: 60%;

	padding: 0 0 0 20px;

	margin:0 0px;

	border-left: 0px solid #000;

	font-size: .9em;

	line-height:1.4em;

	align-items:center;

}

.submenu-description strong{

	font-size: 1.125em;

}

.submenu-description p{

	font-size: 1em;

	margin: 5px 0 0 0;

}

.submenu-description img{

	max-width: 100px;

	height: 100%;

	object-fit:contain;

	margin:0 20px 0 0;

}

.submenu-description li{

	font-size: 1.2em;

	list-style-type: disc;

	list-style-position: inside;

}

.menu-arrow .mobile-arrow {

	display: none;

}



/* Mobiilinäkymä */

.menu-toggle {

	display: none;

}

#hamburger-menu {

	background: rgba(255,255,255,0);

	width:50px;

	height:50px;

	font-size:1.2em;

	border:2px solid #093b6d;

}

#hamburger-menu.open{

	background: #093b6d;

}

#hamburger-menu i{

	color:#093b6d;

}

#hamburger-menu.open i{

	color:#fff;

}

.mobile-logo-container {

	display: none;

}

.header-right {

	display: flex;

	align-items: center;

}



[tabindex="-1"]:focus, input:read-write:focus, select:focus, textarea:focus {

    outline: 0;

    box-shadow: 0 0 0px 0 var(--nv-secondary-accent);

    --formfieldbordercolor: var(--nv-secondary-accent);

}





/* Responsiivisuudet */

@media (max-width: 1280px) {

    

    h1 {

        font-size:;

    }

    h2 {

        font-size:2em;

    }

    

    h3 {

        font-size:;

    }

    

    h4 {

        font-size:;

    }

    h5 {

        font-size:;

    }

    h6 {

        font-size:;

    }

    

    

    #hero::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    }

    #hero-ala::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='48,0 100,0 100,100 43,100'/%3E%3C/svg%3E") !important;

    }

    

    /*Palvelu-linkit*/

    .palvelu-linkki span::after{

    	margin-left: 15px;

    }

    .palvelu-linkki span a{

    	width: 300px;

    	padding:20px 0 10px 50px;

    }

    .palvelu-linkki span a::after {

      width: 250px;

    }

    .palvelu-linkki span:hover::after {

      margin-left: 20px;

    }

    

    

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 80%;

        margin-right:42px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 98%;

    }



    

    .elementor-element.img-container::before {

    	background-position: 50% 50%;

    	background-repeat:no-repeat;

    	background-size: auto 800px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.nosto-container::before {

    	background-position: 10% 40%;

    	background-repeat:no-repeat;

    	background-size: auto 600px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.banner-container::before {

    	background-position: 170% 40%;

	background-repeat:no-repeat;

	background-size: auto 500px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }



	.valinta-controls {

    	left: 95%;

    	transform: translateX(-95%);

    	bottom:-30px;

    }

	.hero-tag {

		padding:150px 10px 20px 10px;

		background-image: url('');

		background-size: cover;

		background-repeat: no-repeat;

		background-position: 100% 0%;

	}

	.hero-tag h1{

		font-size:3em;

	}

	.tag-content {

		margin:20px 0;

	}

	.elementor-element.icon-container::before {

    	mask-size: 0% 0%;

    	-webkit-mask-size: 0% 0%;

    }

	.icon-container::before, 

	.icon-overlay img,

	.icon-overlay{

	    opacity:0 !important;

		display:none !important;

	}

	.card-slider {

    	margin:30px 0 0 0;

    }

    

    .counter {

    	font-size:2.3em;

    	font-weight:700;

    }

    .counter-teksti {

    	font-size:1.3em;

    	font-weight:600;

    }

    

    /* Suositukset - Slider - Swiper */

    .suositus-outer-container::before {

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='28,0 100,0 100,100 23,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='28,0 100,0 100,100 23,100'/%3E%3C/svg%3E");

    }

    .suositus-container {

    	width: 72%;

    }

    .suositus-slide {

    	padding:30px 75px;

    }

    .suositus-lainausmerkki img{

    	margin:0 0 20px -60px;

    }

    .suositus-controls {

        bottom: 60px;

        left: 100%;

        transform: translateX(-100%);

    	padding:0 100px;

    }

    

    /* Matkamme - Slider - Swiper */

    .matka-slide {

      padding: 30px;

      height:300px !important;

    }

    .matka-text {

        max-width:60%;

    }

    .matka-image {

        width: 200px;

    }

    .swiper-slide h3{

        width:63%;

    }

    .hfg_footer {

    	width: 85%;

    }

    .footer-top-inner .hfg-slot.c-left {

    	margin:0 0 0 50px;

    }

}

@media (max-width: 1212px) {

    

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 77%;

        margin-right:44px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 97%;

    }

    

    .elementor-element.nosto-container::before {

    	background-position: 20% 40%;

    }

    .elementor-element.banner-container::before {

    	background-position: 220% 40%;

	    background-repeat:no-repeat;

    	background-size: auto 500px;

    }

    /* Matkamme - Slider - Swiper */

    .matka-slide {

      padding: 30px;

      height:300px !important;

    }

    .matka-text {

        max-width:68%;

    }

    .matka-image {

        width: 150px;

    }

}



@media (max-width: 1100px) {

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 74%;

        margin-right:42px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 97%;

    }

}



@media (max-width: 1024px) {

	html, body {

		height: 100%;

		overflow: hidden;

	}

	.container, .row {

        width: 100%;

      }

	#hero::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='30,0 100,0 100,100 25,100'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='30,0 100,0 100,100 25,100'/%3E%3C/svg%3E") !important;

    }

    #hero-ala::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='30,0 100,0 100,100 25,100'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='30,0 100,0 100,100 25,100'/%3E%3C/svg%3E") !important;

    }

    

    .elementor-element.img-container::before {

    	background-position: 10% 50%;

    	background-repeat:no-repeat;

    	background-size: auto 800px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='80,0 100,0 100,100 70,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='80,0 100,0 100,100 70,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.nosto-container::before {

    	background-position: 140% 40%;

    	background-repeat:no-repeat;

    	background-size: auto 400px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.banner-container::before {

    	background-position: 180% 40%;

    	background-repeat:no-repeat;

    	background-size: auto 500px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }



	.hrsolutions-otsikko span{

	    font-size:3em;

	}

	.counter {

    	font-size:2.2em;

    	font-weight:700;

    }

    .counter-teksti {

    	font-size:1.2em;

    	font-weight:600;

    }

	.swiper-slide h3{

        width:100%;

    }

    

	/*Palvelu-linkit*/

    .palvelu-linkki span::after{

    	margin-left: 15px;

    }

    .palvelu-linkki span a{

    	width: 250px;

    	padding:20px 0 10px 50px;

    }

    .palvelu-linkki span a::after {

      width: 200px;

    }

    .palvelu-linkki span:hover::after {

      margin-left: 20px;

    }

    

    .m-container .m {

    	width: 50%;

    }

    /* Matkamme - Slider - Swiper */

    .matka-slide {

      padding: 30px;

      height:300px !important;

    }

    .matka-slide h3{

        max-width:60%;

    }

    .matka-text {

        max-width:60%;

    }

    .matka-image {

        width: 175px;

    }

    /*Mobiilimenu*/

	.hrsolutions-mega-menu.active {

		position: fixed;

		overflow-y: auto;

		-webkit-overflow-scrolling: touch;

	}

	.hrsolutions-mega-menu:not(.active) {

		display: none;

	}

	body.menu-open {

		overflow: hidden;

	}

	body:not(.menu-open) {

		overflow: auto;

	}

	.menu-toggle {

		display: block; 

		z-index: 10000; 

		margin-right:10px;

	}

	.hrsolutions-mega-menu {

		display: none;

		position: fixed;

		top: 0;

		left: 0;

		width: 100%;

		height: 100vh;

		background-color: #fcf8f5;

		z-index: 9999;

		flex-direction: column; 

		overflow-y: auto;

		padding-top: 10px;

	}

	.hrsolutions-mega-menu.active {

		display: flex; 

	}

	.logo-container {

		margin:15px 0 0 0;

	}

	.mobile-logo-container {

		display:block;

		max-width:250px;

		margin:15px 10px 0 20px;

	}

	.hrsolutions-mega-menu .mega-menu-items {

		display: flex;

		flex-direction:column;

		width: 100%;

		padding:20px 20px;

	}

	.hrsolutions-mega-menu .mega-menu-items li{

		width:100%;

		margin:10px 0 0 0;

		background:rgba(255,255,255,0);

		border:3px solid #093b6d;

		border-radius:15px;

		

		position: relative;

		overflow: hidden;

	}

	.hrsolutions-mega-menu .mega-menu-items li a {

		display:block;

		color:#000;

		padding:10px 20px;

		width:100%;

		text-shadow: 1px 1px 5px rgba(0,0,0,0);

		

		transition:ease all .2s;

	}

	.hrsolutions-mega-menu .mega-menu-items li::before {

		content: '';

    	position: absolute;

    	top: 0;

    	left: -10px;

    	width: 120%;

    	height: 100%;

    	background: #093b6d;

    	transform: translateX(-100%) skewX(-10deg);

    	transition: transform 0.3s ease;

    	z-index: -1;

	}

	.hrsolutions-mega-menu .mega-menu-items li:hover::before {

    	transform: translateX(0) skewX(-10deg);

    }

    .hrsolutions-mega-menu .mega-menu-items li a:hover {

    	color:#fff !important;

    }

	.hrsolutions-mega-menu .mega-menu-items .submenu-left .submenu-list {

		padding:0px 0 0 0px;

	}

	.hrsolutions-mega-menu .mega-menu-items .submenu-left li {

		margin:10px 0;

	}

	.hrsolutions-mega-menu .mega-menu-items > li a{

    	border-bottom:0px solid #fcf8f5;

    }

    .hrsolutions-mega-menu .mega-menu-items > li a::after {

      height: 0px;

    }

	.mega-menu-columns{

    	padding:0;

    	margin:12px 0 0 0;

    }

	/* Submenu otsikko - Mobiili */

	.mega-menu-container.active .submenu-left .submenu-title a{

		padding:10px 20px;

    	color:#000;

    	font-weight:500;

    	font-size:1em;

    	background: rgba(255, 255, 255, 0);

        border: 3px solid #093b6d;

        border-radius: 15px;

    	margin:0;

    	overflow:hidden;

	}

	.mega-menu-container.active .submenu-left .submenu-title a::before {

		content: '';

    	position: absolute;

    	top: 0;

    	left: -10px;

    	width: 120%;

    	height: 100%;

    	background: #093b6d;

    	transform: translateX(-100%) skewX(-10deg);

    	transition: transform 0.3s ease;

    	z-index: -1;

	}

	.mega-menu-container.active .submenu-left .submenu-title a:hover::before {

    	transform: translateX(0) skewX(-10deg);

	}

	

	.submenu-left .submenu-list li a::before {

    	background: #093b6d;

    }

	

	.mega-menu-container.active .submenu-left .submenu-title .fa-solid.fa-arrow-right {

		font-size: .9em;

		opacity:1;

		transition:ease all .2s;

	}

	.fa-solid.fa-chevron-down {

		float:right;

		font-size: 1em;

		transform:rotate(-90deg) !important;

		margin:5px 0 0 0;

	}

	.fa-solid.fa-arrow-right {

		float:right;

		font-size: 1em;

		margin:6px 10px 0 0;

		transition:ease all .2s;

	}

	.hrsolutions-mega-menu .mega-menu-items li a:hover .fa-solid.fa-arrow-right {

	    margin:6px 0 0 0;

	}

    .menu-arrow .desktop-arrow {

		display: none;

	}

	.menu-arrow .mobile-arrow {

		display: inline-block;

	}



	/* Style for the back button */

	button.back-button {

		background-color: rgba(255,255,255,0);

		color:#000;

		padding: 10px 5px;

		font-family: 'HRSolutionsFont', sans-serif;

		font-size: 1.1em;

		cursor: pointer;

		display: flex;

		align-items: center;

		margin: 10px 0;

		width: 100%;

	}

	.back-button i {

		margin-right: 10px;

		font-size: .8em;

	}

	.hrsolutions-mega-menu .mega-menu-container {

    	box-shadow: 2px 0px 5px rgba(0,0,0,0);

    }

	.hrsolutions-mega-menu .mega-menu-container.active {

		top: 100% !important; 

		width: 100%;

		max-width: 100%; 

		padding:10px 20px;

		background:#fcf8f5;

	}	

	.mega-menu-container .submenu-left {

		width:100%;

		height:100vh;

	}

	.mega-menu-container .submenu-description {

		display: none;

	}

	.testimonial-item {

		flex-direction: column;

		padding: 20px 10px 20px 10px;

		gap:20px;

		justify-content:center;

		align-items:center;

		text-align:center;

	}

	.testimonial-logo {

		max-height:75px;

	}

	.testimonial-logo img{

		width:100%;

	}

	.testimonial-info {

		margin:10px 0 0 0;

	}

	.testimonial-dots {

		padding:0 0 20px 0;

	}

	.fullwidth-post {

		margin:0 0 0 0;

	}	

	.fullwidth-post .fullwidth-content {

		flex-direction:column-reverse;

	}

	.fullwidth-post .artikkeli-image,

	.fullwidth-post .artikkeli-image.no-thumbnail {

		height: 200px;

	}

	.fullwidth-post .artikkeli-image.no-thumbnail {

    	background-size: 0px;

    }

	.fullwidth-post .fullwidth-text {

		padding:20px;	

	}

	.fullwidth-post .fullwidth-text::before {

    	width:100%;

    }

	.fullwidth-post .fullwidth-text .artikkeli-text{

		margin:0 0 100px 0;

	}

	.fullwidth-post a.artikkeli-card-link-btn {

		bottom:20px;

	}

	.grid-post {

		width: calc(100% - 0px);

	}

	.nv-post-cover {

		padding:150px 0 20px 0;

	}

	.author-info-widget {

		display: flex;

		flex-direction:column;

		margin: 20px 0 20px 0;

		align-items: start;

	}

	.author-info-widget .author-image {

		margin: 0 0 20px 0;

	}

	.author-info-widget .author-image img {

		width: 150px;

		object-fit: cover;

	}

	.author-info-widget .author-text p, .author-info-widget .author-text a {

		font-size:1em;

	}

	.hero-tag {

		padding:150px 10px 20px 10px;

	}

	.hero-tag h1{

		font-size:3em;

	}



	/* Suositukset - Slider - Swiper */

    .suositus-outer-container {

    	width: 100%;

    }

    .suositus-outer-container::before {

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 100,0 100,100 0,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 100,0 100,100 0,100'/%3E%3C/svg%3E");

    }

    .suositus-container {

    	width: 100%;

    }

    .suositus-slide {

    	padding:20px 50px;

    }

    .suositus-lainausmerkki img{

    	margin:0 0 20px -30px;

    }

    .suositus-text {

    	margin:0 0 50px 0;

    }

    .suositus-controls {

        bottom: 40px;

        left: 95%;

        transform: translateX(-95%);

    	padding:0 10px;

    }

    

    .footer-top-inner .row {

		grid-template-columns:1fr 1fr !important;

		grid-column-gap: 0px;

	}

	.footer-top-inner .hfg-slot.c-left{

		margin:0 0 0 50px;

	}

	.footer-top-inner .hfg-slot.left {

		padding:0 20px 0 0;

	}

	.footer-main .footer-main-inner .row .hfg-slot.left .widget-area{

        display:flex;

        flex-direction:column;

        align-items: flex-start;

        gap:10px;

    }

	.elementor-element.icon-container::before {

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

	.icon-container::before, 

	.icon-overlay img,

	.icon-overlay {

	    opacity:1 !important;

		display:block !important;

	}

	.prosessi-grid {

	    margin-top:-50px !important;

	}

	.prosessin-vaihe {

        width:100%;

    }

    .prosessin-vaihe:nth-child(1), .prosessin-vaihe:nth-child(3), .prosessin-vaihe:nth-child(5) {

      height:200px;

    }

    .prosessin-vaihe:nth-child(1)::before,.prosessin-vaihe:nth-child(2)::before,.prosessin-vaihe:nth-child(3)::before,.prosessin-vaihe:nth-child(4)::before,.prosessin-vaihe:nth-child(5)::before {

        content: '';

        position: absolute;

        top: 100%;          /* start from bottom of the element */

        left: 50%;          /* center horizontally relative to the element */

        width: 2px;         /* thickness of the line */

        height: 150px;       /* length of the vertical line */

        background-color: #093B6D;

        transform: translateX(-50%); /* center the line horizontally */

        z-index: 0;

    }

    .prosessin-vaihe::after {

        content: counter(step-counter);

        position:absolute;

        top:-20px; left:-10px;

    }

    #haitari-nosto .e-n-accordion-item-title-text {

    	padding:10px 0px 10px 10px;

    }

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 85%;

        margin-right:44px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 95%;

    }

    .hfg_footer {

    	width: 100%;

    }

}



@media (max-width: 976px) {

    /* Matkamme - Slider - Swiper */

    .matka-slide {

      padding: 30px;

      height:300px !important;

    }

    .matka-slide h3{

        max-width:60%;

    }

    .matka-text {

        max-width:60%;

    }

    .matka-image {

        width: 40%;

    }

}



@media (max-width: 950px) {

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 85%;

        margin-right:46px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 95%;

    }

}



@media (max-width: 767px) {

	.hero-tag h1{

		font-size:2.5em;

	}

	.hrsolutions-otsikko span{

	    font-size:2.8em;

	}

	#hero {

        position: relative !important;

        z-index: 1 !important;

        background-size: auto 100% !important;

        background-position: left center !important;

        background-repeat: no-repeat !important;

        background-color:#093b6d;

    }

    .e-con>.elementor-background-slideshow, :is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container {

    	position: relative !important;

    	z-index:-1 !important;

    	width:100% !important;

    	height:350px !important;

    }

    #hero-ala {

        position: relative !important;

        z-index: 1 !important;

    }

    #hero-ala .hero-container {

        position: relative !important;

        margin-top:250px;

        background-color:#093b6d;

    }



    .elementor-element.img-container::before {

    	background-position: 10% 50%;

    	background-repeat:no-repeat;

    	background-size: auto 800px;

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='100,0 100,0 100,100 100,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='100,0 100,0 100,100 100,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.nosto-container::before {

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='100,0 100,0 100,100 100,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    .elementor-element.banner-container::before {

    	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='75,0 100,0 100,100 65,100'/%3E%3C/svg%3E");

    	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='100,0 100,0 100,100 100,100'/%3E%3C/svg%3E");

    	mask-size: 100% 100%;

    	-webkit-mask-size: 100% 100%;

    }

    

	#hero::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 0,0 0,0 0,0'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 0,0 0,0 0,0'/%3E%3C/svg%3E") !important;

    }

    #hero-ala::before {

        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 0,0 0,0 0,0'/%3E%3C/svg%3E") !important;

        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon fill='white' points='0,0 0,0 0,0 0,0'/%3E%3C/svg%3E") !important;

    }

    

    /*Palvelu-linkit*/

    .palvelu-linkki span::after{

    	margin-left: 15px;

    }

    .palvelu-linkki span a{

    	width: 85%;

    	padding:20px 0 10px 0px;

    	font-weight:bold;

    }

    .palvelu-linkki span a::after {

      width: 0%;

    }

    .palvelu-linkki span:hover::after {

      margin-left: 20px;

    }

    .m-container .m {

    	width: 60%;

    }

	.elementor-element.icon-container::before {

    	mask-size: 0% 0%;

    	-webkit-mask-size: 0% 0%;

    }

	.icon-container::before, 

	.icon-overlay img,

	.icon-overlay {

	    opacity:0 !important;

		display:none !important;

	}

	/* Matkamme - Slider - Swiper */

    .matka-slide {

      padding: 20px;

      height:100% !important;

    }

    .matka-text {

        max-width:60%;

    }

    .matka-image {

        width: 40%;

    }

    /*Footer*/

    .footer-top-inner .row{

		grid-template-columns:1fr !important;

	}

	.footer-top-inner .hfg-slot.c-left {

		margin:50px 0 0 0;

	}

	.footer-top-inner .hfg-slot.left {

		padding:0 20px 0 0;

	}

	footer .hfg_footer::before {

		opacity:0;

	}

	.site-footer::before {

    	opacity:0;

    }

    #haitari-nosto .e-n-accordion-item-title-text::after{

        width: 85%;

        margin-right:44px;

    }

    #haitari-nosto .e-n-accordion-item-title-text:hover::after{

        width: 85%;

    }

}

@media (max-width: 350px) {

	.logo-container, .mobile-logo-container {

		max-width:200px;

	}

	#hamburger-menu {

		width:40px;

		height:40px;

		font-size:1em;

		padding:10px;

	}

	.hrsolutions-otsikko span{

	    font-size:2.5em;

	}

}