/*
MAIN STYLES FOR EPLIITTO
Valakia Interactive, Mika Autio, Jarkko Ruonakoski
*/

/* FONTS */

@font-face {
	font-family: 'Aleo';
	src: url('/wp-content/themes/epliitto/fonts/Aleo-Regular.woff') format('woff');
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: 'Aleo';
	src: url('/wp-content/themes/epliitto/fonts/Aleo-Bold.woff') format('woff');
	font-style: normal;
	font-weight: 700;
}

@font-face {
	font-family: 'Raleway';
	src: url('/wp-content/themes/epliitto/fonts/Raleway-Regular.woff') format('woff');
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: 'Raleway';
	src: url('/wp-content/themes/epliitto/fonts/Raleway-SemiBold.woff') format('woff');
	font-style: normal;
	font-weight: 600;
}

@font-face {
	font-family: 'Raleway';
	src: url('/wp-content/themes/epliitto/fonts/Raleway-Bold.woff') format('woff');
	font-style: normal;
	font-weight: 700;
}

@font-face {
	font-family: 'Raleway';
	src: url('/wp-content/themes/epliitto/fonts/Raleway-ExtraBold.woff') format('woff');
	font-style: normal;
	font-weight: 800;
}

/* CSS CUSTOM PROPERTIES */

:root {
	--black: #010101;
	--yellow: #eca725;
	--lightyellow: #ffebb7;
	--blue: #3d8ebf;
	--lightblue: #50c0ff;
	--navy: #244f5f;
	--darkblue: #002f3b;
	--violet: #755ab5;
	--red: #b94b51;
	--lightred: #ff949a;
	--white: #ffffff;
	--grey: #f7f6f5;
	--darkgrey: #dadad8;
	--seethroughblue: rgba(36, 79, 95, 0.8);
	--raleway: Raleway;
	--aleo: Aleo;
	--pagepadding: 5%; /* Koko sivuston reunusten koko (osa on suhteutettuna tähän) */
}

/* FONTS - -
- - RALEWAY - Thin 100 • Extra-light 200 • Light 300 • Regular 400 • Medium 500 • Semi-bold 600 • Bold 700 • Extra-bold 800 • Black 900
- - ALEO - Light 300 • Regular 400 • Bold 700 */

body {font-size: 18px !important; font-family: var(--raleway);}
p {font-family: var(--raleway); font-size: 100% !important;} p strong {font-weight: 700;}
a, a:visited, p a {color: var(--darkblue); text-decoration: underline; transition: all 0.1s ease;}
a:hover, p a:hover, li a:hover {color: var(--violet) !important;}
/*a:hover, a:active { color: var(--white); }*/
pre {font-family: var(--raleway);}
h1, h2, h3, h4, h5, h6 { font-family: var(--raleway); color: var(--darkblue); hyphens: auto; }
h1 { font-weight: 400; }
iframe, embed, object { min-height: 400px; min-width: 200px; }

.home p { font-family: var(--raleway); margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0; margin-inline-end: 0; }

/* GLOBAL */

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.arrow-divider { width: 100%; height: 150px; background-color: var(--white); background-image: url('../svg/kuusi-separaattori-bg1.svg'); background-size: 25px 30px; background-repeat: repeat; }
.arrow-divider-grey {width: 100%; height: 150px; background-color: var(--grey); background-image: url('../svg/kuusi-separaattori-bg1.svg'); background-size: 25px 30px; background-repeat: repeat; }
.page { margin: 0; }
.arrow-right-yellow { fill: var(--yellow); }
.arrow-up-white { fill:var(--white); }
:focus, a:focus, input[type="search"]:focus, button:focus { outline-style: dashed; outline-color: var(--navy); outline-offset: 2px; }
.screen-reader-text:focus { background-color: var(--yellow) !important; color: var(--darkblue) !important; }
.entry-content { margin: 0px; }
table { font-family: var(--raleway); }
ul, ol { margin-left: 0px; font-family: var(--raleway); }
.wpcf7-text { width: 100%; }

/* GUTENBERG */

.wp-block-image { background-color: transparent !important; }
div .wp-block-image { display: inline-block; }
.wp-block-image figcaption { padding: 0; margin: 0; font-style: italic; }
.wp-block-column { word-break: normal; overflow-wrap: normal; }

