html {
  font-size: 16px;
  --screenWidth: 1094px; /*84.375rem, 68.375rem*/
  --desktopFontSize: 27px;
  --mobileFontSize: 12px;



/*these vars aren't used, unfortunately because IE11 STILL doesn't support CSS vars in 2019*/
}

body {
	margin: 0px;
	padding: 0px;
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	background: #e7eef5;
	color: #222222;

}

body::-webkit-scrollbar {
    width: 1em;
}
 
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}


a, a:visited, a:active {
	font-family: arial, helvetica, sans-serif;
	font-size: 0.75rem;
	color: #27609b;
	text-decoration: none;
}

a:hover {
	color: #27609b;
	text-decoration: underline;
}

img {
	padding: 0;
	border: 0px;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}
	
#container {
	width: 1094px; /*actual box width 1350px, --screenWidth*/
	margin: 0 auto;	
	padding: 0px;
	display: block;
	margin-left: auto;
	margin-right: auto;	
}

#header {
	width: 1094px; /*header width 1350px, --screenWidth*/
	height: 167px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	background: url('images/logo6.jpg'); 
	background-size: 100%;
	float: left;
	border-left: 1px solid #7fabda;
	border-right: 1px solid #7fabda;
}

#header h1 {
	color: #ffffff;
	letter-spacing: -1px;
	font-size: 36px;
	font-weight: normal;
	margin: 26px 0px 0px 30px;
	padding: 0px;
}

#header p {
	margin-top: 0px;
	margin-left: 32px;
	margin-bottom: 0px;
	padding: 0px;
	text-align: left;
	font-size: 14px;
	color: #accbea;
}

#header h1 a, #header h1 a:visited, #header h1 a:active, #header h1 a:hover {
	color: #ffffff;
	font-size: 36px;
	text-decoration: none;
}

#topmenu {
	float: left;
	position: absolute;
	top: 130px;
	padding: 0px 0px 0px 30px;
	margin: 0px;
}

#topmenu ul {
	display: inline;
	margin: 0px;
	padding: 0px;
}

#topmenu li {
	display: inline;
	list-style: none;
	margin: 0px;
	padding: 0px;

}

#topmenu li a, #topmenu li a:visited, #topmenu li a:active {
	display: block;
	color: #222222;
	text-decoration: none;
	background: url('images/blue-br.gif') right top no-repeat;
	float: left;
	margin: 0px 3px 0px 0px;
	padding: 12px 10px 11px 0px;
}

#topmenu li a span, #topmenu li a:visited span, #topmenu li a:active span {
	background: url('images/blue-bl.gif') top left no-repeat;
	padding: 12px 15px 11px 25px;
}

#topmenu li a:hover span {
	text-decoration: underline;
}

#topmenu li a.highlight, #topmenu li a:visited.highlight, #topmenu li a:active.highlight {
	background: url('images/blue-brh.gif') right top no-repeat;
}

#topmenu li a.highlight span, #topmenu li a:visited.highlight span, #topmenu li a:active.highlight span {
	background: url('images/blue-blh.gif') top left no-repeat;
}

/*break1*/

#contentcontainer {
	float: left;
	width: var(--screenWidth); /*actual box width, 1350px*/
	background: #ffffff; 
	margin: 0px;
	padding: 20px 0px 0px 0px;
	border-left: 1px solid #b4b9bf;
	border-right: 1px solid #b4b9bf;
}

#content {
	width: 64.625rem; /*text, width* 1290px*/
	float: left;
	display: inline;
	margin: 15px 3px 0px 30px;
	padding: 0px 0px 35px 0px;
	
}

#content p {
	line-height: 130%;
	margin: 12px 0px 12px 0px;
	padding: 0px;
}

#content h2 {
	border-bottom: 2px solid #7fabda;
	/*border-bottom: 3px solid #e7eef5;*/
}

#content h2, #content h2 a, #content h2 a:visited, #content h2 a:active {
	letter-spacing: -1px;
	font-size: 40px;
	text-decoration: none;
	font-weight: normal;
	color: #27609b;
	margin: 0px;
	padding-top: 20px;
}

#content h2 a:hover {
	text-decoration: none;
	color: #222222;
}

