/*!
Theme Name: Meita Base Two Child Hytetarjotin
Theme URI: https://meita.fi
Template: meita-theme-basetwo
Author: Lauri Merisaari
Author URI: https://meita.fi
Description: Child theme for Meita Base Two. Block theme based and inspired of Meita Base one and Twenty Twenty Two
Requires at least: 6.0
Tested up to: 6.1
Requires PHP: 8.0
Version: 0.0.202
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: meitabasetwo
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, accessibility-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned
with others.

All files, unless otherwise stated, are released under the GNU General Public
License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)
*/

/* 
 * CSS Global variables
 *
 * Overwrite these in child theme to globally control defaults
 * Original can be found in src/css/variables.scss
 */
 :root {

    --meita-custom-nav-elements-border-width: 1px;
    
    --meita-custom-forms-input-border: 1px;
    --meita-custom-forms-input-border-style: solid;
    --meita-custom-forms-input-border-color: #808080;
    --meita-custom-forms-input-pg: white;
    --meita-custom-forms-input-border-radius: 8px;

    /* All buttons defaults, can be owerwriten in site editor */
    --meita-custom-default-border-radius: 15px;
    --meita-custom-button-padding: 11.7px;
    --meita-custom-button-hpadding: 16.7px;
    --megamenu-container-padding: 3em;
    --megamenu-nav-hpadding: 1em;

    /* Default animation duration */
    --animate-duration: 0.3s;

}


/** HEADER **/


/* headerin navigaatio */



header .joensuu-logo img{
	margin-bottom:4px;
}
header ul.main-menu {
		gap: 3rem;
	}

header .main-menu li a{
	padding: 0px !important;
	border-radius: 8px;
}
header .main-menu li{
	padding: 8px 16px;
}

header .main-menu .navi-etusivu a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/home-1.png');
	vertical-align: middle;
	margin-right: 6px;
}
header .main-menu .navi-ajankohtaista a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/breaking_news_alt_1.png');
	vertical-align: middle;
	margin-right: 6px;
}
header .main-menu .navi-haku a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/Size24.png');
	vertical-align: middle;
	margin-right: 6px;
}
header .main-menu .navi-kategoriat a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/category-1.png');
	vertical-align: middle;
	margin-right: 6px;
}
li.wp-block-navigation-item.suosittele a:after {
    content: url(https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/vector-stroke.png);
    vertical-align: middle;
    margin-left: 6px;
}
header li.wp-block-navigation-item.current-menu-item a:after{
	filter: contrast(0%) brightness(2);
}

header li.wp-block-navigation-item.current-menu-item{
	background-color: #288F7E;
	color:#fff;
	padding: 8px 16px;
    border-radius: 8px;
}
header li.wp-block-navigation-item.current-menu-item a:before{
	/*filter: brightness(0) invert(1);*/
	filter: contrast(0%) brightness(2);
}
header .toinen li.wp-block-navigation-item.current-menu-item{
	background-color: #288F7E;
	color:#fff;
	padding: 6px 6px !important;
    border-radius: 8px;
}
header .toinen li.wp-block-navigation-item.current-menu-item a{
	padding: 0px !important;
}

header li.wp-block-navigation-item.header-sydan a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/SelectedFalse.png');
	vertical-align:middle;
	display: inline-block;
    width: 24px;
    height: 24px;
}
header li.wp-block-navigation-item.header-sydan span.wp-block-navigation-item__label{
	display:none;
}
header li.wp-block-navigation-item.kello a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/notifications.png');
	vertical-align:middle;
	display: inline-block;
    width: 24px;
    height: 24px;
}
header li.wp-block-navigation-item.kello span.wp-block-navigation-item__label{
	display:none;
}
header li.wp-block-navigation-item.person a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/Size24-2.png');
	vertical-align:middle;
	display: inline-block;
    width: 24px;
    height: 24px;
}
header li.wp-block-navigation-item.person span.wp-block-navigation-item__label{
	display:none;
}



/** YLEISIÄ ASETUKSIA **/

.entry-content p>a{
	text-decoration:none;
}

.nuoli img{
	vertical-align: middle;
}
.wp-block-search{
	border-radius:8px;
	background-color:#949494;
}

