html {
	scroll-behavior : smooth;
}

.content-area-mobile {
    padding-top: var(--wp--preset--spacing--30) !important;
}

/*Etusivun asettelut */
.introduction-buttons {
	padding-top : 53vh;
	padding-bottom : 20vh;
}

.hero-grid > *:nth-child(even) {
  margin-top : 35vh;
}

.hero-grid {
	padding-bottom : 20vh;
}

@media (max-width: 768px) {
	/* Etusivun asettelu mobiilissa */
    .hero-grid {
        grid-template-columns: 1fr; 
        gap: 1.5rem;
    }
		.hero-grid > *:nth-child(even) {
  			margin-top : 0vh;
	}
	.content-area-mobile {
    padding-top: var(--wp--preset--spacing--0) !important;
}
	h1 {
		font-size : 24px;
	}
	body {
		font-size : 16px;
	}
	h3 {
		font-size : 22px
	}
	.introduction-buttons {
	padding-top : 50vh;
	padding-bottom : 20vh;
}
	.margin-mobile {
		margin-top : 18px !important;
	}
}


/*Navigaation linkkien tyylit */
.wp-block-categories-list a {
  text-decoration: none;
}
.wp-block-categories-list {
	list-style : none;
}

/*Teeman oletustyylin (borderin) nollaus */
.wp-block-group {
	border-width: 0px
}

/* Korttielementtien tekstien muotoilua */
.wp-block-post-excerpt__excerpt {
	display : -webkit-box;
	-webkit-line-clamp : 8;
	line-clamp : 8;
	-webkit-box-orient : vertical;
	overflow : hidden;
}

/*Mobiilinäkymän hampurilaisvalikon taustaväri + tekstin väri*/
.wp-block-post-title a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
	line-clamp : 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.search-desktop button {
	padding : 2px 4px
}

.search-desktop input {
	height : 10px;
	color: #ffffff;
}

.categories-mobile select {
	width : 100%;
  padding: 10px 14px;
  border-radius: 5px;
	color : #dddddd;
	border-color : #202631;
  background-color: #202631;
}

@media (min-width: 768px) {
	.content-area-mobile {
		padding : 0px
	}
}

@media (min-width: 2560px) {
	body{
			font-size : 20px;
	}
	h1 {
		font-size : 2em;
	}
	.introduction-buttons {
	padding-top : 65vh;
	padding-bottom : 20vh;
}
}

.front-page-header {
	position: sticky;
  top: 0;
  z-index: 9999;
}

.editor-styles-wrapper {
  background-color: #fff;
}