#content h3, #content h3 a, #content h3 a:visited, #content h3 a:active {
	padding-top: 25px;
	letter-spacing: 1px;
	font-size: 60px;
	text-decoration: none;
	font-weight: bold;
	color: #000066;
	/*color: #27609b;*/
	margin: 0px;
}

#content h4, #content h4 a, #content h4 a:visited, #content h4 a:active {
	letter-spacing: 3px;
	font-size: 29px;
	text-decoration: none;
	font-weight: normal;
	color: #27609b;
	margin: 0px;
	padding-top: 4px;
	padding-bottom: 4px;
	line-height: 35pt;
}

#content f1{
	margin: 0px;
	letter-spacing: 1px;
	font-size: 25px;	
	font-weight: bold;
}

.entry {
	margin: 0px;
	letter-spacing: 1px;
	font-size: 1.5625rem;	
	padding: 6px 0px 0px 0px;
	line-height: 26pt;
}




/*break*/




/*1100px*/
/*980 - ipad*/
/*ipad*/
@media only screen 
and (max-device-width : 1079px){ 
/*and (min-device-width : 768px) 
and (max-device-width : 1024px){*/
	.dirs {
		margin: 0px;
		margin-left: 14.125rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: var(--desktopFontSize);	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 18px;	/*1.5625rem;*/
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}
	
	#content dirTab {
		margin: 0px;
		margin-left: 2.5rem; /*35px*/
		letter-spacing: 1px;
		font-size: var(--desktopFontSize);	
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	p2 	{
		display: block;
		margin-top: 40px;
		margin-bottom: 20px;
		margin-left: 18px;
		margin-right: 0;
		line-height: 0pt;
		}
		
	.modal {
		display: none; /* Hidden by default */
		position: fixed; /* Stay in place */
		z-index: 1; /* Sit on top */
		padding-top: 100px; /* Location of the box */
		left: 0;
		top: 0;
		width: 100%; /* Full width */
		height: 100%; /* Full height */
		overflow: auto; /* Enable scroll if needed */
		background-color: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
		}

/* #### - modal overlay plus contents - #### */
#gallery .overlay { position:fixed; overflow:hidden; left:0; top:0; width:0; height:0; z-index:9999; text-align:center; color:#fff; background:rgba(0,0,0,.75) }
#gallery .overlay div { position:absolute; bottom:1px; left:1px; right:1px }
#gallery .overlay div p { font-size:0.875em; text-align:center; max-width:60em; margin:0 auto; padding:0.5em 1em; background:rgba(0,0,0,.75); border-radius:2em }
#gallery .overlay div a { display:inline; color:#fff; text-decoration:none }
#gallery .overlay img { max-width:90%; max-height:90%; position:absolute; opacity:0; float:none; margin:0; top:48%; left:50%; 
	-webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%); 
	-moz-box-sizing:border-box; box-sizing:border-box; -webkit-transition:opacity .5s linear; transition:opacity .5s linear
	}
#gallery .overlay:target { width:auto; height:auto; bottom:0; right:0; padding:0.5em 0 5em }
#gallery .overlay:target img { opacity:1 }

/* #### - gallery controls - #### */
#gallery .close { position:absolute; z-index:1001; font:bold 2.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
/*size of X*/
#gallery .close:hover { background:#666 }
#gallery .prev, #gallery .next { color:transparent; position:absolute; z-index:1000; display:inline-block; top:0; right:0; width:50%; height:100% }
#gallery .prev { left:0 }
#gallery .next:after, #gallery .prev:after { content:"\203A"; display:block; position:relative; top:43%; right:0; font-size:10em; color:#222; text-align:right; opacity:.75;  
	text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff;
	-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%)
	}
#gallery .prev:after { content:"\2039"; text-align:left }
#gallery .next:hover:after, #gallery .prev:hover:after { color:#666 }


