/*
 *  Theme Name: Lääkärin sosiaalinen vastuu ry
 *  Theme URI: https://lsv.fi/
 *  Description:
 *  Author: Digitoucan (Pasi Lallinaho)
 *  Author URI: https://digitoucan.fi/
 *  Version: 2023-06-16
 *
 */

:root {
	--lsv-green: #73a61a;
	--lsv-blue: #008fc1;

	--digidone-shop--button-padding: 0.75em 1.5em;
	--digidone-shop--button-bg-color: var(--lsv-green);
}

.dynamic-width {
	width: 100%;
	margin: 0 auto;
	max-width: 1200px;
}

.dynamic-padding {
	padding: 1.5em;
}
	.dynamic-padding-horizontal {
		padding-right: 1.5em;
		padding-left: 1.5em;
	}

.alignfull {
	width: 100vw;
	margin: 0 -1.5em;
}
	.alignfull:first-child {
		margin-top: -1.5em !important;
	}

/*
 *  Navigation menus
 *
 */

nav a {
	font-size: 90%;
	font-weight: 500;

	color: #333;
}
	nav li ul li a {
		font-weight: 400;
	}


/*
 *  Header
 *
 */

header#site {
	font-family: "Rubik", sans-serif;
	padding-top: 1em;
	padding-bottom: 1em;
	background-color: #fff;
	box-shadow: 0 0 1em rgba(0,0,0,0.1);
	position: relative;
	z-index: 2000;
}
	header#site main {
		position: relative;
	}
	body.home header#site {
		box-shadow: none;
	}
	header#site + section#content {
		margin-top: 0.5em;
	}

	header#site h1#logo {
		display: inline-block;
		width: auto;
		overflow: auto;
		margin: 0;
	}
		header#site h1#logo img {
			margin-bottom: -5px;
		}
	header#site.deck h1#logo img {
		max-width: 100%;
		height: auto;
	}
		header#site.tight h1#logo,
		header#site.regular h1#logo {
			float: left;
		}
		header#site.tight h1#logo {
			display: inline-block;
			width: 95px;
			overflow: hidden;
		}
		header#site.tight img#logotype {
			float: left;
			display: block !important;
			margin: 12px 0 0 30px;
			padding-left: 0.5em;
		}


	header#site nav { }
		header#site nav ul {
			display: inline-block;
			margin: 0;
		}
		header#site.deck nav {
			margin-top: 0.5em;
		}
		header#site.tight nav {
			float: left;
			padding-left: 30px;
			margin-top: 7px;
		}
		header#site.regular nav {
			float: right;
		}

		header#site nav ul.menu > li {
			position: relative;
			display: inline-block;
		}
			header#site nav ul.menu > li > a {
				display: inline-block;
				padding: 0.3em 0.5em;
				transition: 400ms color;
			}
				header#site nav ul.menu > li > a:hover {
					color: #008fc1;
				}
				header#site.tight nav ul.menu > li > a {
					padding: 12px 0.5em;
				}
				header#site.regular nav ul.menu > li > a {
					padding: 32px 0.5em;
				}
		header#site nav ul.menu > li > ul {
			display: none;
			position: absolute;
			z-index: 2000;
			top: 100%;
			left: 0;
			width: auto;
		}
			/* */
			header#site:not(.deck) nav ul.menu > li:last-child > ul,
			header#site nav ul.menu > li.menu-overflows > ul {
				left: initial;
				right: 0;
			}

		header#site ul.menu > li:hover > ul,
		header#site ul.menu > li.menu-is-open > ul {
			display: block;
			min-width: 175px;
			background-color: #008fc1;
			border-radius: 2px;
			padding: 0.5em 0;
			margin-top: 6px;
			box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.3);
		}
			header#site.regular ul.menu > li:hover > ul,
			header#site.regular ul.menu > li.menu-is-open > ul {
				margin-top: -12px;
			}
			header#site ul.menu > li.menu-item-has-children:hover::after,
			header#site ul.menu > li.menu-is-open::after {
				content: " ";
				position: absolute;
				bottom: -6px;
				left: 0;
				width: 100%;
				height: 12px;
				background: transparent url(images/menu_bubble_up.png) 50% 100% no-repeat;
			}
			header#site.regular ul.menu > li.menu-item-has-children:hover::after,
			header#site.regular ul.menu > li.menu-is-open::after {
				bottom: 12px;
			}
		header#site ul.menu > li:hover > ul > li,
		header#site ul.menu > li.menu-is-open > ul > li {
			display: block;
			white-space: nowrap;
		}

		header#site ul.menu > li:hover > ul a,
		header#site ul.menu > li.menu-is-open > ul a {
			display: block;
			font-size: 82%;
			padding: 0.3em 0.75em;
			color: #fff;
			font-weight: 700;
			font-family: "Lato", sans-serif;
		}
			header#site ul.menu > li:hover > ul a:hover,
			header#site ul.menu > li:hover > ul a:active,
			header#site ul.menu > li:hover > ul a:focus {
				background: transparent linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.05));
			}

