div.artgallery {
	display: grid;
	grid-template-columns: 50% 50%;
	background-color: none;
	
	border-color: var(--black_dark);
	border-radius: .5em;
	border-bottom-style: solid;
	border-bottom-width: .5em;

	/*color: var(--secondary_dark);*/
}

.artgallery.column3 {
		grid-template-columns: 33% 33% 33% !important;
}

.artgallery img {
	display: block;
	max-width: 90%;
	vertical-align: middle;
	margin:5%;
	
	border-color: none;
	border-radius: .75em;
	border-width: .5em;
}

a:has(img) {
	display: block;
	vertical-align: middle;
}

details.artgallery, details .artgallery {
	border-bottom-style: none;
	padding: .25em;
}

.volunteer {
	background-color: var(--accent1);
	color: var(--main_dark);
	
	margin-left: 2em;
	margin-right: 2em;
	margin-top: 1em;
	margin-bottom: 1em;
	
	padding: .25em;
	
	border-radius: 1em;
	border-bottom-style: solid;
	border-bottom-width: .5em;
	border-bottom-color: var(--black_light);
}

.tags.comicsans a {
	margin-left: .5em !important;
	margin-right: .5em !important;
}

article nav a {
	color: var(--accent1);
}

.tags.sub a:hover {
	color: var(--secondary_light);
}

.volunteer table {
	border-style: none;
	font-size: .75em;
	border-radius: 1.25em;
	background-color: var(--main_light);
}

.volunteer tr {
	border-bottom-right-radius: 1.25em;
	border-top-left-radius: 1.25em;
	margin: .5em;
}

.volunteer a {color: var(--black_light);}

.volunteer details p,
details.artgallery p {
	/*border: 5px solid blue;*/
	margin: 0;
	padding: .25em;
}

.volunteer summary,
.volunteer header {
	/*border: 5px solid red;*/
	font-family: "Comic Sans MS", "Comic Sans", sans-serif;
	color: var(--accent1);
	background-color: var(--main_dark);
	padding-left: 1em;
	box-shadow: 0em .25em .75em var(--main_dark);
	border-radius: .25em;
	margin: .25em;
}

.volunteer details blockquote {
 font-family: "Lucida", monospace;
 border-bottom-width: .5em;
}

.volunteer details blockquote p {
 margin-bottom: .5em;
}

.volunteer summary {text-align: left;}
.volunteer header {text-align: right;}

.volunteer summary p {
	display:contents;
	text-align: left;
	padding: 2em;
	line-height: 100%;
	border: 5px dotted green;
}

.volunteer header {
	font-variant: small-caps;
	font-weight: bold;
	background-image: linear-gradient( to left, var(--main_dark), var(--main_dark), var(--main_dark), var(--accent3), var(--secondary_dark), var(--black_dark) );
}

.volunteer summary{cursor: pointer;}

.artgallery summary {text-align: center;}

.volunteer tr, .artgallery img {
	box-shadow: 0em .25em .5em var(--main_dark);
}

.volunteer summary a {
	color: var(--main_light);
}

.volunteer summary:hover a {
	color: var(--black_dark);
}

.volunteer summary:hover,
.artgallery summary:hover {
	color: var(--main_dark);
	background-color: var(--accent1);
}

.volunteer header *,
.volunteer summary * {
	display: inline-block;
	vertical-align: middle;
	text-align: right;
	margin: .25em;
}

.volunteer header img,
 .volunteer summary img {
	width: 4em;
	clip: polygon(0 0, 4em 0, 4em 4em, 0% 4em);
	border-radius: 25%;
	border-style: solid;
	border-width: .25em;
	border-color: var(--accent2);
}

.volunteer tr {
	display: grid;
	grid-template-columns: 30% 70%;
}