@media ( min-width:48.75em ) { /* #### - make better use of space at 780px (780/16=48.75 - 16px being default browser font-size) - #### */
	#gallery .overlay div { position:relative; bottom:auto }
	#gallery .overlay img { border:2px solid #fff; border-radius:0.3125em; position:relative; top:auto; left:auto; -webkit-transform:none; -ms-transform:none; transform:none }
	#gallery .overlay:target { padding-top:23% } /*top padding of image*/
	#gallery .prev, #gallery .next { display:block; left:50%; top:12.2%; width:2.5em; height:auto; background:#222; font:bold 1.225em/1.875em Arial; color:#fff; padding:0 0.5em; border-radius:0.3125em; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
	/*size of prev/next, top padding too*/
	#gallery .prev { margin-left:-5.625em; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
	#gallery .next { margin-left:1.85em }
	#gallery .prev:hover, #gallery .next:hover { background:#666 }
	#gallery .next:after, #gallery .prev:after { display:none }
	#gallery .close { top:11.5% } /*top padding of X*/
	}		
}

@media only screen 
and (max-device-width : 1079px)
and (orientation : landscape) { 
	#gallery .overlay div { position:relative; bottom:auto }
	#gallery .overlay img { border:2px solid #fff; border-radius:0.3125em; position:relative; top:auto; left:auto; -webkit-transform:none; -ms-transform:none; transform:none }
	#gallery .overlay:target { padding-top:5.875em } /*top padding of image*/
	#gallery .prev, #gallery .next { display:block; left:50%; top:2.2em; width:2.5em; height:auto; background:#222; font:bold 1.225em/1.875em Arial; color:#fff; padding:0 0.5em; border-radius:0.3125em; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
	/*size of prev/next, top padding too*/
	#gallery .prev { margin-left:-5.625em; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
	#gallery .next { margin-left:1.85em }
	#gallery .prev:hover, #gallery .next:hover { background:#666 }
	#gallery .next:after, #gallery .prev:after { display:none }
	#gallery .close { top:0.9em } /*top padding of X*/


}


/*mobile phones*/
@media only screen 
and (max-device-width : 767px)  {
/*and (min-device-width : 320px) 
and (max-device-width : 640px)  {*/
	.dirs {
		margin: 0px;
		margin-left: 9rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 12px;	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: var(--mobileFontSize);	/*1.5625rem;*/
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}
	
	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: var(--mobileFontSize);	
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	p2 	{
		display: block;
		margin-top: 60px;
		margin-bottom: 20px;
		margin-left: 18px;
		margin-right: 0;
		line-height: 0pt;
		}		

	.modal {
		display: none; /* Hidden by default */
		position: fixed; /* Stay in place */
		z-index: 1; /* Sit on top */
		padding-top: 500px; /* Location of the box */
		left: 0;
		top: 0;
		width: 100%; /* Full width */
		height: 100%; /* Full height */
		overflow: auto; /* Enable scroll if needed */
		background-color: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
		}

	.modal-content {
		margin: auto;
		display: block;
		width: 80%;
		max-width: 700px;
	}			

/* #### - modal overlay plus contents - #### */
#gallery .overlay { position:fixed; overflow:hidden; left:0; top:0; width:0; height:0; z-index:9999; text-align:center; color:#fff; background:rgba(0,0,0,.75) }
#gallery .overlay div { position:absolute; bottom:1px; left:1px; right:1px }
#gallery .overlay div p { font-size:0.875em; text-align:center; max-width:60em; margin:0 auto; padding:0.5em 1em; background:rgba(0,0,0,.75); border-radius:2em }
#gallery .overlay div a { display:inline; color:#fff; text-decoration:none }
#gallery .overlay img { max-width:85%; max-height:85%; position:absolute; opacity:0; float:none; margin:0; top:48%; left:50%; 
	-webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%); 
	-moz-box-sizing:border-box; box-sizing:border-box; -webkit-transition:opacity .5s linear; transition:opacity .5s linear
	}
#gallery .overlay:target { width:auto; height:auto; bottom:0; right:0; padding:0.5em 0 5em }
#gallery .overlay:target img { opacity:1 }

/* #### - gallery controls - #### */
#gallery .close { position:absolute; z-index:1001; font:bold 3.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
/*size of X*/
/*#gallery .close { position:absolute; z-index:1001; font:bold 1.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }*/
#gallery .close:hover { background:#666 }
#gallery .prev, #gallery .next { color:transparent; position:absolute; z-index:1000; display:inline-block; top:0; right:0; width:50%; height:100% }
#gallery .prev { left:0 }
#gallery .next:after, #gallery .prev:after { content:"\203A"; display:block; position:relative; top:43%; right:0; font-size:10em; color:#222; text-align:right; opacity:.75;  
	text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff;
	-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%)
	}
