@import "fonts.css";

html, body, div, p{
	font-family: "Inter", Arial, sans-serif;
	font-size:1rem;
	line-height:1.6;
	font-weight:400;
	overflow-wrap: break-word;
	word-wrap: break-word;
	color:#000;
}

body{
	background-color:#F8F8F8;
}

/*TYPOGRAPHY*/

h1, h2, h3, h4, h5, h6{
	font-weight:700;
	color:#000;
	font-family: "Poppins", Arial, sans-serif;
}

h1{
	font-weight:700;
	font-size:2.625rem;
	margin:0 0 20px 0;
}

h2{
	font-size:2rem;
	margin:30px 0 14px 0;
	
}

h3{
	font-size:1.75rem;
	margin:30px 0 10px 0;
	
}

footer h2{
	color:#fff;
	margin-top:10px;
}

a, a:link, a:visited{
	text-decoration:none;
	color:#0D76C2;
}

a:active, a:hover{
	color:#000;
}

input[type=reset]{
	background-color:rgb(215, 215, 215);
	border-radius:4px;
	color:#000;
	padding:8px 30px;
	font-weight:600;
	border:none;
}

input[type=reset]:hover{
	background-color:rgb(192, 192, 192);
}

.wpcf7-form textarea{ 
    width: 100% !important;
    height:166px;
}

.wpcf7-form input{
	width: 100% !important;
}

.wpcf7-form input[type=submit]{
	width: auto !important;
}

.text-right .btn{
	float:right;
	margin-right:-12px;
}

.text-left .btn{
	float:left;
	margin-left:-12px;
}

/*TABLE STYLES*/

table{
	border:1px solid rgb(192, 192, 192);
	margin:10px 0;
}

tr{
	border-bottom:1px solid rgb(192, 192, 192);
}

th, tr, td{
	padding:8px 10px;
}

/*LAYOUT*/

.site-wrapper{
	margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
}

.content-wrapper{
	margin:0 auto;
	padding:0;
	max-width:1100px;
	flex: 1 0 auto;
}

.header-wrapper{
	background-color: #3C488B;
    width: 100%;
	z-index: 6;
	display:block;
}

.header-wrapper.transparent{
	background-color: transparent;
}

.site-header{
	padding:1rem 2rem;
	display: flex;
	align-items: center;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    position: relative;
    z-index: 7;
}

.page-content, .single-content, .main-content{
	padding:60px 0;
	clear:both;
	max-width:768px;
}

.single-content{
	margin:1.875rem auto;
}

.archive-content{
	padding:0;
}

.blog{
	background-color:#fff;
}

.articles article{
	width:100%;
	background-color:#fff;
}

.page-content.not-found, .page-content.search-results{
	margin:30px auto;
}

.single-content{
	margin-bottom:40px;
}

/*BUTTONS*/

button, input.submit, input[type=submit], input[type=button], .wp-bootstrap-blocks-button .btn-primary, a.btn-primary{
	background-color:#505B99;
	border-radius:4px;
	color:#fff;
	padding:8px 30px;
	font-weight:600;
	border:none;
	border:2px solid #505B99;
	transition: 0.6s;
	border-radius:30px;
	font-family:'Poppins', sans-serif;
}

button:hover, input.submit:hover, input[type=submit]:hover, input[type=button]:hover, .wp-bootstrap-blocks-button .btn-primary:hover, a.btn-primary:hover, .btn-primary:first-child:hover, :not(.btn-check)+.btn-primary:hover{
	background-color:#424c81;
	border:2px solid #424c81;
}

.wp-bootstrap-blocks-button .btn-secondary, a.btn-secondary{
	background-color:transparent;
	border-radius:4px;
	color:#fff;
	padding:8px 30px;
	font-weight:600;
	border:2px solid #fff;
	transition: 0.6s;
}

.wp-bootstrap-blocks-button .btn-secondary:hover, a.btn-secondary:hover, .btn-secondary:first-child:hover, :not(.btn-check)+.btn-secondary:hover{
	background-color:#fff;
	color:#000;
	border:2px solid #fff;
}