.kategoria-painikkeet a{
	position:relative;
}

.kategoria-painikkeet a:after{
	position:absolute;
	right:10px;
}
.kategoria-painikkeet .liikunta-nappi a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/icon-category.png');
	vertical-align: middle;
	display: inline-block;
	height: 22px;
    margin-bottom: 6px;
    margin-right: 8px;
}

.kategoria-painikkeet .ravitsemus-nappi a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/icon-category-1.png');
	vertical-align: middle;
	display: inline-block;
	height: 22px;
    margin-bottom: 6px;
    margin-right: 8px;
}
.kategoria-painikkeet .elintapaohjaus-nappi a:before{
	content: url('https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/icon-category-2.png');
	vertical-align: middle;
	display: inline-block;
	height: 22px;
    margin-bottom: 6px;
    margin-right: 8px;
}

.wp-block-query .wp-block-post-title a{
	text-decoration:none;
}

/** MEDIA JA TEKSTI LOHKON MUOTOILUT **/

.wp-block-media-text__media img{
	border-radius: 0 0 0 10px;
}
.wp-block-media-text{
	border-radius: 0 0 10px 10px;
}
.tekstialue .wp-block-media-text__content  {
	border-radius: 8px 0px 0px 0px;
}

.tekstialue .wp-block-media-text__media { 
	border-radius: 0px 8px 0px 0px;
}

/** KUVA JA TEKSTI **/

.aktiivinen{
	position:relative;
	display:block;
}

.wp-block-group.kansi-kategoriat p{
	border-radius:5px;	
}
.wp-block-group.kansi-kategoriat p > a{
	border-radius:5px;
}

/** SISÄLTÖLISTAUS **/

.haku-listaus .kate a{
	border-radius:5px;
	background-color:#DFE6EB;
	padding:5px;
	text-decoration:none;
}
.kate{
	position: absolute;
    left: 10px;
    bottom: 10px;
}


.wp-admin .sydan{
	position: absolute;
    right: 10px;
    top: 10px;
}

.sydan{ 
	width: 24px;
    height: 24px;
    margin: 0px 0px !important;
    padding: 6px;
    background-color: white;
    border-radius: 8px;
	position: absolute;
    right: 10px;
    top: 10px;
}
.wp-admin .kansikuva{
	position:relative;
}

.kansikuva{
	position:relative;
}
.laatikko{
	height: 360px;
    min-height: 360px;
	border-radius:8px;
}
.sarakkeet{
	max-width: 100%;
    justify-content: center;
    margin: auto;
}
.haku-listaus span.page-numbers.current{
	background-color: #608098;
    padding: 5px 10px;
    border-radius: 120px;
    margin: 0 8px;
	color:white;
}
.haku-listaus a.page-numbers{
	 margin: 0 8px;
}

.haku-listaus span.wp-block-query-pagination-next-arrow.is-arrow-chevron { 
	background-color: #608098;
    padding: 6px 16px;
    color: white;
    border-radius: 8px;
}

.haku-listaus span.wp-block-query-pagination-previous-arrow.is-arrow-chevron{
	background-color: #608098;
    padding: 6px 16px;
    color: white;
    border-radius: 8px;
}
.haku-listaus .wp-block-column{
	border-radius:8px;
	height: 410px;
    max-height: 100%;
}


/** LISÄNAPIT **/

/* painikkeen perässä oleva nuoli */

.wp-block-buttons>.wp-block-button.is-style-arrow-right a:after{
	content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06' clip-rule='evenodd'/%3E%3C/svg%3E");
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	color: currentColor;
	margin-left: 4px;
	

}
.wp-admin .wp-block-button.is-style-arrow-right .wp-block-button__link:after{
	content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06' clip-rule='evenodd'/%3E%3C/svg%3E");
	display: inline-block;
	width: 24px;
	height: 24px;
	vertical-align: middle;
	color: currentColor;
	margin-left: 4px;
}


/** HERO ja kaareva erotus alue **/