#gallery .prev:after { content:"\2039"; text-align:left }
#gallery .next:hover:after, #gallery .prev:hover:after { color:#666 }


@media ( min-width:48.75em ) { /* #### - make better use of space at 780px (780/16=48.75 - 16px being default browser font-size) - #### */
	#gallery .overlay div { position:relative; bottom:auto }
	#gallery .overlay img { border:2px solid #fff; border-radius:0.3125em; position:relative; top:auto; left:auto; -webkit-transform:none; -ms-transform:none; transform:none }
	#gallery .overlay:target { padding-top:28em } /*top padding of image*/
	#gallery .prev, #gallery .next { display:block; left:50%; top:13.9em; width:2.5em; height:auto; background:#222; font:bold 1.7em/1.875em Arial; color:#fff; padding:0 0.5em; border-radius:0.3125em; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
	/*size of prev/next, top padding too, top:13.9em;*/
	#gallery .prev { margin-left:-5.625em; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
	#gallery .next { margin-left:1.85em }
	#gallery .prev:hover, #gallery .next:hover { background:#666 }
	#gallery .next:after, #gallery .prev:after { display:none }
	#gallery .close { top:6.5em } /*top padding of X*/
	}

@media all and (min--moz-device-pixel-ratio:0){

	.dirs {
		margin: 0px;
		margin-left: 13rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 30px;	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: 30px;	/*var(--desktopFontSize)*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}		
	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 25px;
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}		
}

@supports (-webkit-overflow-scrolling: touch) {
  	.dirs {
		margin: 0px;
		margin-left: 13rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 30px;	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	} 
	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: 25px;	
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}	
	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 25px;
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}  
}
	
}
/*mobile phones in landscape mode*/
@media only screen 
and (max-device-width : 823px)
and (orientation : landscape)  {
/*and (min-device-width : 320px) 
and (max-device-width : 640px)  {*/
	.dirs {
		margin: 0px;
		margin-left: 16.5rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 15px;	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: var(--mobileFontSize);	/*1.5625rem;*/
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}	
	
	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: 15px;	
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}	

	p2 	{
		display: block;
		margin-top: 30px;
		margin-bottom: 20px;
		margin-left: 18px;
		margin-right: 0;
		line-height: 0pt;
		}	
	
	.modal {
		display: none; /* Hidden by default */
		position: fixed; /* Stay in place */
		z-index: 1; /* Sit on top */
		padding-top: 100px; /* Location of the box */
		left: 0;
		top: 0;
		width: 100%; /* Full width */
		height: 100%; /* Full height */
		overflow: auto; /* Enable scroll if needed */
		background-color: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
		}

/* #### - modal overlay plus contents - #### */
#gallery .overlay { position:fixed; overflow:hidden; left:0; top:0; width:0; height:0; z-index:9999; text-align:center; color:#fff; background:rgba(0,0,0,.75) }
#gallery .overlay div { position:absolute; bottom:1px; left:1px; right:1px }
#gallery .overlay div p { font-size:0.875em; text-align:center; max-width:60em; margin:0 auto; padding:0.5em 1em; background:rgba(0,0,0,.75); border-radius:2em }
#gallery .overlay div a { display:inline; color:#fff; text-decoration:none }
#gallery .overlay img { max-width:100%; max-height:100%; position:absolute; opacity:0; float:none; margin:0; top:48%; left:50%; 
	-webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%); 
	-moz-box-sizing:border-box; box-sizing:border-box; -webkit-transition:opacity .5s linear; transition:opacity .5s linear
	}
#gallery .overlay:target { width:auto; height:auto; bottom:0; right:0; padding:0.5em 0 5em }
#gallery .overlay:target img { opacity:1 }

/* #### - gallery controls - #### */
#gallery .close { position:absolute; z-index:1001; font:bold 1.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
/*size of X*/
/*#gallery .close { position:absolute; z-index:1001; font:bold 1.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }*/
#gallery .close:hover { background:#666 }
#gallery .prev, #gallery .next { color:transparent; position:absolute; z-index:1000; display:inline-block; top:0; right:0; width:50%; height:100% }
#gallery .prev { left:0 }
#gallery .next:after, #gallery .prev:after { content:"\203A"; display:block; position:relative; top:43%; right:0; font-size:10em; color:#222; text-align:right; opacity:.75;  
	text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff;
	-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%)
	}