/* Highlight */

header#site nav ul.menu > li.lsv-highlight > a {
	padding: 12px;
	background-color: var(--lsv-green);
	color: #fff;

	border-top: 20px solid #fff;
	border-bottom: 20px solid #fff;
}

/*
 *  Content area
 *
 */

#content_wrapper {
	background-color: #fff;
	overflow: hidden;
}

/*  Featured image  */
.featured {
	height: 150px;
	margin: 2em 0;
	background-position: 50% 50%;
	background-size: cover;
}

/*  Sidebar  */

aside#sidebar {
	margin-top: 2em;
	padding: 1.5em;
	background-color: rgba(181,231,247,0.5);
	font-size: 85%;
}
	body.blog aside#sidebar {
		margin-top: 0;
		padding: 0;
		background-color: transparent;
	}
	aside#sidebar > :first-child > :first-child {
		margin-top: 0;
	}

	aside#sidebar h1 {
		font-size: 120%;
		font-weight: 400;
		color: #333;
	}
	aside#sidebar a {
		font-weight: 400;
	}

/*  Post metadata  */

aside.meta {
	margin-top: 2em;
}
	aside.meta section {
		margin-bottom: 1em;
	}
		#content aside.meta section a,
		#content aside.meta section a:hover,
		#content aside.meta section a:active,
		#content aside.meta section a:visited {
			border: none;
		}

/*  Post archives  */

.archive article.full {
	padding-bottom: 1.5em;
	margin-bottom: 1.5em;
	border-bottom: 1px solid rgba(0,0,0,0.2);
}
.archive article.list {
	margin-bottom: 0.75em;
}
.archive article h2 {
	margin: 0;
}
	.archive article.list h2 {
		font-size: 100%;
	}
	.archive article.attachment h2 {
		padding-left: 1.4em;
		background-image: url(images/icons/file-alt.svg);
		background-size: auto 80%;
		background-repeat: no-repeat;
		background-position: 0 50%;
	}
	.archive article h2 a {
		color: inherit;
		font-weight: inherit;
		border-bottom: none !important;
	}
.archive aside.meta {
	display: block;
	margin-top: 0;
	color: #777;
}
	.archive article.list aside.meta {
		font-size: 85%;
	}


/*
 *  Footer
 *
 */

footer {
	padding: 1.5em 0;
	background: #f1f1f1 linear-gradient(to bottom, rgba(0,0,0,0.1), transparent 0.5em );
}
	footer nav,
	footer #widgets_footer {
		margin-bottom: 1.5em;
	}

	footer nav ul.menu {
		display: grid;
		grid-gap: 1em;
	}
		footer nav li {
			display: block;
		}
			footer nav li a {
				font-size: 85%;
				display: block;
				font-weight: 700;
			}

footer .widget {
	font-size: 85%;
}
	footer .widget .textwidget,
	footer .widget strong + .textwidget p:first-child:last-child {
		display: inline;
	}

	footer .widget a {
		color: inherit;
		font-weight: 400;
	}

footer #siteby {
	font-size: 80%;
	color: #aaa;
}
	footer #siteby a {
		color: #888;
		transition: 300ms all;
	}
		footer #siteby a[href*="digitoucan"]:hover,
		footer #siteby a[href*="digitoucan"]:active,
		footer #siteby a[href*="digitoucan"]:focus {
			color: #d40000;
		}
		footer #siteby a[href*="atadone"]:hover,
		footer #siteby a[href*="atadone"]:active,
		footer #siteby a[href*="atadone"]:focus {
			color: #0075bf;
		}

/*
 *  Gutenberg blocks
 *
 */

.lsvfi-newest-posts li {
	margin-bottom: 0.5em;
}

.lsvfi-newest-posts .meta {
	color: #777;
	font-size: 85%;
}
	.lsvfi-newest-posts .meta a {
		color: #777;
		font-weight: 400;
	}

/*  Operations  */

.lsvfi-operations {
	display: grid;
	grid-gap: 2em;
	margin-top: 4em;
}
	.lsvfi-operations section {
		border: 1px solid rgba(0,0,0,0.1);
		border-radius: 2px;
	}
		.lsvfi-operations a.wrap {
			border: none !important;
			font-weight: 400;
			color: initial;
		}
		.lsvfi-operations header {
			position: relative;
		}
			.lsvfi-operations header img {
				max-width: 100%;
				height: auto;
				border-top-left-radius: 2px;
				border-top-right-radius: 2px;
				margin-bottom: -5px;

				transition: 400ms all;
			}

		.lsvfi-operations main {
			padding: 1em 1.5em 1.5em 1.5em;
		}
			.lsvfi-operations p {
				font-size: 85%;
			}
			.lsvfi-operations p.more {
				text-align: right;
			}

		.lsvfi-operations h3 {
			margin: 1.3em 1.3em 0 1.3em;
			background-color: #fff;
			color: #333;
			border-top-right-radius: 2px;
		}