/* GUTENBERG ––> WP6 nollausta  */
.wp-container-1, .wp-container-2, .wp-container-3, .wp-container-4, .wp-container-5, .wp-container-6, .wp-container-7, .wp-container-8, .wp-container-9, .wp-container-10,
.wp-container-11, .wp-container-12, .wp-container-13, .wp-container-14, .wp-container-15, .wp-container-16, .wp-container-17, .wp-container-18, .wp-container-19, .wp-container-20,
.wp-container-21, .wp-container-22, .wp-container-23, .wp-container-24, .wp-container-25, .wp-container-26, .wp-container-27, .wp-container-28, .wp-container-29, .wp-container-30,
.wp-container-31, .wp-container-32, .wp-container-33, .wp-container-34, .wp-container-35, .wp-container-36, .wp-container-37, .wp-container-38, .wp-container-39, .wp-container-40,
.wp-container-41, .wp-container-42, .wp-container-43, .wp-container-44, .wp-container-45, .wp-container-46, .wp-container-47, .wp-container-48, .wp-container-49, .wp-container-50,
.wp-container-51, .wp-container-52, .wp-container-53, .wp-container-54, .wp-container-55, .wp-container-56, .wp-container-57, .wp-container-58, .wp-container-59, .wp-container-60,
.wp-container-61, .wp-container-62, .wp-container-63, .wp-container-64, .wp-container-65, .wp-container-66, .wp-container-67, .wp-container-68, .wp-container-69, .wp-container-70,
.wp-container-71, .wp-container-72, .wp-container-73, .wp-container-74, .wp-container-75, .wp-container-76, .wp-container-77, .wp-container-78, .wp-container-79, .wp-container-80,
.wp-container-81, .wp-container-82, .wp-container-83, .wp-container-84, .wp-container-85, .wp-container-86, .wp-container-87, .wp-container-88, .wp-container-89, .wp-container-90,
.wp-container-91, .wp-container-92, .wp-container-93, .wp-container-94, .wp-container-95, .wp-container-96, .wp-container-97, .wp-container-98, .wp-container-99, .wp-container-100,
.wp-container-101, .wp-container-102, .wp-container-103, .wp-container-104, .wp-container-105, .wp-container-106, .wp-container-107, .wp-container-108, .wp-container-109, .wp-container-110,
.wp-container-111, .wp-container-112, .wp-container-113, .wp-container-114, .wp-container-115, .wp-container-116, .wp-container-117, .wp-container-118, .wp-container-119, .wp-container-120,
.wp-container-121, .wp-container-122, .wp-container-123, .wp-container-124, .wp-container-125, .wp-container-126, .wp-container-127, .wp-container-128, .wp-container-129, .wp-container-130,
.wp-container-131, .wp-container-132, .wp-container-133, .wp-container-134, .wp-container-135, .wp-container-136, .wp-container-137, .wp-container-138, .wp-container-139, .wp-container-140,
.wp-container-141, .wp-container-142, .wp-container-143, .wp-container-144, .wp-container-145, .wp-container-146, .wp-container-147, .wp-container-148, .wp-container-149, .wp-container-150,
.wp-container-151, .wp-container-152, .wp-container-153, .wp-container-154, .wp-container-155, .wp-container-156, .wp-container-157, .wp-container-158, .wp-container-159, .wp-container-160,
.wp-container-161, .wp-container-162, .wp-container-163, .wp-container-164, .wp-container-165, .wp-container-166, .wp-container-167, .wp-container-168, .wp-container-169, .wp-container-170,
.wp-container-171, .wp-container-172, .wp-container-173, .wp-container-174, .wp-container-175, .wp-container-176, .wp-container-177, .wp-container-178, .wp-container-179, .wp-container-180,
.wp-container-181, .wp-container-182, .wp-container-183, .wp-container-184, .wp-container-185, .wp-container-186, .wp-container-187, .wp-container-188, .wp-container-189, .wp-container-190,
.wp-container-191, .wp-container-192, .wp-container-193, .wp-container-194, .wp-container-195, .wp-container-196, .wp-container-197, .wp-container-198, .wp-container-199, .wp-container-200,
.wp-container-201, .wp-container-202, .wp-container-203, .wp-container-204, .wp-container-205, .wp-container-206, .wp-container-207, .wp-container-208, .wp-container-209, .wp-container-210,
.wp-container-211, .wp-container-212, .wp-container-213, .wp-container-214, .wp-container-215, .wp-container-216, .wp-container-217, .wp-container-218, .wp-container-219, .wp-container-220,
.wp-container-221, .wp-container-222, .wp-container-223, .wp-container-224, .wp-container-225, .wp-container-226, .wp-container-227, .wp-container-228, .wp-container-229, .wp-container-230,
.wp-container-231, .wp-container-232, .wp-container-233, .wp-container-234, .wp-container-235, .wp-container-236, .wp-container-237, .wp-container-238, .wp-container-239, .wp-container-240,
.wp-container-241, .wp-container-242, .wp-container-243, .wp-container-244, .wp-container-245, .wp-container-246, .wp-container-247, .wp-container-248, .wp-container-249, .wp-container-250,
.wp-container-251, .wp-container-252, .wp-container-253, .wp-container-254, .wp-container-255, .wp-container-256, .wp-container-257, .wp-container-258, .wp-container-259, .wp-container-260,
.wp-container-261, .wp-container-262, .wp-container-263, .wp-container-264, .wp-container-265, .wp-container-266, .wp-container-267, .wp-container-268, .wp-container-269, .wp-container-270,
.wp-container-271, .wp-container-272, .wp-container-273, .wp-container-274, .wp-container-275, .wp-container-276, .wp-container-277, .wp-container-278, .wp-container-279, .wp-container-280,
.wp-container-281, .wp-container-282, .wp-container-283, .wp-container-284, .wp-container-285, .wp-container-286, .wp-container-287, .wp-container-288, .wp-container-289, .wp-container-290,
.wp-container-291, .wp-container-292, .wp-container-293, .wp-container-294, .wp-container-295, .wp-container-296, .wp-container-297, .wp-container-298, .wp-container-299, .wp-container-300
{gap: 0 !important;}

/* HEADER */

.top-header { padding: 0 var(--pagepadding); display: flex; justify-content: space-between; }
.logo-svg { width: 540px; height: auto; max-height: 119px;}
.home-link { display: inline-block; }
.header-navigation a, .header-navigation a:visited { color: var(--navy) !important; text-decoration: none; }
.header-sub-menu, .site-search, .language-menu { font-family: var(--raleway); font-weight: 600; }
.header-navigation {display: flex; align-items: center; width: calc(100% - 5%); margin-left: 5%; margin-right: 0%;}
.header-sub-menu { order: 1; font-size: 88.888%; width: calc(40% - 2%); margin-left: 1%; margin-right: 1%;} /*headerin apulinkit*/
.site-search { order: 2; font-size: 88.888%; width: calc(40% - 2%); margin-left: 1%; margin-right: 1%;} /*headerin haku*/
.language-menu { order: 3; font-size: 88.888%; width: calc(20% - 2%); margin-left: 1%; margin-right: 1%;} /*headerin kielivalikko*/
.header-sub-menu ul { list-style: none; margin: 0px; display: flex; padding: 0px; }
.header-sub-menu li { list-style: none;	margin-left: 8px; }
.header-sub-menu a:hover {color: var(--violet) !important; text-decoration: underline;}
.header-sub-menu a:first-child { vertical-align: top; }
.header-sub-menu li:first-child::after { color: var(--yellow); content: '  |'; white-space: pre; }
.home-icon { margin-right: 8px; vertical-align: -3px; }
.plane-icon { margin-left: 8px; vertical-align: -3px; }
.search-field { max-width: 175px; height: 32px; border-radius: 3px 0px 0px 3px; margin-right: -5px; }
.search-submit { cursor: pointer; border: 0px; border-radius: 0px 3px 3px 0px; background: var(--navy); color: var(--white); line-height: 1.5; padding: 4px 10px; }
.language-menu { margin-top: 4px; }
.language-menu ul { list-style: none; margin: 0px; display: flex; padding: 0px; }
.language-menu li { list-style: none; margin-left: 8px; }
.language-menu a:hover {color: var(--red) !important; text-decoration: underline;}
.language-menu a:first-child { vertical-align: top; }
/*.language-menu li:first-child::after { color: var(--yellow); content: '  |'; white-space: pre; }*/
.language-menu li:first-child::before { content: url('../svg/flag.svg'); margin-right: 8px; vertical-align: -3px; }
.header-sub-menu, .site-search, .language-menu { justify-content: center; display: flex; }