#gallery .prev:after { content:"\2039"; text-align:left }
#gallery .next:hover:after, #gallery .prev:hover:after { color:#666 }


@media ( min-width:48.75em ) { /* #### - make better use of space at 780px (780/16=48.75 - 16px being default browser font-size) - #### */
	#gallery .overlay div { position:relative; bottom:auto }
	#gallery .overlay img { border:2px solid #fff; border-radius:0.3125em; position:relative; top:auto; left:auto; -webkit-transform:none; -ms-transform:none; transform:none }
	#gallery .overlay:target { padding-top:2.875em } /*top padding of image*/
	#gallery .prev, #gallery .next { display:block; left:50%; top:1.0em; width:2.5em; height:auto; background:#222; font:bold 0.875em/1.875em Arial; color:#fff; padding:0 0.5em; border-radius:0.3125em; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
	/*size of prev/next, top padding too*/
	#gallery .prev { margin-left:-5.625em; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
	#gallery .next { margin-left:1.85em }
	#gallery .prev:hover, #gallery .next:hover { background:#666 }
	#gallery .next:after, #gallery .prev:after { display:none }
	#gallery .close { top:.5em } /*top padding of X*/
	}

@media all and (min--moz-device-pixel-ratio:0){

	.dirs {
		margin: 0px;
		margin-left: 13rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 30px;	/*1.5625rem;*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}

	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: 30px;	/*var(--desktopFontSize)*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}		
	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 25px;	/*1.5625rem;*/
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}	
}
	
}

/*desktops*/
@media only screen 
and (min-device-width : 1080px) {
	
	.dirs {
		margin: 0px;
		margin-left: 14rem; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 27px;	/*1.5625rem; var(--desktopFontSize)*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}
	
	.galldescpt{
		margin: 0px;
		margin-left: 0px; /*370px 23.125em*/
		letter-spacing: 1px;
		font-size: 20px;	/*1.5625rem;*/
		padding: 0px 0px 0px 0px;
		line-height: 36pt;
	}	
	
	#content dirTab {
		margin: 0px;
		margin-left: 2.1rem; /*35px*/
		letter-spacing: 1px;
		font-size: 27px;	/*var(--desktopFontSize)*/
		padding: 0px 0px 15px 0px;
		line-height: 36pt;
	}	

	p2 	{
		display: block;
		margin-top: 40px;
		margin-bottom: 20px;
		margin-left: 18px;
		margin-right: 0;
		line-height: 0pt;
		}	

	.modal {
		display: none; /* Hidden by default */
		position: fixed; /* Stay in place */
		z-index: 1; /* Sit on top */
		padding-top: 100px; /* Location of the box */
		left: 0;
		top: 0;
		width: 100%; /* Full width */
		height: 100%; /* Full height */
		overflow: auto; /* Enable scroll if needed */
		background-color: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
		}

	.modal-content {
		margin: auto;
		display: block;
		width: 30%;
		max-width: 700px;
	}
	

/* #### - modal overlay plus contents - #### */
#gallery .overlay { position:fixed; overflow:hidden; left:0; top:0; width:0; height:0; z-index:9999; text-align:center; color:#fff; background:rgba(0,0,0,.75) }
#gallery .overlay div { position:absolute; bottom:1px; left:1px; right:1px }
#gallery .overlay div p { font-size:0.875em; text-align:center; max-width:60em; margin:0 auto; padding:0.5em 1em; background:rgba(0,0,0,.75); border-radius:2em }
#gallery .overlay div a { display:inline; color:#fff; text-decoration:none }
#gallery .overlay img { max-width:100%; max-height:100%; position:absolute; opacity:0; float:none; margin:0; top:48%; left:50%; 
	-webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%); 
	-moz-box-sizing:border-box; box-sizing:border-box; -webkit-transition:opacity .5s linear; transition:opacity .5s linear
	}
#gallery .overlay:target { width:auto; height:auto; bottom:0; right:0; padding:0.5em 0 5em }
#gallery .overlay:target img { opacity:1 }