a.btn-primary-alt{
	background-color:transparent;
	border-radius:4px;
	color:#32ba96;
	padding:8px 30px;
	font-weight:600;
	border:none;
	border:2px solid #32ba96;
	transition: 0.6s;
}

a.btn-primary-alt:hover, .btn-primary-alt:first-child:hover, :not(.btn-check)+.btn-primary-alt:hover{
	background-color:#32ba96;
	border:2px solid #32ba96;
	color:#fff;
}

.apply-before{
	margin-bottom:1.25rem;
	font-style:oblique;
}

/*NAVIGATION*/

.brand, .site-header__secondary-menu{
	flex-basis: 20%;
}

.site-header__secondary-menu .main-navigation{
	justify-content: flex-end;
}

.brand img{
	height:24px;
}

.main-navigation ul{
	list-style:none;
	margin:0 auto;
	padding:0;
}

.main-navigation ul li{
	margin:0 14px;
	padding:0;
	display:inline-block;
}

.main-navigation ul li a{
	font-family: "Poppins", Arial, sans-serif;
	font-size:16px;
	font-weight:700;
	color:#fff;
	display:block;
	line-height: 24px;
	padding:4px 0;
	transition: 0.6s;
    text-transform:uppercase;
}

.main-navigation ul li.current-menu-item a{
	border-bottom:4px solid #F75E00;
}

.main-navigation ul li:hover > a{
	opacity:0.7;
}

.main-navigation ul li li:hover a{
	color:#000;
}

.hide-desktop{
	display:none;
}

/*HERO*/

.frontpage-hero{
	position:relative;
	z-index:1;
	min-height:70vh;
	display:flex;
    flex-direction: column;
	align-items:center;
	justify-content:center;
	background: rgb(102,116,194);
	background: radial-gradient(52.25% 52.25% at 50% 50%, #6674C2 0%, #424C87 100%);
}

.frontpage-hero img{
	margin-bottom:20px;
}

.frontpage-hero h1{
    font-size:3rem;
    color:#fff;
}

.frontpage-hero p{
    font-size:1.25rem;
    color:#fff;
}





.home .frontpage-hero{
	min-height:520px;
	display:flex;
    flex-direction: column;
	align-items:center;
	justify-content:center;
}

.home .header-hero__page{
	padding:140px 0 100px 0;
}

.home .site-header{
	align-items: center;
}

.header-hero__page{
	color:#fff;
	padding:18rem 2rem 6rem 2rem;
	text-align:center;
	z-index:4;
	position:relative;
}

.hero-heading, .hero-excerpt{
	max-width:54rem;
	margin:0 auto;
}

.header-hero__page .hero-heading{
	color:#fff;
	margin-bottom:0.75rem;
	font-size:3.5rem;
}

.push-content{
	height:10rem;
	background-color:#000;
}

.top-line-heading{
	color:#fff;
	font-size:1.25rem;
	font-style:oblique;
}

.hero-excerpt, .hero-excerpt p{
	color:#fff;
	font-size:1.25rem;
}

.call-to-actions{
	margin:2rem 0;
}

.call-to-actions a{
	margin:0 0.125rem;
}

.header-hero__compact{
	padding:6rem 0 0 0;
	max-width:780px;
	margin:0 auto;
	clear:both;
}

.header-hero__compact .hero-heading{
	color:#000;
	margin-bottom:1.5rem;
}

.header-hero__compact .hero-excerpt, .header-hero__compact .hero-excerpt p{
	color:#000;
	font-size:1.125rem;
}

.header-hero__compact .hero-excerpt{
	margin-bottom:-40px;
}

.header-hero.with-bg{
	background-size:cover;
	background-position:center center;
	background-repeat: no-repeat;
	min-height:360px;
}

.header-hero{
	display:flex;
	justify-content: center;
	align-items: center;
	position:relative;
}

.header-hero__overlay{
	background: rgba(0,0,0, 0.8);
	background: linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.5) 95%);
	position: absolute;
    top: 0;
    left: 0;
	width:100%;
	height:100%;
	z-index:1;
}