/*  Social media  */

.lsv-social-media {
	margin: 2em 0;
}
	.lsv-social-media a {
		margin-right: 0.6em;
		border: none !important;
	}

/*
 *  Gutenberg classes
 *
 */

.link-buttons a {
	font-size: 120%;
	display: inline-block;
	padding: 0.5em 0.75em;
	margin-left: 0.5em;
	margin-bottom: 0.5em;
	background-color: #008fc1;
	color: #fff;
}
	.link-buttons a {
		border: none !important;
	}

/*
 *  WPCF7 Forms
 *
 */

div.wpcf7 {
	margin: 2em 0;
	padding: 2em;
	background-color: #f4f4f4;
}

.wpcf7-form p {
	margin-bottom: 0;
}
.wpcf7-form .form-group {
	display: block;
	margin-bottom: 1em;
}

.wpcf7-form .form-group > * {
	display: block;
}
	.wpcf7-form .form-group b {
		padding-bottom: 0.4em;
	}

	.wpcf7-form .form-group input[type="date"],
	.wpcf7-form .form-group input[type="email"],
	.wpcf7-form .form-group input[type="text"] {
		width: 100%;
	}
	.wpcf7-form .form-group span.wpcf7-list-item {
		display: block;
		margin-left: 0;
		margin-right: 0.6em;
	}



/*
 *  Front Page
 *
 */

body.home h1 {
	font-size: 250%;
}
	body.home h1 + h2 {
		margin-top: 1em;
		line-height: 1.8em;
	}

.wp-block-columns.extra-padding {
	padding: 1em 0 2em 0;
}

/*  Featured image banner  */
/*  To be obsolete  */

section#featured_banner {
	position: relative;
	background-color: #fff;

	font-family: "Rubik", sans-serif;
	font-size: 180%;
	font-weight: 500;
	text-align: center;
}
	section#featured_banner .image {
		background-size: cover;
		background-position: 50% 50%;
		height: 160px;
	}

	section#featured_banner .text {
		padding: 0.75em 1em;

		color: #008fc1;
		line-height: 1.3em;
		text-shadow: none;
		box-shadow: none;
	}
		section#featured_banner .text * {
			font-size: 100%;
			font-weight: 500;
		}

		/* Clear rules from elements in small sizes */
		@media screen and (max-width: 799px) {
			section#featured_banner .text p {
				margin-bottom: 0.5em;
			}
			section#featured_banner .text p *:not(a) {
				display: inline;
				font-size: inherit !important;
				background-color: transparent !important;
				padding: 0 !important;
				margin: 0 !important;
				position: static !important;
				transform: none !important;
			}
			section#featured_banner .text p br {
				display: none;
			}
		}

		section#featured_banner .text a {
			display: inline-block;
			font-size: 60%;
			font-weight: 500;
			margin: 1em 0 0.5em 0;
			padding: 0.5em 1em;

			background-color: var(--lsv-green);
			color: #fff;
			border-radius: 0.25em;

			text-shadow: none;
			box-shadow: 2px 2px 0.1em rgba(0,0,0,0.2);

			transition: 400ms all;
		}
			section#featured_banner .text a:hover,
			section#featured_banner .text a:active,
			section#featured_banner .text a:focus {
				background-color: #71b300;
				padding: 0.4em 1em 0.6em 1em;
			}


/*
 *  Plugins
 *
 */

/*  Term Promotion  */

.term-promotion-more a {
	font-weight: 600;
}

/*  Feed Them Social  */

.fts-jal-fb-header {
	display: none;
}

.fts-jal-fb-group-display {
	height: 400px;
	overflow-y: scroll;
	padding: 1em 1.5em;

	background-color: #fafafa;
	box-shadow: 0 0 0.2em rgba(0,0,0,0.2);
}
	.fts-jal-fb-group-display > :first-child {
		padding-top: 0;
	}
	.fts-jal-fb-group-display .fts-jal-single-fb-post {
		border-bottom: none;
	}

/*
 *  Mailchimp form
 *
 */

form.mailchimp input[type="email"] {
	width: 300px;
	max-width: 90%;
	padding: 0.7em 0.3em;
	vertical-align: middle;
}

form.mailchimp input[type="submit"] {
	padding: 0.5em 1em;
	margin: 0.3em 0;
	background-color: var(--lsv-green);
	color: #fff;
	border: none;
	border-radius: 0.2em;
	font-family: "Rubik", sans-serif;
	font-weight: 500;
	font-size: 100%;
	letter-spacing: 0.04em;
	vertical-align: middle;
}