/* #### - gallery controls - #### */
#gallery .close { position:absolute; z-index:1001; font:bold 1.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
/*size of X*/
/*#gallery .close { position:absolute; z-index:1001; font:bold 1.5em/1.3em Arial; color:#fff; background:#222; top:1px; left:50%; margin-left:-0.725em; width:1.25em; height:1.25em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }*/
#gallery .close:hover { background:#666 }
#gallery .prev, #gallery .next { color:transparent; position:absolute; z-index:1000; display:inline-block; top:0; right:0; width:50%; height:100% }
#gallery .prev { left:0 }
#gallery .next:after, #gallery .prev:after { content:"\203A"; display:block; position:relative; top:43%; right:0; font-size:10em; color:#222; text-align:right; opacity:.75;  
	text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 5px #fff;
	-webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%)
	}
#gallery .prev:after { content:"\2039"; text-align:left }
#gallery .next:hover:after, #gallery .prev:hover:after { color:#666 }


 /* #### - make better use of space at 780px (780/16=48.75 - 16px being default browser font-size) - #### */
	#gallery .overlay div { position:relative; bottom:auto }
	#gallery .overlay img { border:2px solid #fff; border-radius:0.3125em; position:relative; top:auto; left:auto; -webkit-transform:none; -ms-transform:none; transform:none }
	#gallery .overlay:target { padding-top:2.875em } /*top padding of image*/
	#gallery .prev, #gallery .next { display:block; left:50%; top:1.0em; width:2.5em; height:auto; background:#222; font:bold 0.875em/1.875em Arial; color:#fff; padding:0 0.5em; border-radius:0.3125em; border:2px solid #fff; box-shadow:0 0 0 1px rgb(102,102,102) }
	/*size of prev/next, top padding too*/
	#gallery .prev { margin-left:-5.625em; -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1) }
	#gallery .next { margin-left:1.85em }
	#gallery .prev:hover, #gallery .next:hover { background:#666 }
	#gallery .next:after, #gallery .prev:after { display:none }
	#gallery .close { top:.5em } /*top padding of X*/
	

}
/*980 1800*/


.dirTitle {
	margin: 0px;
	letter-spacing: 1px;
	font-size: 25px;	
	padding: 6px 0px 0px 0px;
	line-height: 26pt;
}
.post {
	margin: 0px;
	padding: 0px 0px 14px 0px;
}

/*p2 {
  display: block;
  margin-top: 40px;
  margin-bottom: 20px;
  margin-left: 18px;
  margin-right: 0;
  line-height: 0pt;
}*/

#content p.posted {
	font-size: 12px;
	height: 15px;
	text-align: right;
	color: #6e6e6e;
	margin-top: 2px;
	margin-bottom: 0px;
	padding: 0px;
}

.posted a, .posted a:visited, .posted a:active {
	color: #6e6e6e;
}
.posted a:hover {
	text-decoration: underline;
	color: #222222;
}

.posttime {
	float: left;
	background: url('images/icon-post.gif') no-repeat left center;
	padding: 0px 0px 0px 13px;
	margin: 0px;
	color: #6e6e6e;
}

.comments {
	background: url('images/icon-com.gif') no-repeat left center;
	width: 100%;
	text-align: right;
	padding: 0px 0px 0px 16px;
	margin: 0px;
}

.exp{
	display:inline-block;
    width:200px; /*220 by 264*/
    height:240px;
    line-height:0px;
    text-align:center;
    vertical-align:middle;
	padding: 30px 60px 30px 60px;
    
}

.pa{
	display:inline-block;
    width:250px; /*220 by 264*/
    height:290px;
    line-height:0px;
    text-align:center;
    vertical-align:middle;
	padding: 30px 60px 0px 60px;
    
}

.icon-caption__image{
	display:inline-block;
	height:auto;
	width:100%;
	max-width:56px;
	max-height:56px;
	margin-bottom:10px;
}

.icon-caption__text{word-break:break-word;hyphens:auto}

#content .tags {
	padding: 0px 0px 0px 18px;
	margin: 12px 0px 12px 0px;
	background: url('images/icon-tag.gif') no-repeat left center;
}

h3 {
	margin: 10px 0px 14px 0px;	
	color: #27609b;
	font-size: 15px;
	font-weight: bold;
}