.header-hero__meta{
	position:relative;
	max-width:760px;
	margin:0 auto;
	padding:40px 0 0 0;
	text-align:center;
	z-index:10;
}

.header-hero.with-bg{
	padding:60px 0;
}

.header-hero.with-bg .header-hero__meta__date, .header-hero.with-bg .header-hero__meta h1{
	color:#fff;
}

.header-hero__meta h1, .header-hero__meta_date{
	color:#000;
}


/*SUBPAGE HERO*/

.hero{
	padding:0 0 10px 0;
	margin-bottom:20px !important;
	max-width:768px;
	background:url(../images/bottom-line.svg) bottom left no-repeat;
}

.hero h1{
	max-width:70%;
}

.hero p{
	font-size:1.25rem;
}







/*FOOTER*/

.site-footer {
	background-color:#3C488B;
	min-height:450px;
	padding:40px 0 20px 0;
	color:#fff;
}

.site-footer .custom-logo{
	margin:10px 0 20px 0;
}

.site-footer .row{
	margin-top:20px;
}

.site-footer .row div, .site-footer .row p{
	font-size:1rem;
	text-align:left;
	color:#fff;
}

.site-footer a{
	color:#fff;
}

.site-footer a:hover{
	opacity:0.6;
}

.site-footer img{
	max-height:42px;
	width:auto;
}

.site-footer h2{
	font-size:1.25rem;
    text-transform:uppercase;
}

.footer{
	max-width:1100px;
}



.row.footer-bottom{
	border-top:1px solid rgba(177, 177, 205, 0.3);
	padding:20px 0;
	margin:40px -1rem 40px -1rem;
}

.footer-bottom__right p{
	float:right;
	margin-top:2px;
}

input, textarea{
	border:0 solid #E0E0E0;
	padding:16px;
	background-color:#fff;
	border-radius:5px;
	margin:4px 0;
}

/*SEARCH*/

.search-from__wrapper{
	margin:20px 0;
}