/* MAIN NAVIGATION */

.main-navigation { background-color: var(--yellow); min-height: 60px; font-family: var(--raleway); font-weight: 600; font-size: 105.555%; display: flex; justify-content: center; }
.main-navigation ul { align-items: unset;}
.main-navigation ul ul { display: flex; flex-flow: column; box-shadow: none !important; margin-left: -1vw;}
.main-navigation li a { line-height: 1.3; }
.main-navigation ul ul a {margin-left: 5px; margin-right: 5px; width: 100%;}
.menu-item-has-children {margin: 0 0 0 2vw; padding: 2vw 1vw; cursor: pointer !important;}
.menu-item-has-children:first-child { margin-left: 0px; }
.menu-item-has-children > a { padding-right: 15px; max-width: 100%; }
.menu-item-has-children > a:first-child::after { content: url('../svg/chevron-down-blue.svg'); 	margin-left: 6px; display: inline-table; width: 9px; height: 9px; margin-right: -15px; }
.menu-item-has-children > a:hover:first-child::after { content: url('../svg/chevron-down-violet.svg') !important; }
.sub-menu .menu-item { padding: 7px 20px 7px 20px; background-color: var(--yellow); }
/**/
button.menu-toggle { margin: 0px 0px; padding: 15px !important; border: 0 !important; background: none !important; cursor: pointer !important; width: 98%; }
button.menu-toggle:after {content: "MENU"; margin-left: 16px; top: -16px; position: relative; font-weight: 700; font-size: 133.333%; color: var(--darkblue);}
.menu-icon { fill: var(--darkblue); }
.main-navigation .current-page-ancestor > a, .main-navigation .current_page_item > a { font-weight: 800; }
.main-navigation .current-page-ancestor, .main-navigation .current_page_item { background-color: var(--lightyellow) !important;}
.main-navigation .current-page-ancestor > a::before, .main-navigation .current_page_item > a::before { content: ""; position: absolute; top: 0px; left: calc(50% - 10px); width: 0; height: 0; border-style: solid; border-width: 10px 10px 0 10px; border-color: #ffffff transparent transparent transparent; }
.main-navigation ul ul li:first-of-type { font-weight: 900 !important; padding: 20px 20px 7px 20px;}
.sub-menu .current-page-ancestor { background-color: var(--yellow) !important; }
.main-navigation ul ul li a::before { border: none !important; }
/*alavalikon varjo - poistettu ul ul ––>*/
.main-navigation ul ul li:last-of-type {padding: 7px 20px 20px 20px;}
.sub-menu { width: 100%; min-width: 270px; }

/* FRONTPAGE SECTION: HERO */

.hero { display: flex; padding: 0px var(--pagepadding); margin: 1.5em 0em; }
.hero-inner-left { width: 50%; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.hero-inner-right { width: 50%; background-color: var(--grey); background-image: url('../img/salmiakki-keltainen.png'); background-position: bottom right; background-repeat: no-repeat; background-size: 110%; padding: 3em 0 4em 0; text-align: center; }
.hero-inner-right h2 { color: var(--navy); font-family: var(--aleo); font-weight: 500; font-size: 133.333%; }
.hero .btn { display: block; height: fit-content; height: -moz-fit-content; width: fit-content; width: -moz-fit-content; padding: 0.5em 1em; background-color: var(--yellow); margin-left: auto; margin-right: auto; margin-bottom: 20px; font-family: var(--raleway); font-weight: 600; text-decoration: none; border-radius: 4px; }

/* FRONTPAGE SECTION: MAIN CONTENT LINKS */

.main-content-links { padding: 0 var(--pagepadding); display: flex; /*flex-flow: wrap;*/ margin: 0em 0em 1.5em 0em; justify-content: space-between; }
.main-content-link-container { width: calc(16.666% - 2%); margin-left: 0%; margin-right: 2%; display: block; height: 300px; min-width: 20px; overflow: hidden; position: relative; cursor: pointer; }
.main-content-link-container:nth-of-type(1) { background-color: var(--lightblue); color: var(--navy); }
.main-content-link-container:nth-of-type(2) { background-color: var(--lightyellow); color: var(--navy); }
.main-content-link-container:nth-of-type(3) { background-color: var(--lightred); color: var(--navy); }
.main-content-link-container:nth-of-type(4) { background-color: var(--navy); color: var(--white); }
.main-content-link-container:nth-of-type(5) { background-color: var(--violet); color: var(--white); }
.main-content-link-container:nth-of-type(6) { background-color: var(--blue); color: var(--white); margin-right: 0% !important;}
.main-content-link-container:nth-of-type(1) h3, .main-content-link-container:nth-of-type(2) h3, .main-content-link-container:nth-of-type(3) h3 { color: var(--navy); }
.main-content-link-container:nth-of-type(4) h3, .main-content-link-container:nth-of-type(5) h3, .main-content-link-container:nth-of-type(6) h3 { color: var(--white); }
.main-content-link { height: 100%; width: 100%; }
.main-content-link-icon { height: 70%; display: flex; align-items: center; justify-content: center;}
.main-content-link-container:nth-of-type(1) .main-content-link-icon svg { width: auto; height: 45%; }
.main-content-link-container:nth-of-type(2) .main-content-link-icon svg { width: auto; height: 70%; }
.main-content-link-container:nth-of-type(3) .main-content-link-icon svg { width: auto; height: 80%; }

.main-content-link-container:nth-of-type(4) .main-content-link-icon svg, .main-content-link-container:nth-of-type(5) .main-content-link-icon svg, .main-content-link-container:nth-of-type(6) .main-content-link-icon svg { width: auto; height: 55%; }

.main-content-link h3 { font-family: var(--raleway); font-weight: 700; font-size: 111%; line-height: 1.1; text-align: center; text-decoration: none !important; position: absolute; top: 215px; /*padding: 0px 20px;*/ width: calc(100% - 6%); margin-left: 3%; margin-right: 3%; margin-top: 0; margin-bottom: 0 !important;}

/* FRONTPAGE SECTION: CURRENT LISTS */

.current-lists { padding: 0 var(--pagepadding); display: flex; flex-flow: wrap; justify-content: space-between; }
.current-list { flex-basis: 49%; display: flex; flex-flow: row wrap; margin-bottom: 1.5em; min-width: 200px; background-color: var(--grey); background-image: url('../img/salmiakki-valkoinen.png'); background-position: bottom right; background-repeat: no-repeat; text-align: center;}
.list-header { width: 100%; height: 80px; display: flex; justify-content: left; align-items: center; }
.current-list:first-of-type .list-header { background-color: var(--yellow); }
.current-list:nth-of-type(2) .list-header { background-color: var(--blue); }
.current-list:nth-of-type(3) .list-header { background-color: var(--navy); }
.current-list:nth-of-type(4) .list-header { background-color: var(--red); }
.arrow-up-icon { margin: 0 40px 0 30px; }
.list-header h2 { font-family: var(--raleway); font-weight: 900; font-size: 166.666%; color: var(--white); margin: 0; }
.list-content { width: 100%; min-height: 83%; padding: 30px 60px 30px 40px; text-align: left; font-family: var(--raleway); display: flex; flex-flow: column nowrap; }
.list-content a { display: block; color: var(--darkblue); font-size: 94.444%; font-weight: 700; text-decoration: none; }
.list-content a:hover { color: var(--yellow); }
.list-content p, .list-content h3 { margin: 0; }
.list-content h3 { text-indent: -28px; padding-left: 28px; color: unset !important; hyphens: auto; }
.list-content-item { margin-bottom: 20px; }
.list-content-item p { font-size: 94.444% !important; }
.list-content .arrow-right-icon { margin: 0 10px 0 0; }
.current-list:nth-of-type(2) .arrow-right-yellow { fill: var(--blue); }
.current-list:nth-of-type(4) .arrow-right-yellow { fill: var(--lightred); }
.current-list:nth-of-type(4) .arrow-up-white { fill:var(--lightred); }
.current-list:nth-of-type(4) .list-content a { color: var(--red); font-size: 94.444%; font-weight: 700; text-decoration: none; }
.current-list:nth-of-type(4) .list-content a:hover { color: var(--navy); }
.list-content .btn a:hover { color: var(--violet); }
.list-content .btn { display: block; height: fit-content; height: -moz-fit-content; width: fit-content; width: -moz-fit-content; padding: 0.5em 1em; background-color: var(--yellow); font-family: var(--raleway) !important; font-weight: 600 !important; text-decoration: none !important; margin-top: auto; border-radius: 4px; }
.list-content .btn-red { background-color: var(--red); }
.list-content .btn-navy { background-color: var(--navy); }
.list-content .btn-section-blue { background-color: var(--blue); }
.list-content a.btn-navy, .list-content a.btn-red, .list-content a.btn-section-blue { color: var(--white) !important; }
.list-content a:hover.btn-navy { color: var(--yellow) !important; }
.list-content a:hover.btn-red, .list-content a:hover.btn-section-blue { color: var(--navy) !important; }
.document-icon { vertical-align: bottom; margin-right: 10px; }
.pen-icon { vertical-align: middle; margin-right: 11px; }

/* FRONTPAGE SECTION: BANNERS */

.banners { padding: 0 var(--pagepadding); font-family: var(--aleo); font-weight: 400; color: var(--darkblue); font-size: 133.333%; font-style: oblique; }

/* IMAGE MAP PRO - Muy Importante! */
.imp-wrap {max-width: 100% !important;}

    /* IMAGE MAP PRO - testiä mobiiliin 9.12. alle 980 px __>! */
    /*.imp-wrap {min-height: 647px !important;}
    img.imp-main-image {height: 647px !important; object-fit: cover !important; object-position: center top !important;}*


/* FOOTER */

.site-footer { background-color: var(--grey); }
.site-info { padding: 8em calc(var(--pagepadding) + var(--pagepadding) + var(--pagepadding) + 22px) 4em calc(var(--pagepadding) + var(--pagepadding) + var(--pagepadding)); display: flex; justify-content: space-between; }
.site-info-left { width: 60%; }
.site-info-meta { text-align: left; font-family: var(--raleway); font-weight: 700; font-size: 66.666%; letter-spacing: 0.5px; line-height: 22px; padding-left: 22px; }
.footer-link { margin-top: 10px; display: block; text-transform: uppercase; }
.site-info-left .logo-svg { width: 400px; height: auto; margin: -22px 0 0 0; }
.site-info-right { width: 40%; display: flex; justify-content: flex-end; flex-wrap: wrap; }
.btn-blue { display: block; height: 45px; min-width: max-content; min-width: -moz-max-content; padding: 0.7em 1.2em; background-color: var(--navy); font-family: var(--raleway); font-weight: 600; text-decoration: none; margin-left: 60px; text-transform: uppercase; font-size: 16px; border-radius: 4px;}
a.btn-blue { color: var(--white); }

.facebook-logo, .instagram-logo, .linkedin-logo, .twitter-logo { }
.facebook-logo-link, .instagram-logo-link, .linkedin-logo-link, .twitter-logo-link { margin-left: 30px; }
.facebook-logo-link svg, .instagram-logo-link svg, .linkedin-logo-link svg, .twitter-logo-link svg { height: 45px; width: 45px; }
.site-copyright { padding: 0.9em calc(var(--pagepadding) + var(--pagepadding) + var(--pagepadding) + 22px); background-color: var(--darkgrey); font-family: var(--raleway); font-size: 83.333%; font-weight: 400; display: flex; justify-content: space-between; }
.site-copyright p { margin: 0px; }
.separator { color: var(--yellow); margin: 0 12px; }
.separator-horizontal { color: var(--navy); margin: 0 8px; letter-spacing: -2px; }
.valakia-footer { margin-top: 3px; }

/* PAGE */

.breadcrumb-container { padding: 0px var(--pagepadding); margin: 1.5em 0px; }
.breadcrumb { padding: 12px 25px; background-color: var(--grey); font-family: var(--raleway); font-size: 83.333%; }
.breadcrumb a:hover {color: var(--violet);}
.page-row { display: flex; flex-wrap: wrap; padding: 0px var(--pagepadding); margin-bottom: 1.5em; }
.page-article { width: 50%; padding-right: 30px; }
.page-row .entry-content { padding: 0px 20px; }
.sidebar-left { width: calc(25% - 2.5%); margin-right: 2.5%; padding: 0 20px 0 0; }
.sidebar-left ul { margin: 0px; padding: 0px;}
.sidebar-left li {padding: 7px 20px; background-color: var(--grey); list-style: none; border-bottom: 1px solid var(--darkgrey);}
.sidebar-left li a {text-decoration: none; hyphens: auto;}
.sidebar-right { width: 25%; color: var(--darkblue); border-left: solid 2px var(--darkgrey); }
.sidebar-left .current_page_item { font-weight: 700;}
.sidebar-left .current_page_item .children { font-weight: 400; }
.page-row .wp-block-image figcaption { margin-top: .5em; margin-bottom: 0px !important; padding-left: 1em; font-family: var(--raleway); }
.page-row .wp-block-image { background-color: var(--grey); padding-bottom: 1em; margin-bottom: 0px !important; }
.big-box { background-color: var(--lightyellow); width: 100%; text-align: center; padding: 1% 10% 0% 10%; margin-top: 3em; margin-bottom: 6em; }
.big-box p { font-family: var(--aleo) !important; color: var(--navy); font-weight: 400; font-size: 116.666%; }
.page .sidebar-right { font-family: var(--raleway); }
.page .sidebar-right ul { margin: 0px; }
.page .sidebar-right h1, .page .sidebar-right h2, .page .sidebar-right h3, .page .sidebar-right h4, .page .sidebar-right h5, .page .sidebar-right h6, .page .sidebar-right p { margin-left: 40px; }

/* PAGE - HENKILÖKUNTA */
body.page-id-398 .wp-block-columns {flex-wrap: nowrap;}

/*Henkilökunta - kortit juoksevasti 15.3.2024*/
.henkilokunta-kortit {}
.henkilokunta-kortit .wp-block-columns { flex-wrap: nowrap !important; justify-content: flex-start; align-items: stretch !important; margin-bottom: 0 !important;}
.henkilokunta-kortit .wp-block-column { flex-grow: 0 !important; margin-left: 0% !important; margin-right: 0%; }
.henkilokunta-kortit .wp-block-column { flex-basis: calc(33.333333%) !important; /*padding: 18px calc(var(--pagepadding)) 18px;*/}
.henkilokunta-kortit .wp-block-image { display: block !important; } /* ohitetaan kärjessä oleva tyylitys > kuvat tasaantuvat */
body.page-id-398 .wp-block-image img { aspect-ratio: 1 / 1 !important; object-fit: cover; object-position: center; width: 100% !important; height: auto !important; } /* muokattu 15.3.2024 */

/* PAGE - VERKKONÄYTTELY */
.verkkonayttely { padding-bottom: 100px!important;}
.verkkonayttely figcaption { padding: 0; margin: 0; font-style: normal!important; }


/* HAKU + ERIKOISSIVUT */
body.search .site-main, body.search-no-results .site-main, body.error404 .site-main, body.search-results .site-main {padding: 0px var(--pagepadding); margin-bottom: 1.5em;}
body.search .site-main .search-field, body.search-no-results .site-main .search-field, body.error404 .site-main .search-field, body.search-results .site-main .search-field { max-width: 300px; }

/* ARTIKKELIT */
.article-row { padding: 0px calc(var(--pagepadding) + var(--pagepadding)); margin-bottom: 1.5em; margin-top: 1.5em; display: flex; flex-wrap: wrap; }
.archive-row { padding: 0px calc(var(--pagepadding) + var(--pagepadding)); margin-bottom: 1.5em; margin-top: 1.5em; }
.comment-navigation .nav-links, .posts-navigation .nav-links, .post-navigation .nav-links { margin: 2em 0em;}
.single article { width: 75%; padding: 0px 20px; }
ul.ajankohtaista, ul.artikkelit, ul.tiedotteet, ul.tapahtumat, ul.kynaalyja-blogi { margin: 0px; }
.single .sidebar-right h3 { margin-left: 40px; }
.entry-meta, .single .sidebar-right { font-family: var(--raleway); }
.archive h2 { margin-bottom: 5px; }

/*artikkelit - hakutulokset ––> */
body.search-results .site-main article {padding: 0px 0px 20px 0px; margin-bottom: 20px; border-bottom: solid 2px var(--darkgrey);}

/* HANKEDATA -muotoiluja */
#info, #rlochart, #stchart, #vchart { display: block; float: left; width: 100%;	margin-bottom: 20px; }
#stchart, #vchart {  background: #F7F6F5; padding-bottom: 30px; }
.apexcharts-canvas { margin: auto; }

.yhteensa { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: space-between; align-items: stretch; gap: 15px 15px; margin-bottom: 20px; }
.hankkeet, .toteuttajamaara { width: 48%; background: #F7F6F5; padding: 15px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: space-between; align-items: stretch; flex-grow: 1; /*  gap: 15px 30px;*/ }
.hankkeet p, .toteuttajamaara p { text-align: center; margin-bottom: 1em; }
.hankeikoni { background: url('../svg/hanke.svg') no-repeat; background-position: center; margin: 0 auto; width: 170px; max-width: 30%; display: block; float: left; }
.hanketekstit, .toteuttajatekstit { display: block; min-width: 70%; float: left; }
.toteuttajaikoni1 { background: url('../svg/toteuttajat.svg') no-repeat; background-position: center; margin: 0 auto; width: 170px; max-width: 30%; display: block; float: left; }
.hankkeet p span, .toteuttajamaara p span { font-size: 300%; display: block; line-height: 1em; color: #244F5F; }
.toteuttajalista { width: 100%; background: #F7F6F5; padding: 15px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: space-between; align-items: stretch; gap: 15px 30px; /*margin-bottom: 40px;*/ }
.toteuttajaikoni { background: url('../svg/toteuttajat2.svg') no-repeat; background-position: center; margin: 0 auto; width: 170px; max-width: 30%; display: block; float: left;}*/
.toteuttajat { display: block; min-width: 60%; float: left; }
.toteuttajalista p { display: block; }
.toteuttajalista p span { font-weight: 700; }

.yhteissumma { width: 100%; background: #F7F6F5; padding: 15px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: space-between; align-items: stretch; gap: 15px 30px; margin-bottom: 20px; }
.summaikoni { background: url('../svg/setelit.svg') no-repeat; background-position: center; margin: 0 auto; width: 170px; max-width: 30%; display: block; float: left; }
.summat { display: block; min-width: 60%; float: left; }
.summat p { text-align: center; margin-bottom: 1em; }
.summat p span { font-size: 300%; display: block; line-height: 1em; color: #244F5F; }
.summaerittely { width: 100%; background: #F7F6F5; padding: 15px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; align-content: space-between; align-items: stretch; gap: 15px 30px; /*	margin-bottom: 40px; */ }

.rahoitusmaara { width: 100%; background: #F7F6F5; padding: 15px; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-start; align-content: center; align-items: stretch; gap: 15px 30px; margin-bottom: 20px; }
.rahoitusmaara h3 { text-align: center; margin-bottom: 0px; }
.rahoitusmaara p { text-align: center; margin-bottom: 0px; margin-top: 0px;}
.erittelyt { display: block; width: 60%; float: left; }
.erittelyikoni { background: url('../svg/kolikot.svg') no-repeat; background-position: center; margin: 0 auto; width: 150px; max-width: 30%; display: block; float: left; }
.erittelyt p, .erittelyt h3 { text-align: center; margin-bottom: 1em; }
.erittelyt p span { font-size: 125%; color: #244F5F; }

.aloitetut { background: #F7F6F5; padding: 15px; display: block; float: left; width: 100%; margin-bottom: 20px; }
.aloitetut #kychart { margin-bottom: 20px;}
.aloitetut h3 { text-align: center; margin-bottom: 1em; }

/* Hankekortit */
.yearselect select, .toteuttajaselect select, .teematselect select {text-align: left !important; }
.yearselect select { display: inline-flex; width: 100%; background-color: #002F3B; color: #fff; border: 0px; padding: 10px; margin: 10px 0; font-size: 1.1em; }
.toteuttajaselect select { display: inline-flex; width: 100%; background-color: #002F3B; color: #fff; border: 0px; padding: 10px; margin: 10px 0; font-size: 1.1em; }
.teematselect select { display: inline-flex; width: 100%; background-color: #002F3B; color: #fff; border: 0px; padding: 10px; margin: 10px 0; font-size: 1.1em; }

#hankekortit { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; align-items: stretch; gap: 15px 0px; }
.hankekortti { width: 49%; background: #F7F6F5; float: left; display: block; }
.korttiotsikko { background: #002F3B; padding: 15px; }
.korttiotsikko h3 { color: #fff; font-size: 1.0em; }
.korttisisallot { padding: 15px; }
.korttisisallot p { margin-block-start: 0.3em; }
.korttisisallot h4 { line-height: 1em; margin-block-end: 0em; }
.korttisisallot ul li { margin-block-start: 0.4em; }

.teemat {width: 100%;}
.vuodet {width: 100%;}
.toteuttajat-valinta {width: 100%;}

.hakukentta {margin-bottom: 10px;}
.sanahaku {padding: 8px !important; width: 100%; border-width: 2px !important; border-color: #002f3b !important; border-radius: 0px !important; height: 46px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; line-height: 1.5;}
.hakukentta :focus, .hakukentta a:focus, .hakukentta input:focus, .hakukentta button:focus { outline-style: dashed; outline-color: var(--navy); outline-offset: 2px; outline-width: 3px;}


/* --- ONLY MOBILE STYLES BELOW THIS LINE --- */

/* TOP HEADER */

@media (max-width: 1370px) {
	.top-header { flex-direction: column; align-items: center; }
	.header-navigation { margin-bottom: 35px; }
}

/* MAIN NAVIGATION */

@media (max-width: 1080px) {
	.main-navigation .menu-item-has-children { margin-left: 5px !important; }
}

@media (min-width: 981px) {
	.main-navigation.toggled ul { display: flex !important; }
	.main-navigation li { display: flex; }
	.main-navigation li a { align-self: center; }
	.main-navigation ul ul li {box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);}
}

/* FOOTER */

@media (max-width: 1480px) {
	.facebook-logo-link, .instagram-logo-link, .linkedin-logo-link, .twitter-logo-link, .btn-blue { margin-left: 15px; }
}

@media (min-width: 1200px) and (max-width: 1300px) {
	.site-info-right:lang(fi) { flex-wrap: wrap-reverse; align-content: space-between; }
}

@media (max-width: 1200px) {
	.site-info { display: block; padding: 6em var(--pagepadding); }
	.site-info-left, .site-info-right { width: 100%; }
	.site-info-left { text-align: center; }
	.site-info-right { justify-content: center; }
	.site-info-meta { text-align: center; margin-bottom: 1.5em; padding: 0px; }
}

@media (max-width: 550px) {
	.site-info-left .logo-svg { width: 350px; }
}

@media (min-width: 860px) and (max-width: 1230px) {
	footer .separator:first-child { display: none; }
	.site-copyright p { padding-right: 100px; }
}


@media (min-width: 620px) and (max-width: 860px) {
	.site-copyright { display: block; text-align: center; }
	.site-copyright p { margin: 0px 0px 10px 0px; }
	footer .separator:first-child { display: none; }
}

@media (max-width: 620px) {
	.site-copyright { display: block; text-align: center; padding: 0.9em 0em; }
	.site-copyright p { margin: 0px 0px 10px 0px; }
	.site-copyright a { display: block; }
	footer .separator { display: none; }
}

@media (max-width: 445px) {
	.btn-blue { margin: 20px 15px 0px 15px; }
}

/** CONTENTS 11.11.2020 –––> by Zeikki **/

/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1415px) {
    .main-content-link-container { flex-basis: 49%; }
    .main-navigation .menu-item-has-children > a { line-height: 23px; }
	.main-navigation ul { align-items: stretch; }

}

/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1616px) and (max-width: 1702px) {
    /*viimeinen alavalikko esiin –––> */
    .main-navigation #menu-item-331 ul.sub-menu li {width: auto; left: auto; right: 25%;}
}

@media all and (min-width: 1371px) and (max-width: 1616px) {
	.main-navigation .menu-item-has-children > a { /*width: min-content;*/ min-width: 150px; line-height: 23px; }
	.main-navigation .menu-item-has-children > a:first-of-type { padding-left: 20px; }
}

@media all and (min-width: 980px) and (max-width: 1371px) {
	.menu-item-has-children { padding: 1.6vw 1vw; }
	.toteuttajaikoni, .hankeikoni, .toteuttajaikoni1 { width: 100%;	height: 100px;}
	.hanketekstit, .toteuttajatekstit, .toteuttajat { width: 100%; text-align: center;}
}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1616px) {
	.search-form { width: 75%; }
	.search-field { width: calc(100% - 70px); max-width: 100%; }
	.header-sub-menu ul { min-width: 255px; }
	/*päävalikko*/
	/*viimeinen alavalikko esiin –––> */
	.main-navigation #menu-item-331 ul.sub-menu li {width: auto; left: auto; right: 25%; transform: translateX(-25%);}
	/** etusivu **/
	.main-content-link-container { width: calc(33.333% - 1%) !important; margin-left: 0%; margin-right: 1%;}
	.main-content-link h3 {font-size: 100%;}
	/* henkilökunta */
	/*.has-3-columns > .wp-block-column {flex-basis: calc(50% - 18px); flex-grow: 0;}*/
	body.page-id-398 .wp-block-columns, body.page-id-2319 .wp-block-columns {display: block !important; margin-bottom: 0px !important; width: calc(100%) !important; margin-left: 0; margin-right: 0;}
	body.page-id-398 .wp-block-columns .wp-block-column, body.page-id-2319 .wp-block-columns .wp-block-column {float: left; width: 48% !important; margin-left: 0; margin-right: 2%; margin-bottom: 16px;}
	body.page-id-398 .page-row .wp-block-image figcaption, body.page-id-2319 .page-row .wp-block-image figcaption {/*min-height: 222px !important;*/ /*font-size: 83.333% !important;*/}
}

@media all and (min-width: 980px) and (max-width: 1370px) {
	.header-sub-menu, .site-search, .language-menu { justify-content: flex-start; }
	.header-navigation { margin-left: 0px; }
}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 981px) and (max-width: 1100px) {
    /*päävalikko*/
    .main-navigation {font-size: 100% !important;}
    .main-navigation ul {align-items: unset !important; hyphens: auto;}
    .menu-item-has-children { margin: 0 0 0 1vw; padding: 2vw 1vw 2vw 1vw;}
    /*viimeinen alavalikko esiin –––> */
    .main-navigation #menu-item-331 ul.sub-menu li {width: auto; left: auto; right: 25%; transform: translateX(-25%);}
    /** etusivu **/
    .main-content-links {flex-flow: wrap;}
    .main-content-link-container { width: calc(33.333% - 2%) !important; margin-left: 0%; margin-right: 2%; margin-bottom: 2%;}
    .main-content-link-container:nth-of-type(3), .main-content-link-container:nth-of-type(6) {margin-right: 0% !important;}
        /* henkilökunta */
    /*.has-3-columns > .wp-block-column {flex-basis: calc(100%); flex-grow: 0;}*/
    body.page-id-398 .wp-block-columns, body.page-id-2319 .wp-block-columns {display: block !important; margin-bottom: 0px !important; width: calc(100%) !important; margin-left: 0; margin-right: 0;}
		body.page-id-398 .wp-block-columns .wp-block-column, body.page-id-2319 .wp-block-columns .wp-block-column {float: left; width: 98% !important; margin-left: 0; margin-right: 2%; margin-bottom: 16px;}
		.search-form { width: 75%; }
		.search-field { width: calc(100% - 70px); max-width: 100%; }
		.site-branding { text-align: center; }
		.erittelyikoni, .summaikoni { width: 100%; height: 100px; }
		.erittelyt, .summat { width: 100%;}
}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 980px) and (max-width: 1616px) {
	.main-navigation { padding: 0px 20px 0px 20px; }

		/* HANKEDATA */
		.hankekortti {	width: 100% !important; }
}

/*** Responsive Styles Tablet Only ***/
@media all and (max-width: 980px) {
	.main-navigation { padding-left: 7px; }
	:root { --pagepadding: 3%; }
	.site-branding .logo-svg { width: 95vw; }
	.header-navigation {flex-direction: column; flex-flow: wrap !important; width: 80%; margin-left: 0px;}
	.header-sub-menu {order: 1; font-size: 83.333%; width: 60%; margin-left: 0px; margin-right: 0%; justify-content: flex-start;} /*headerin apulinkit*/
	.header-sub-menu ul { min-width: 244px; }
	.site-search {order: 3; font-size: 83.333%; width: calc(100% - 3%); margin: 10px 0px 0px 0px;} /*headerin haku*/
	.search-form { width: 75%; }
	.search-field { width: calc(100% - 70px); max-width: 100%; }
	.language-menu {order: 2; font-size: 83.333%; width: 40%; margin: 7px 0px 0px 0px; justify-content: flex-end;} /*headerin kielivalikko*/
	/*päävalikko*/
	.main-navigation {display: block !important; width: calc(100%);}
	.main-navigation ul {width: calc(100% - 6%); margin-left: 3%; margin-right: 3%;}
	.main-navigation ul ul a {width: 100% !important;}
	.main-navigation { flex-flow: column !important; }
	.menu-item { margin-left: 0; padding: 15px 0; }
	.menu-item:first-child { margin-left: 0; padding: 0 0 15px 0; }
	.menu-item:last-child { margin-left: 0; padding: 15px 0 23px 0; }
	.menu-item-has-children > a { width: 100% !important; }
	.main-navigation ul ul { box-shadow: none !important; float: none !important; position: initial !important; top: 0 !important; left: 0 !important; }
	.sub-menu .menu-item { background-color: none !important; padding: 5px 5px 0px 25px !important;}
	.main-navigation .current-page-ancestor, .main-navigation .current_page_item { background-color: var(--yellow) !important; }
	.main-navigation ul li .current_page_item a { background-color: var(--lightyellow) !important; }
	.main-navigation .current-page-ancestor > a::before, .main-navigation .current_page_item > a::before { display: none !important;}
	/*etusivu*/
	.hero {display: block;}
	.hero-inner-left, .hero-inner-right {width: 100%; min-height: 266px;}
	.hero-inner-left {max-height: 150px;} .hero-inner-right {padding: 1em 2em 1em 2em;}
	.hero-inner-right h2 {font-size: 100%;}
	.main-content-links {flex-flow: wrap;}
	.main-content-link-container { width: calc(33.333% - 2%) !important; margin-left: 0%; margin-right: 2%; margin-bottom: 2%;}
	.main-content-link-container:nth-of-type(3), .main-content-link-container:nth-of-type(6) {margin-right: 0% !important;}
	/*sisällöt*/
	.current-lists { display: block; } /*current lists*/
	.wp-block-column { margin-bottom: 28px; } /*banners*/
	.wp-block-columns { margin-bottom: 0px; } /*banners*/
	.sidebar-left { width: 100%; padding: 0px 20px; }
	.page-article, .single article { width: 100%;  padding-right: 0px; }
	.sidebar-right { width: 100%; color: var(--darkblue); border-left: none !important; border-top: solid 2px var(--darkgrey);}
	/* henkilökunta */
	/*.has-3-columns > .wp-block-column {flex-basis: calc(50% - 32px); flex-grow: 0;}*/
	body.page-id-398 .wp-block-columns, body.page-id-2319 .wp-block-columns {display: block !important; margin-bottom: 0px !important; width: calc(100%) !important; margin-left: 0; margin-right: 0;}
	body.page-id-2319 .wp-block-columns .wp-block-column {float: left; width: 48% !important; margin-left: 0; margin-right: 2%; margin-bottom: 16px;}
	body.page-id-2319 .page-row .wp-block-image figcaption {/*min-height: 222px !important;*/}
	/** footer **/
}


/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
	/* HANKEDATA */
	.hankekortti {	width: 100% !important; }

}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
    .main-content-link-container { width: calc(50% - 2%) !important; margin-left: 0%; margin-right: 2%; margin-bottom: 2%;}
    .main-content-link-container:nth-of-type(even) {margin-right: 0% !important;}
    .main-content-link-container:nth-of-type(6) {margin-right: 0% !important;}
    /*KARTTA piiloon ––> */
    .arrow-divider {display: none !important; visibility: hidden;} section.kartta {display: none !important; visibility: hidden;}
	/* HANKEDATA */
	.hankekortti {	width: 100%; }
	.hanketekstit, .toteuttajatekstit, .toteuttajat, .summaikoni, .summat, .erittelyikoni, .erittelyt { width: 100%;}
	.hankeikoni, .toteuttajaikoni1, .toteuttajaikoni, .summaikoni, .erittelyikoni { height: 110px; }
	.toteuttajat h3, .toteuttajat p { text-align: center;}
}

/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
    .header-navigation {flex-flow: wrap !important;}
    .header-sub-menu {width: calc(100% - 6%); margin-left: 3%; margin-right: 3%; justify-content: center;} /*headerin apulinkit*/
    .site-search {width: calc(100% - 6%); margin-left: 3%; margin-right: 3%;} /*headerin haku*/
    .language-menu {width: calc(100% - 6%); margin-left: 3%; margin-right: 3%; justify-content: center;} /*headerin kielivalikko*/
    /*etusivu*/
    .main-content-link-container { width: calc(100% - 0%) !important; margin-left: 0%; margin-right: 0%;}
    .main-content-link-container:nth-of-type(odd) {margin-right: 0% !important;}
    .main-content-link-container:nth-of-type(6) {margin-right: 0% !important;}
            /* henkilökunta */
    .has-3-columns > .wp-block-column {flex-basis: calc(100%); flex-grow: 0;}
    body.page-id-398 .wp-block-columns, body.page-id-2319 .wp-block-columns {display: block !important; margin-bottom: 0px !important; width: calc(100%) !important; margin-left: 0; margin-right: 0;}
    body.page-id-398 .wp-block-columns .wp-block-column, body.page-id-2319 .wp-block-columns .wp-block-column {float: left; width: 98% !important; margin-left: 0; margin-right: 2%; margin-bottom: 16px;}
    /*KARTTA piiloon ––> */
    .arrow-divider {display: none !important; visibility: hidden;} section.kartta {display: none !important; visibility: hidden;}


}