#commentlist {
	list-style: none;
	margin: 0;
	padding: 0px;
}

#commentlist li {
	margin: 0px;
	padding: 14px 11px 10px 11px;
}

#commentlist .altcolor1 {
	background: #e7eef5;
}

#commentlist .altcolor2 {
	background: #ffffff;
}

#commentlist li p {
	margin-top: 12px;
	margin-bottom: 6px;
	line-height: 130%;
}

#writecomment {
	background: #e7eef5;
	border: 1px solid #b4b9bf;
	padding: 10px 10px 10px 15px;
	margin-top: 20px;
}

#writecomment p {
	margin: 10px;
}

form {
	padding: 0;
	margin: 0;
}

#commentform textarea {
	width: 95%;
	padding: 2px;
	border: 1px solid #b4b9bf;
}
	
#commentform input {
	width: 180px;
	margin: 0px 7px 0px 0px;
	border: 1px solid #b4b9bf;
}
	
#commentform #submit {
	background-color: #ffffff;
	border: 1px solid #b4b9bf;
	color: #222222;
}

blockquote {
	margin: 15px 30px 15px 5px;
	padding-left: 10px;
	border-left: 5px solid #d7d7d7;
	color: #6e6e6e;
}

#content .postpagesnav {
	padding: 15px 5px 5px 5px; 
	margin: 0px; 
	}

#content .postpagesnav .older {
	width:50%;
	float:left;
	}

#content .postpagesnav .newer {
	width: 50%; 
	float: right; 
	text-align:right;
	}


#sidebar {
	width: 305px;
	border-left: 1px solid #e7eef5;
	margin: 11px 0px 0px 0px;
	padding-left: 30px;
	float: left;
}

#sidebar .about {
	background: #e7eef5;
	border: 1px solid #b4b9bf;
	padding: 12px 15px 12px 15px;
}

#sidebar .about h2 {
	margin-top: 10px;
}

#sidebarleft {
	width: 147px;
	margin-right: 11px;
	float: left;
}

#sidebarright {
	width: 147px;
	float: left;
}

#sidebar h2 {
	color: #27609b;
	padding: 0px 0px 1px 0px;
	font-size: 18px;
	border-bottom: 1px solid #e7eef5;
	font-weight: normal;
	margin-bottom: 0px;
	margin-top: 20px;

}

#sidebar ul {
	list-style: none; 
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;
}

#sidebar li {
	margin-left: 0px;
	margin-bottom: 3px;
}

#sidebar ul li ul {
	list-style: none; 
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-right: 0px;
}

#sidebar ul li ul li {	
	border-bottom: 1px dotted #e7eef5;
	margin-left: 0px;
	padding-bottom: 3px;
	padding-left: 0px;
}

#sidebar ul li ul li a, #sidebar ul li ul li a:visited, #sidebar ul li ul li a:active {
	color: #222222;
}

#sidebar ul li ul li a:hover {
	color: #27609b;
	text-decoration: none;
}

#searchform {
	margin-top: 12px;		
}

#searchfield {
	border: 1px solid #b4b9bf;
	color: #222222;
	width: 200px;
	padding: 1px;
	margin: 1px;
	height: 18px;		
}

#contentb {
	float: left;
	display: inline;
	text-align: center;
	width: 1094px; /*width, --screenWidth*/
	background: #e7eef5; 
	border-top: 1px solid #b4b9bf;
	margin: 0px;	
	padding: 16px 0px 16px 0px;
}

#contentb p {
	margin: 0px;
	padding: 0px;
}



/* The work below, CSSBox, is released under the Creative Commons
   Attribution-ShareAlike 4.0 license and is available on
   https://github.com/TheLastProject/CSSBox. You are not required to add
   additional credit to your website, just leave the above text in this file */
div.cssbox {
  display: inline-block;
    padding: 16px 16px 16px 16px;
}

div.cssbox:hover{
	opacity: 1;
}

span.cssbox_full {
  z-index: 999;
  position: fixed;
  height: 100%;
  width: 100%;
  background-color: rgba(0,0,0,0.8);
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s linear;
}

span.cssbox_full img {
  position: fixed;
  background-color: white;
  margin: 0;
  padding: 0;
  max-height: 90%;
  max-width: 90%;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 20px black;
  opacity: 1;
}

