/*!
Theme Name: Virnex Theme
Theme URI: http://underscores.me/
Author: Virnex Group Oy
Author URI: https://virnex.fi/
Description: Custom theme: Virnex Theme, developed by Virnex
Version: 2.0.2
License: GNU General Public License v2 or later
License URI: LICENSE
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-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.

Theme is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

/* Bootrap media exsamples
@media (max-width: 991.98px) {}
@media (max-width: 767.98px) {}
@media (max-width: 575.98px) {}
*/

/* ANCHOR SITE BASE HTML reset 
   The basic structure of the page is the bottom, don't change it. 
   - This forces the footer and header into place so that the footer is at the end of the page.
*/

html { height: 100%; }
html.admin-bar { height: calc(100% - 32px); }
body {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
}
header#site-header,
footer#site-footer {
	flex: 0 0 auto;
	background-color: var(--grey);
}
#site-wrapper {
	flex: 1 0 auto;
	/* overflow-x: auto; */
}

/* ANCHOR - SITE wrapper */

#site-wrapper {
	padding: var(--gap-md) 0;
}

/* ANCHOR - HEADER */

#site-header {
	padding: var(--gap-md) 0;
}
#header-section {
	display: flex;
	gap: var(--gap);
	justify-content: space-between;
}
#header-section__controls {
	width: 100%;
}
.site-seach-form {}
.site-seach-form label {
	margin: 0;
}

@media (max-width: 767.98px) {}

@media (min-width: 992px) {
	.media-desktop {}
	.media-mobile {
		display: none!important;		
	}
}
@media (max-width: 991.98px) {
	.media-desktop {
		display: none!important;
	}
	.media-mobile {}
}

/* ANCHOR - FOOTER */

#site-footer {
	padding: var(--gap-md) 0;
}

footer {
	position: relative;
}

/* NOTE - Back to top button */

#back-to-top {
	position: fixed;
    background-color: var(--brand-primary-color);
    bottom: 74px; /* do not set less to work word mobile menu plugin */
    right: 20px;
	padding: 0 5px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#back-to-top:hover, 
#back-to-top:focus {
	opacity: 0.7;
	text-decoration: none;
}
#back-to-top > i {
	color: white;
}
/* LOADER */
.loader {
	display: block;
	margin: 0 auto 40px;
	color: transparent!important;
	background-color: transparent!important;
	width: 50px;
	height: 50px;
	border: 4px solid #FF3363;
	border-bottom-color: transparent;
	border-radius: 50%;
	box-sizing: border-box;
	animation: sub-product-loading 1s linear infinite;
}
.loader:before {
	height: 0!important;
}
@keyframes sub-product-loading {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/* ANCHOR - /functions/template-functions.php */

/* NOTE - get_subnavigation() */

.get_subnavigation {}
.get_subnavigation header {
	font-size: var(--fs-md);
}
.get_subnavigation a {
    color: black;
    padding: var(--gap) 0;
    width: 100%;
    display: block;
}
ul.sub_navigation
{
    list-style: none;
    padding: 0;
    margin: 0;
	margin-left: var(--gap-md);
}
ul.sub_navigation li.current-menu-item
{
    font-weight: 600;
}

/* NOTE - get_post_navigation() */

.post_navigation
{
	display: flex;
	justify-content: space-between;
	gap: var(--gap-md);
}

/* ARTIKKELILISTAUS */

.post-category {
	width: 0px;
	height: 1px;
}
.post-category-label {
	display: inline-block;
	margin-right: 10px;
	padding: 10px;
	cursor: pointer;
}
.post-category:checked + .post-category-label {
	background-color: #FF3363;
    color: white;
}
.post-category:focus-visible + .post-category-label {
	outline: 2px #FF3363 solid;
}

#loader-container {
    height: 80px;
}
#load-more:disabled {
    opacity: 0.7;
    pointer-events: none;
}

#pagination p {
	margin: 0;
	font-size: 1.1rem;
}
#pagination button {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 28px;
	width: 28px;
	background-color: #FF3363;
	color: white;
	border: none;
}
#pagination button:disabled {
	opacity: 0.5;
}
#pagination button.prev,
#pagination p#current-page {
	margin-right: 10px;
}
#pagination button.next {
	margin-left: 10px;
}
#pagination #max-number {
	margin-left: 10px;
}