@charset "utf-8";
#walksteps {clear: both;}
.walkgrid {display: grid; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));}
/* https://css-tricks.com/auto-sizing-columns-css-grid-auto-fill-vs-auto-fit/ */
.walklist {display: flex; flex-direction: column;}

.walkgrid p {margin: 0 0 auto;}
.walklist p {margin: 0 0 0.5rem;}
.walkLatLong {font-size: x-small; border-collapse: collapse; margin: 0.5rem 0 0;}
.walkLatLong td:first-of-type {font-weight: bold;}

/*.walkgrid li {display: flex; flex-direction: column; justify-content: space-between; position: relative;}*/
.thumbwalk figure {width: 100%; display: flex; margin: 0;}
.walkgrid .thumbwalk figure {min-height: 160px;}
.thumbwalk img {border: medium inset var(--borderThumbnail); margin: auto;}
.walklist .thumbwalk {float: right; min-width: 159px; margin: 5px 0;}

@media screen {
	#parkingText {border: solid 1px var(--borderWheat); margin: 0 0 10px;}
	#parkingText {margin: 0 0 10px; padding: 0 10px;}
	#parkingText::before {content:  url(/images/buttons/btn_parking.png) " "; vertical-align: top;}
	#parkingText .btnTPMap, #parkingText .btnTPMapAdd {top: 0;}
	
	
	#btngrid {float: right; margin-bottom: 2px;}
	#btngrid input {display: none;}
	#btngrid label {text-indent: -3000px; overflow: hidden; float: left;}
	#btngrid label, #btngrid a {display: block; width: 35px; height: 22px;}
	
	#btngrid_grid_label.grid_selected	{background:var(--buttonGal) -403px -66px no-repeat;}
	#btngrid_grid_label.grid_unselected	{background:var(--buttonGal) -403px   0   no-repeat;}
	#btngrid_list_label.grid_selected  	{background:var(--buttonGal) -438px -66px no-repeat;}
	#btngrid_list_label.grid_unselected {background:var(--buttonGal) -438px   0   no-repeat;}
	
	#btngrid_grid_label a:hover, #btngrid_grid_label a:focus {background:var(--buttonGal) -403px -22px no-repeat;}
	#btngrid_list_label a:hover, #btngrid_list_label a:focus {background:var(--buttonGal) -438px -22px no-repeat;}
	
	#btngrid_grid_label a:active {background:var(--buttonGal) -403px -44px no-repeat;}
	#btngrid_list_label a:active {background:var(--buttonGal) -438px -44px no-repeat;}
	
	.walkgrid li {border: solid 1px var(--borderWheat); padding: 5px; list-style-position: inside; position: relative;}
	.thumbwalk img {cursor: zoom-in;}

	#walksteps.walklist li {clear: both; border-style: solid none none none; border-width: 1px; border-color:#C60; padding: 0; margin: 0 0 1rem 2rem;}
	
	.btnhits {position: absolute; right: 0; top: 0; background-image: none;}
}
@media print {
	#btngrid {display: none;}
	#walksteps {flex-direction: column; flex-wrap: nowrap;}

	#walksteps li {clear: both; border-style: solid none none none; border-width: 1px; border-color:#C60; padding: 0; list-style-position: outside;
		page-break-before: auto; page-break-inside: avoid; margin: 0 0 1rem 2rem;}
	#walksteps li:nth-child(6n) {page-break-before: always;}	
}

@media only screen and (max-width: 750px)
{
	.btnhits {display: none;}
}

@media only screen and (max-width: 520px)
{
	.walkgrid .thumbwalk figure {min-height: unset;}
	.thumbwalk img {margin: 0 auto;}
	.walklist .walkLatLong {margin: 0 auto 0 0;}
}