/*.tekstialue .wp-block-media-text__content {
	background-color: transparent!important;
	position: relative;
}
.tekstialue .wp-block-media-text__content > * {
	position: relative;
	z-index: 2;
}*/
/*.tekstialue .wp-block-media-text__content::after {
	position: absolute;
	inset: 0;
	width: 700px;
	z-index: 1;
	display: block;
	content: '';
	background-image: url("https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/vector-siunsote-1-2.svg");
	background-size: cover;
  	background-repeat: no-repeat;
  	background-position: 0 15%;
	border-radius: 8px 0px 0px 0px;
}
.tekstialue .wp-block-media-text__media {
	position: relative;
  	z-index: -1;
  	margin-left: -15%;
}
*/

/** SIVUPOHJA ARTIKKELIT **/

.wp-block-column.artikkeli-sarake{
	border-radius: 8px;
	position:relative;
}

.murupolkurivi a{
	text-decoration:none;
}
.murupolkurivi .yoast-breadcrumbs{
	font-size:14px;
	color:#003359;
	font-weight: 700;
}
.artikkeli-sarake .taxonomy-post_tag{
	display: flex;
}

.artikkeli-sarake .taxonomy-post_tag a{
	text-decoration:none;
	border-radius:5px;
	background-color:#DFE6EB;
	padding:5px;
	border: 1px solid #BFCCD6;
	display: flex;
    flex-wrap: wrap;
	
}
.artikkeli-sarake .variboxi {
    width: 100%;
}
.artikkeli-sarake{
	position:relative;
	height: 100%;
}


.artikkeli-sarake .wp-block-outermost-icon-block{
	background-color: white;
    padding: 10px;
    border-radius: 8px;
	border: 1px solid #BFCCD6;
}

.artikkeli-sarake .turkoosi-alaosa{
	position:absolute;
	bottom: 0;
}

/* OWL-SLIDER */
.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next {
  position: absolute!important;
  top: 40%!important;
  display: block;
  background-color: #dfe6eb!important;
  padding: 1rem!important;
  border-radius: 8px!important;
  width: 2rem;
  height: 2rem;
  border: 1px solid #608098 !important;
  color: black !important;
}
.owl-carousel .owl-nav button.owl-prev {
	left: -2.5rem!important;
}
.owl-carousel .owl-nav button.owl-next {
	right: -1.8rem!important;
}

@media screen and (min-width: 74em){
	.pinkkilaatikko{
		position: absolute;
		display: block;
		bottom: auto;
		z-index: 10;
		right: -15%;
		width: 100%;
		top: -9em;
		transform: translate(0%);
	}
	.tekstialue .wp-block-media-text__content::after {
		position: absolute;
		inset: 0;
		width: 700px;
		z-index: 1;
		display: block;
		content: '';
		background-image: url("https://hytetarjotin.meitademo.fi/wp-content/uploads/2024/06/vector-siunsote-1-2.svg");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: 0 15%;
		border-radius: 8px 0px 0px 0px;
	}
	.tekstialue .wp-block-media-text__content {
		background-color: transparent!important;
		position: relative;
	}
	.tekstialue .wp-block-media-text__content > * {
		position: relative;
		z-index: 2;
	}
	.tekstialue .wp-block-media-text__media {
		position: relative;
		z-index: -1;
		margin-left: -15%;
	}


@media only screen and (max-width: 1005px){
	.owl-carousel .owl-nav button.owl-prev {
		left: 1rem!important;
	}
	.owl-carousel .owl-nav button.owl-next {
		right: 1rem!important;
	}
}

@media only screen and (max-width: 1005px){
	.pinkkilaatikko{
		position:relative;
		bottom: auto;
        right: auto;
	}
	.laatikko{
		height:100%;
	}
}

@media only screen and (max-width: 960px){
	header .main-menu {
		gap: 2rem;
	}
	.tekstialue .wp-block-media-text__content::after{
		width:100%;
	}
	.pinkkilaatikko{
		position:relative;
		bottom: auto;
        right: auto;
	}
	.etusivun-painikkeet .wp-block-button{
		width: auto !important;
	}
	.tekstialue .wp-block-media-text__media{
		margin-left: 0;
	}
	
}


@media screen and (max-width: 600px){
	.haku-tulokset{
		display: flex;
	}
	.sarakkeet{
		max-width:50%;
	}
}
