/*
 Theme Name:   Twenty Twenty-Four Child
 Theme URI:    https://example.com/twenty-twentyfour-child/
 Author:       Kathi
 Template:     twentytwentyfour
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 Text Domain:  twentytwentyfour-child
*/

/* Import parent theme styles */
@import url("../twentytwentyfour/style.css");



:root {
  --blue:#5f84a1;
  --grey: #808080;
  --lightblue: #dfe6ec;
}

body {
	background-color: transparent;
}

body .has-base-background-color {
	background-color: #1a1718 !important;
}

header a {
	color: #fff !important;
}


body .post-index {
	margin-left: 0 !important;
}



body a {
	text-decoration: none;
}

.button {
	display: inline-block;
	background: var(--blue);
	padding: 5px 20px;
	border-radius: 5px;
	color: #fff;
	opacity: 1;
	transition: opacity .3s;
}

.button:hover {
	opacity: .7;
	transition: opacity .3s;
}

.button a {
	color: #fff;
}

.blog-posts {
	margin-top: 0;
}


@media(min-width:1025px) {
	body.page-id-22 .entry-content {
		display: grid;
		grid-template-columns: 20% 80%;
		grid-column-gap: 30px;
	}
}


.article_wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-column-gap: 40px;
	grid-row-gap: 40px;
}

@media(max-width:1024px) {
	.article_wrapper {
		grid-template-columns: 1fr 1fr;
		grid-row-gap: 20px;
		grid-column-gap: 20px;
	}
}

@media(max-width:1024px) {
	.article_wrapper {
		grid-template-columns: 1fr;
	}
}


.entry-meta span {
	display: block;
}

.entry-meta span,
.entry-meta a {
	font-size: 90%;
}

.download img,
.entry-meta img {
	width: 12px;
	margin-right: 5px;
}

.article_wrapper article {
	border-radius: 16px;
	padding: 0 20px 20px 20px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
}

.entry-summary {
  margin-top: auto;
}

.article_wrapper article .button {
	margin-top: 20px;
	display: block;
	text-align: center;
}

.button small {
	color: var(--lightblue);
}

.post-index ul {
	padding: 2em 1em;
}

.post-index a {
	color: var(--blue);
}

.post-index a:hover {
	color: #111111;
}