a.cssbox_close,
a.cssbox_prev,
a.cssbox_next {
  z-index: 999;
  position: fixed;
  text-decoration: none;
  visibility: hidden;
  color: white;
  font-size: 80px;
}

a.cssbox_close {
  top: 1%;
  right: 1%
}

a.cssbox_close::after {
  content: '\00d7';
}

a.cssbox_prev,
a.cssbox_next {
  top: 50%;
  transform: translate(0%, -50%);
}

a.cssbox_prev {
  left: 5%;
}

a.cssbox_next {
  right: 5%;
}

/*a:hover {opacity: .2;}*/

a:target ~ a.cssbox_close,
a:target ~ a.cssbox_prev,
a:target ~ a.cssbox_next {
  visibility: visible;
}

a:target > img.cssbox_thumb + span.cssbox_full {
  visibility: visible;
  opacity: 1;
  pointer-events: initial;
}

img.cssbox_thumb:hover {
	opacity: .5;}

#gallery li a span b { display:inline-block; position:relative; width:1.75em; height:1.75em; line-height:3em; vertical-align:middle; border:.25em solid #000; border-radius:50% }
img.cssbox_thumb:before { content:""; position:absolute; top:.75em; left:.5em; width:.25em; height:.25em; background:#000;
	box-shadow:.2em 0 0 #000, .35em 0 0 #000, .5em 0 0 #000, .5em 0 0 #000, .25em .2em 0 #000, .25em .3em 0 #000, .25em -.2em 0 #000, .25em -.3em 0 #000
	}	
	
	
img.cssbox_thumb:after { content:""; position:absolute; top:1.5em; left:-.5em; width:.5em; height:1.5em; background:#000; border-radius:.2em;
	-webkit-transform:rotate(40deg); -ms-transform:rotate(40deg); transform:rotate(40deg)
	}	
	
	
span.cssbox_full {
  cursor: initial;
}
/* This is the end of CSSBox */




/*-------------------------------------------*/
/* #### - gallery thumbs - #### */
#gallery { margin:0px 0px 0px 23px; padding:0; list-style:none; display:table; *overflow:hidden;  }
#gallery li { position:relative;  width: 165px; display: inline-block; vertical-align: top; font-size: 16px; margin: 0px 160px 10px 0px; }
/*#gallery li { position:relative;  width: 165px; display: inline-block; vertical-align: top; font-size: 16px; margin: 0px 150px 10px 0px; }*/ /*width is set here*/
#gallery li a, #gallery li a img {   margin:0 auto; }
#gallery li a span { position:absolute; top:0; left:0; width:185%; height:100%; text-align:center; cursor:pointer; color:transparent; filter:alpha(opacity=0); opacity:0; background:#fff }
#gallery li a span:before { content:""; display:inline-block; height:100%; vertical-align:middle; margin-top:-0.25em } /* http://css-tricks.com/centering-in-the-unknown/ */
#gallery li a:hover span { filter:alpha(opacity=70); opacity:.7 }
#gallery li a:hover span b { filter:alpha(opacity=99); opacity:1 }
#gallery li a span, #gallery li a span b, #gallery li a:hover span, #gallery li a:hover span b { -webkit-transition:opacity .35s ease-in-out; transition:opacity .35s ease-in-out }





/* #### - gallery thumbs magnifying glass - #### */
#gallery li a span b { display:inline-block; position:relative; width:1.75em; height:1.75em; line-height:3em; vertical-align:middle; border:.25em solid #000; border-radius:50% }
#gallery li a span b:before { content:""; position:absolute; top:.75em; left:.5em; width:.25em; height:.25em; background:#000;
	box-shadow:.2em 0 0 #000, .35em 0 0 #000, .5em 0 0 #000, .5em 0 0 #000, .25em .2em 0 #000, .25em .3em 0 #000, .25em -.2em 0 #000, .25em -.3em 0 #000
	}
#gallery li a span b:after { content:""; position:absolute; top:1.5em; left:-.5em; width:.5em; height:1.5em; background:#000; border-radius:.2em;
	-webkit-transform:rotate(40deg); -ms-transform:rotate(40deg); transform:rotate(40deg)
	}