/* Mobile */
@media only screen and (max-width: 990px) { 
	
	.frontpage-hero h1{
		font-size:2rem;
		color:#fff;
	}
	
	.frontpage-hero p{
		font-size:1rem;
		color:#fff;
	}
	
	.hero h1{
		max-width:100%;
	}

	.footer-menu2 ul li{
		float:left;
		width:50%;
	}

	.content-wrapper{
		margin:0 auto;
		padding:0;
	}

	.container{
		max-width:940px;
	}

	.page-content, .single-content{
		padding: 2rem 1.5rem;
	}
	
	.quote-cards-wrapper{
		margin-left  : calc( -100vw / 2 + 100% / 2 );
		margin-right : calc( -100vw / 2 + 100% / 2 );
		max-width    : 100vw;
		width: 100vw;
		position:relative;
		margin-top:0;
		padding:1rem;
	}

	.site-footer{
		padding:2.5rem 1rem;
	}

	.row.footer-middle{
		margin:2rem 0;
		text-align:center;
	}

	.row.footer-middle h3{
		margin-top:2rem;
		font-size:1.5rem;
	}

	.row.footer-middle a, .footer-contact{
		line-height:2;
		font-size:1rem;
	}

	.row.footer-bottom p{
		text-align:center;
		float:none;
	}

	.footer-bottom__left{
		margin-left:0.75rem;
	}
	
	.menu-main-menu-container, .menu-paavalikko-container{
		display:block;
		overflow:hidden;
	}

	.site-header{
		display: flex;
		align-items: center;
		justify-content:space-between;
		padding:0.5rem 1rem;
	}

	.home .header-hero__page{
		padding:8.75rem 1.5rem 6.25rem 1.5rem;
	}

	.brand{
		z-index:99;
	}

	.main-navigation{
		display:flex;
		align-items: center;
		justify-content:center;
	}

	.main-navigation button{
		background-color:transparent;
		border:none;
	}

	/*SECONDARY MENU*/

	.main-navigation ul.navbar-nav{
		background-color:#3C488B;
		width:100vw;
		height:100vh;
		position:fixed;
		top:0;
		left:0;
		padding:11rem 4rem;
		z-index:998;
	}

	.menu-secondary-menu-container, .menu-apuvalikko-container{
	height: 16vh;
	width:100vw;
    display: block;
    z-index: 1000;
    right: 0;
    bottom: 0;
    position: fixed;
	}

	.menu-secondary-menu-container .hide-desktop, .menu-apuvalikko-container .hide-desktop{
		display:block;
		position:relative;
		z-index:1001;
		width:80vw;
		text-align:center;
	}
	.menu-secondary-menu-container ul, .menu-apuvalikko-container ul{
		margin:0 auto;
	}

	.menu-secondary-menu-container ul li, .menu-apuvalikko-container ul li{
		width:60% !important;
		display:inline-block !important;
	}
	
	a.lang-sel:hover{
		opacity:0.6;
	}

	.menu-secondary-menu-container ul li.lang-sel, .menu-apuvalikko-container ul li.lang-sel{
		width:30% !important;
	}

	li.lang-sel a{
		padding:0 !important;
	}

	/* --/ SECONDARY */

	.main-navigation ul li{
		margin:6px 0;
		height:auto;
		width:100%;
		display:block;
	}
	
	.main-navigation ul li a{
		color:#fff;
		height:auto;
		font-size:1.375rem;
		line-height: 2rem;
		text-align: center;
	}

	span.home-link{
		margin:0 auto;
	}

	.menu-item-has-children:hover .sub-menu {
		display: block;
		background-color: #000;
		position: relative;
		top: auto;
		left: auto;
		height: auto;
		border: none;
	}

	.sub-menu, .site-header__secondary-menu{
		display:none;
		background-color:transparent;
	}

	ul.sub-menu{
		padding:10px 0 0 0;
		width:100%;
	}
	
	ul.sub-menu li{
		margin:0;
		padding:0;
		height:auto;
		text-align:center;
	}
	
	ul.sub-menu li a{
		display:block;
		text-transform:none;
		font-weight:normal;
		font-size:18px;
		color:#000;
		line-height: 1.4;
		padding:6px;
	}
	
	.navbar-toggler{
		border:0;
		padding:0;
		margin:10px auto;
		width:100%;
		font-size:22px;
		font-weight:600;
		color:#fff;
	}
	.navbar-toggler-icon{
	background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='rgba(255, 255, 255, 100%)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>");
}

	.navbar-toggler .close{
		display:none;
		z-index:999;
	}

	.navbar-toggler[aria-expanded="true"] .close, .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon{
		display:block;
	}

	.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon, .navbar-toggler[aria-expanded="false"] .close{
		display:none;
	}

	.navbar-toggler .close {
		box-sizing: border-box;
		position: fixed;
		top:3.75rem;
		right:2rem;
		display: block;
		transform: scale(var(--ggs,1));
		width: 30px;
		height: 30px;
		border: 2px solid transparent;
		border-radius: 40px;
		transition:0.6s;
	}

	.navbar-toggler .close::after,
	.navbar-toggler .close::before {
		content: "";
		display: block;
		box-sizing: border-box;
		position: absolute;
		width: 30px;
		height: 2px;
		background: #fff;
		transform: rotate(45deg);
		border-radius: 5px;
		top: 8px;
		left: 1px
	}
	.navbar-toggler .close::after {
		transform: rotate(-45deg)
	}

	.navbar-toggler:focus{
		box-shadow:none;
	}
	
	.site-header__menu{
		padding:0;
	}

	.header-hero__wrapper{
		min-height:10rem;
	}
	
	.header-hero__compact{
		padding:6rem 0.75rem 0 0.75rem;
	}

	.header-hero__page{
		padding:9rem 1rem 2.5rem 1rem;
	}

	.header-hero__page .hero-heading{
		font-size:2.75rem;
	}
	
	.footer .container.row div p {
		margin-left:auto;
		margin-right:auto;
	}

	.main-navigation ul li.current-menu-item a{
		border-bottom:none;
		color:#7987db;
	}

}