/*  File common.css made with jAlbum 37.1 with FancyBox version 4.6.2, Gray-Textile.css style, album creation date 2025-04-09, 9:00 p.m.
 *   
 *  FancyBox Style sheet for the combined index / slide / template pages.
 *  Last change: 2025-04-06 by André Wolff
 */

html,body{margin:0;padding:0;border:0;outline:0;}
/* panorama layout */
.jDiorama,.jDiorama-viewport{width:100%;height:100%;overflow:hidden}
.jDiorama,.jDiorama-container{position:relative}
.jDiorama-container img{height:100%;position:absolute;top:0}

/* panorama style */
.jDiorama-viewport.cursorHand{cursor:url(grab.cur),default}
.jDiorama-viewport.cursorDrag{cursor:url(grabbing.cur),default}
.jDiorama-viewport.cursorLeftArrow{cursor:url(left.cur),default}
.jDiorama-viewport.cursorRightArrow{cursor:url(right.cur),default}
.jDiorama-viewport img{user-select:none;-o-user-select:none;-moz-user-select:none;-webkit-user-select:none}

.jDiorama { display:none; }

  .marker-blue {
      width: 20px;
      height: 20px;
      background-color: #5384ED;
      border: 4px solid white;
      border-radius: 50%;
      box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
  }

.inactive {
	color: #999;
}			 
.exifInfo {
	cursor: pointer;
}

 .moreInfo {
	display:none;
}

.triggerMoreInfo {     
   display: inline-block;     
   position: relative;    
   z-index: 1; 
   cursor: pointer;    
   padding: 2em;     
   margin: -2em; 
}

html, body {
	height: 100%;
	background-image:url(GrayTextile.jpg);
    background-position:center top;
    background-repeat:repeat;
} 		

body {
	text-align: center;
	overflow-x: hidden;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	font-size:18px;
	background-color: rgba(51,51,51,1.0);
	color: #ffffff;
	margin: 0px;
/* See https://forums.adobe.com/thread/1184309 */
	-webkit-user-select: none; /* Chrome all / Safari all */
	-o-user-select: none;
	user-select: none;
	-webkit-touch-callout:none;
}

.justified-gallery > a > .caption {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
}

img { border: 0px; }  /* required for IE */

/* Custom link styles */

a:link, .dummyLink { 
color: #00ccff; 
font-style: normal;
font-weight: bold;
text-decoration: none;
}  
a:visited {	
color: #00ccff; 
font-style: normal;	
font-weight: bold;	
text-decoration: none; 
} 
a:active  { 
color: #00ccff; 
font-style: normal; 
font-weight: bold; 
text-decoration: none;
}
a:hover   { 
color: #ffff00; 
font-weight: bold; 
text-decoration: none;
}

#nextSlide  {
	position: absolute;
	display:none;
	right: 10px;
	top: 48%;
	z-index: 9999;
}
#prevSlide  {
	position: absolute;
	display:none;
	left: 10px;
	top: 48%;
	z-index: 9999;
}

#expandPano  {
	position: absolute;
	display:none;
	right: 49%;
	top: 58px;
	z-index: 9999;
}

#link--play  {
	position: absolute;
	right: 132px;
	padding: 6px;
	z-index: 9999;
}

.homeBtn {
  width: 24px;
  height: 24px;
}

  /* Style the fixed menu */
.menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%; 
    background-color: rgba(0, 0, 0, 0.0); /* transparent */
    z-index: 9998;
}
.content {
    margin-top: 50px; /* Adjust this value to match the height of your menu */
    padding: 0px; 
}

/*********************************** Start Top navigation */
#navigation {
/*	background-color:#ffcccccc; for a full width menu-bar */
	z-index:999;
}

#navigation {
	position:relative;
	text-align:center;
	line-height:40px;
	margin-bottom: 10px;
}
.top-nav {
	text-align: center;
}
.top-nav a {
	display:block;
	white-space:nowrap;
	color: #000000;
	background-color: rgba(204,204,204,1.0);	
}

.top-nav ul {
	display:inline-block;
	vertical-align:top;
	padding:0;
	margin:0;
	list-style-type:none;
	z-index:998;
}
.top-nav b {
	color: #ffffff;
	font-weight: bold;
}
.top-nav > ul > li {
	position:relative;
	display:inline-block;
	width:auto;
	height:100%;
}
.ie7 .top-nav > ul > li {
	float:left;
}
.top-nav > ul > li.home img {
	height: 20px;
	width: 20px;
	vertical-align: middle;
	padding-bottom: 4px;
}
.top-nav > ul > li > a {
	line-height:40px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 10px;
	padding-left: 10px
}
.top-nav > ul > li ul {
	display:none;
	position:absolute;
	z-index:999; 
	background-color: rgba(204,204,204,1.0);	
}
.top-nav > ul > li > ul {
	min-width:100%;
}
.top-nav > ul > li > ul li {
	position:relative;
	display:block;
}
.top-nav > ul > li > ul > li a {
	line-height:40px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 10px;
	padding-left: 10px
}
.top-nav > ul > li > ul > li ul {
	left:100%;
	top:0;
}

.top-nav > ul > li:hover > ul,
.top-nav > ul > li > ul > li:hover > ul,
.top-nav > ul > li > ul > ul > li > li:hover > ul {
	display: block;
}
/***********************************  End  Top navigation */

.top-nav a:hover, .top-nav a:active, .HorNav a:hover, .HorNav a:active, #NavHor a:focus {
	color: #ffff00;  
	background-color: rgba(114,114,114,1.0);
	text-decoration: none; 
	box-shadow: inset 2px 2px 2px 2px rgba(114,114,114,1.0);
}

.HorNav{
	margin-bottom: 0px;
	margin-top: 0px;
	text-align: center;
	line-height: 50px;
}

.HorNav  img {
	vertical-align: middle;
	height: 30px;
	width: 30px;
	padding-bottom: 2px;
}

.HorNav a, .HorNav b, .HorNav a:visited {
	display: block;
	text-align: center;
	text-decoration: none;
	margin-right: 0px;
	margin-left: 0px;
	color: #000000;
	background-color: rgba(204,204,204,1.0);	
	padding-right: 10px;
	padding-left: 10px;
}
.HorNav b {
	color: #ffffff;
	font-weight: bold;
}
.HorNav ul {
 display:inline-block;
 list-style-type: none;
 padding-top: 0px;
 padding-right: 0px;
 padding-bottom: 0px;
 padding-left: 0px;
 margin-top: 0px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 0px;
}
.HorNav li {
	float: left;
	width: auto;
}
#indexDiv {
	display: none;
	position: relative;
}
#nav {
	height: 30px;
/*	width: 90%;
	margin-right: 5%;
	margin-left: 5%;   */
}

#nav #L1 {
	float: left;
	width: 10%;
}
#nav #L2 {
	float: left;
	width: 15%;
	text-align: center;
/* 	padding-top: 6px;  */
}
#nav #L3 {
	float: left;
	width: 10%;
}
#nav #L3 #fs {
	display: none;
}
#nav #Ml {
	float: left;
	width: 10%;
}

#nav #M {
	float: left;
	width: 10%;
}
#nav #Mr {
	float: left;
	width: 10%;
}
#nav #R3 {
	float: left;
	width: 10%;
}
#nav #R2 {
	float: left;
	width: 15%; 
}

#indexDiv #nav #R2 a .roundbutton {
display: inline;		
}
#nav #R1 {
	float: left;
	width: 10%;
}

#indexDiv #nav #R1 #opencloseSettings {
    position: relative;
}

#nav img {
	height: 30px;
	display: block;   
	margin-left: auto;   
	margin-right: auto;
	cursor: pointer;
}

#indexDiv #swipeMe p img {
	vertical-align: bottom;
}

.roundbutton {
  opacity: 1.00;
  cursor: pointer;
}
.HorNav  .roundbutton {
	vertical-align: middle;
}
button {
	font-size: 20px;
	cursor:pointer;
	text-decoration:none;
	margin-top: 10px;
	margin-bottom: 10px;
}


.button {
	cursor: pointer;
}

.filename {
	height: 54px;
	font-size: small;
	text-align: center;
}

.description {
	height: 54px;
	text-align: center;
}

.thumbs {
	margin-right: auto;
	margin-left: auto;
}

.thumbs img:hover,
.thumbs-jg img:hover,
.masonry_thumbs img:hover {  
	 -webkit-transform: scale(1.1);
	 -moz-transform: scale(1.1);
	 -o-transform: scale(1.1);
	 transform: scale(1.1);
}

.thumb-video { /* for thumbs on slide page */
	border: 2px solid  rgba(254,0,55,1.0);
}

.thumbs-jg img {
	cursor: zoom-in;
	box-sizing: border-box;
	border:2px solid !important; 
	border-color: rgba(204,204,204,1.0)  !important; 
	padding: 0px!important;
	border-radius:  4px;
}
.video-icon img {
	position: absolute;
	top: 3px;
	left: 5px;
	width: 32px;
	height: 32px;
	border: none !important; 
}
img.video {
	border-color: rgba(254,0,55,1.0) !important;
}
.justified-gallery > a > .jg-caption,
.justified-gallery > div > .jg-caption,
.justified-gallery > figure > .jg-caption {
 	bottom: 2px;
	left: 2px;
	right: 2px;
}
/*
.jg-entry {
	border: px solid ;
	position: relative;
}
*/

#folders img {  /* Folder thumbs */
	cursor: zoom-in;
	border-radius:  4px;
	padding:  0px;
	border: 2px solid;
	border-color: rgba(204,204,204,1.0);
	 -webkit-touch-callout: none;  /* Disable save image, and prevents a pop-up  */
	 -webkit-user-select: none;    /* disable copy, inv css  */
}

#thumbsgallery {
	background-color: rgba(255,255,255,0.0);
}
#thumbsgallery img{
	cursor: zoom-in;
}

#folders .box {
vertical-align: top;
	display: inline-block; 
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right: 10px;
	margin-left: 10px;
	padding: 6px;
	word-break: break-word; /* was break-all */
	cursor: pointer;
	border-radius:  0px;
	border: 0px solid;
	border-color: rgba(0,0,0,1.0);
	color: #ffffff;
	background-color: rgba(204,204,204,0.0);
}

#folders .box img {
	border-color: rgba(255,255,255,1.0);
}

#folders .box .folderDescription{
  font-size: 14px;
  font-weight: lighter;
}

#swipeMe {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-right:  6px;
	margin-left:  6px;
}

/* Header */
#themeImage {
	position: relative;
	overflow:hidden;
	clear:both;   /* for FF   */
	width: 100%;  /* for IE 6 */
	margin-left:auto;
	margin-right:auto;
	padding-top: 10px;
	padding-right: 4px;
	padding-bottom: 10px;
}

#themeImage img {
	border-radius:  4px;
	padding:  0px;
	border: 2px solid;
	border-color: rgba(204,204,204,1.0);
	 -webkit-touch-callout: none;  /* Disable save image, inv css  */
	 -webkit-user-select: none;   /*  disable copy, inv css  */
}


h1 {
	font-size: 24px;
	font-weight: bold;
	width: 100%;
	color: #ffffff;
	font-family: 'Open Sans', sans-serif;
}
#title_in_image {
	font-size: 24px;
	line-height: 24px;
	position: absolute;
	margin: 0px;
	display:none;
	color: #ffffff;
	text-shadow: none;
}

#title_above_image {
	display:none;
}
#title_above_image {
	width: 100%;
}
        
#title_above_image h1 {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

h2, h3 {
	font-weight: bold;
	width: 100%; 
	font-family: 'Open Sans', sans-serif;
}



 
#profileImage {
	margin-top: 10px;
	border-radius:  4px;
	width: 480px;
	max-width: 480px;
} 

#indexDiv audio {
	margin-top: 10px;
}

audio::-webkit-media-controls-panel {
	background-color:  rgba(0,0,0,0.0);
}

audio {
    width: 250px; /* 150: problem on iPad */
    height: 30px;
    opacity: 0.5;
}

audio:hover   { 
   opacity: 1;
}

.audioClip {
    margin-top: -8px;
    vertical-align: middle;
}

audio::-webkit-media-controls-panel {
    background-color: whitesmoke;
}

#imageinfo {
	visibility: hidden;
}

#askfs {
	margin-top: 5px;
	text-align: right;
}



#facebook  {
	position: absolute;
	top: 68px;
	left: 0px;
	width: 150px;
}

figure {
	display: none;
}

.panslidenavigation  {
	position: fixed;
	z-index: 999;
	display: none;
	right: 0px;
	padding: 20px;
	background: rgba(0,0,0,0.0);
              color: #ffffff;
}

#panorama {
	display:none;
	height: 100%;
	overflow:hidden;
	position:absolute; 
	left:0px; 
	top:0px; 
	z-index:10;
	white-space: nowrap;
}

#panorama img {
	height: 100%;
}

#Pan_container {
	width: 100%;
	height: 100%;
}

#mapDiv {
	display:none;
	height: 100%;
	width: 100%;
	overflow:hidden;
	position:absolute; 
	left:0px; 
	top:0px; 
	padding: 0px;
}
#map {
        height: 100%;
}
#mapnavigation {
		z-index: 999;
		position: absolute;
		top: 8px;
		right: 8px;
}

@media screen and (max-width: 480px) {
  #mapnavigation a svg {
  width: 32px;
  height: 32px;
  }
}

#links  img {
	cursor: pointer;
}

.buttonDiv { /* used for pano buttons */
	float: left;
	margin-right: 8px;
	margin-left: 8px;
}

.creditlink {
	font-size: 10px;
}


#indexDiv #swipeMe .albumDescription {
	margin-bottom: 25px;
	width: 95%; 
	margin-right: auto;
	margin-left: auto;
	display:inline-block;
}
#indexDiv #swipeMe .commandButtons {
	height: 60px;
	margin-top: 15px;
	margin-bottom: 15px;
}
#indexDiv #swipeMe .commandButtons img {
	max-height: 60px;
	vertical-align: middle;
	margin-right: 12px;
	margin-left: 12px;
}
#indexDiv #swipeMe .commandButtons button {
	margin-right: 12px;
	margin-left: 12px;
}


/* extra tooltip styles */

.tippy-tooltip.user-theme {
  background-color: rgba(255,255,255,1.0);
  border: 1px solid #000000;
  font-weight: bold;
  color: #000000;
}
.tippy-popper[x-placement^=right] .tippy-tooltip.user-theme .tippy-arrow {
    border-right: 7px solid #000000;
}
.tippy-popper[x-placement^=left] .tippy-tooltip.user-theme .tippy-arrow {
    border-left: 7px solid #000000;
}
.tippy-popper[x-placement^=top] .tippy-tooltip.user-theme .tippy-arrow {
    border-top: 7px solid #000000;
}
.tippy-popper[x-placement^=bottom] .tippy-tooltip.user-theme .tippy-arrow {
    border-bottom: 7px solid #000000;
}

/* copy skin colors */
.slicknav_menu { 
  font-size:18px;
 background-color: rgba(204,204,204,1.0);	
 } 

 .slicknav_nav a {
    color: #000000;
 } 
	
.slicknav_nav a:hover {
      background-color: rgba(114,114,114,1.0);
      color: #ffff00;
}	

/* To hide the hamburger button on large devices */
.slicknav_menu {
	display:none; 
}

@media screen and (max-width: 576px) {
	#navigation {
		display:none;
	}
	.slicknav_menu {
		display:block;
	}
}
/* fancybox styles jquery.fancybox.css */
/*
 *  File jquery.fancybox.css vs 3.5.7
 *  Last change: 2020-07-05 by André Wolff
 */
 body.compensate-for-scrollbar {
  overflow: hidden; 
}

.fancybox-active {
  height: auto; 
}

.fancybox-is-hidden {
  left: -9999px;
  margin: 0;
  position: absolute !important;
  top: -9999px;
  visibility: hidden; 
 }

.fancybox-container {
  -webkit-backface-visibility: hidden;
  height: 100%;
  
	background-image:url(GrayTextile.jpg);
    background-position:center top;
    background-repeat:repeat;
	background-color: rgba(51,51,51,1.0);

    left: 0;
    outline: none;
    position: fixed;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;

    transform: translateZ(0);
    width: 100%;
    z-index: 99992;
}

.fancybox-container * {
    box-sizing: border-box;
}

.fancybox-outer,
.fancybox-inner,
.fancybox-bg,
.fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}


.fancybox-infobar,
.fancybox-toolbar,
.fancybox-caption,
.fancybox-navigation .fancybox-button {
    direction: ltr;
    opacity: 0;
    position: absolute;
    transition: opacity .25s ease, visibility 0s ease .25s;
    visibility: hidden;
    z-index: 99997;
}

.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar,
.fancybox-show-caption .fancybox-caption,
.fancybox-show-nav .fancybox-navigation .fancybox-button {
    opacity: 1;
    transition: opacity .25s ease 0s, visibility 0s ease 0s;
    visibility: visible;
}

.fancybox-infobar { /* AW changed: */
  background: rgba(0,0,0,0.0);
  color: #ffffff;
	font-family: 'Roboto', serif;
   font-size:18px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.fancybox-toolbar {
    right: 0;
    top: 0;
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    transform: translateZ(0);
    z-index: 99994;
}

.fancybox-is-open .fancybox-stage {
    overflow: hidden;
}

.fancybox-slide {
    -webkit-backface-visibility: hidden;
    /* Using without prefix would break IE11 */
    display: none;
    height: 100%;
    left: 0;
    outline: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    transition-property: transform, opacity;
    white-space: normal;
    width: 100%;
    z-index: 99994;
}

.fancybox-slide::before {
    content: '';
    display: inline-block;
    font-size: 0;
    height: 100%;
    vertical-align: middle;
    width: 0;
}

.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--previous,
.fancybox-slide--current,
.fancybox-slide--next {
    display: block;
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 44px 0;
}

.fancybox-slide--image::before {
    display: none;
}

.fancybox-slide--html {
    padding: 6px;
}

.fancybox-content {
    background: #fff;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left;
    vertical-align: middle;
}

.fancybox-slide--image .fancybox-content {
    animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    -webkit-backface-visibility: hidden;
    background: transparent;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    left: 0;
    max-width: none;
    overflow: visible;
    padding: 0;
    position: absolute;
    top: 0;
    -ms-transform-origin: top left;
    transform-origin: top left;
    transition-property: transform, opacity;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99995;
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out;
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in;
}

.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
    cursor: -webkit-grab;
    cursor: grab;
}

.fancybox-is-grabbing .fancybox-content {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.fancybox-container [data-selectable='true'] {
    cursor: text;
}

.fancybox-image,
.fancybox-spaceball {
    background: transparent;
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
}

.fancybox-spaceball {
    z-index: 1;
}

.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%;
}

.fancybox-slide--video .fancybox-content {
    background: #000;
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df;
}

.fancybox-slide--iframe .fancybox-content {
    background: #fff;
}

.fancybox-video,
.fancybox-iframe {
    background: transparent;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%;
}

/* Fix iOS */
.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0;
}

.fancybox-error {
    background: #fff;
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%;
}

.fancybox-error p {
    color: #444;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0;
}

/* Buttons */
.fancybox-button { /* AW changed */
    background: rgba(0,0,0,0.0);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 44px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 44px;
}

.fancybox-button,
.fancybox-button:visited,
.fancybox-button:link {  /* AW changed */
  color: #ffffff; }

.fancybox-button:hover {  /* AW changed */
   color: #ffff00; }

.fancybox-button:focus {
    outline: none;
}

.fancybox-button.fancybox-focus {
    outline: 1px dotted;
}

.fancybox-button[disabled],
.fancybox-button[disabled]:hover {	
 /* AW was   color: #888; */
   color: #ffff00; 
    cursor: default;
    outline: none;
}

/* Fix IE11 */
.fancybox-button div {
    height: 100%;
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%;
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0;
}

.fancybox-button--play svg:nth-child(2),
.fancybox-button--fsenter svg:nth-child(2) {
    display: none;
}

.fancybox-button--pause svg:nth-child(1),
.fancybox-button--fsexit svg:nth-child(1) {
    display: none;
}

.fancybox-progress {
  background-color: rgba(255,0,0,1.0);
  height: 2px;  /* AW was 2px */
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -ms-transform-origin: 0;
    transform-origin: 0;
    transition-property: transform;
    transition-timing-function: linear;
    z-index: 99998;
}

/* Close button on the top right corner of html content */
.fancybox-close-small {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #ccc;
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401;
}

.fancybox-close-small:hover {
    color: #fff;
    opacity: 1;
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0;
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden;
}

.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
    display: none;
}

/* Navigation arrows */
.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 0;
   background-color: rgba(0,0,0,0.0); /* AW */
    position: absolute;
    top: calc(50% - 50px);
    width: 70px;
}

.fancybox-navigation .fancybox-button div {
    padding: 7px;
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    left: env(safe-area-inset-left);
    padding: 31px 26px 31px 6px;
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0;
    right: env(safe-area-inset-right);
}

/* Caption */

.fancybox-caption {
  bottom: 0;
  color: #000000;
  background-color: rgba(102,102,102,0.41960785);
	font-family: 'Roboto', sans-serif;
	font-size:18px;
  left: 0;
  line-height: 1.5;
/*  padding: 75px 44px 25px 44px AW replaced by: */
  padding: 12px;
  pointer-events: none;
  right: 0;
   text-align: center;
  z-index: 99996; 
  }

@supports (padding: max(0px)) {
    .fancybox-caption { /* AW */
        padding: 12px max(44px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left));
    }
}


.fancybox-caption__body {
    max-height: 50vh;
    overflow: auto;
    pointer-events: all;
}

/* Loading indicator */

.fancybox-loading {
    animation: fancybox-rotate 1s linear infinite;
    background: transparent;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999;
}

@keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg);
    }
}

/* Transition effects */

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1);
}

/* transitionEffect: slide */

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* transitionEffect: fade */

.fancybox-fx-fade.fancybox-slide--previous,
.fancybox-fx-fade.fancybox-slide--next {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1;
}

/* transitionEffect: zoom-in-out */

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(.5, .5, .5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1);
}

/* transitionEffect: rotate */

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;

    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg);
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

/* transitionEffect: circular */

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
}

/* transitionEffect: tube */

.fancybox-fx-tube.fancybox-slide--previous {
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}

.fancybox-fx-tube.fancybox-slide--next {
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}

.fancybox-fx-tube.fancybox-slide--current {
    transform: translate3d(0, 0, 0) scale(1);
}

/* Styling for Small-Screen Devices */
@media all and (max-height: 576px) {
    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px;
    }

    .fancybox-slide--image {
        padding: 6px 0;
    }

    .fancybox-close-small {
        right: -6px;
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px;
    }

    .fancybox-caption {
        padding-left: 12px;
        padding-right: 12px;
    }

    @supports (padding: max(0px)) {
        .fancybox-caption {
            padding-left: max(12px, env(safe-area-inset-left));
            padding-right: max(12px, env(safe-area-inset-right));
        }
    }
}

/* Thumbs */

.fancybox-thumbs {
    background: #ddd;
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px 2px;
    position: absolute;
    right: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    top: 0;
    width: 212px;
    z-index: 99995;
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden;
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block;
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px;
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: absolute;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px;
}

.fancybox-thumbs__list a {
    border-radius:  0px;   /* AW */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: rgba(0, 0, 0, .1);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    max-height: calc(100% - 8px);
    max-width: calc(50% - 4px);
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    width: 100px;
}

.fancybox-thumbs__list a::before {
    border: 6px solid #ff5268; 
    border-radius:  20px;      /* AW */
    bottom: 0;
    content: '';
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all .2s cubic-bezier(.25, .46, .45, .94);
    z-index: 99991;
}

.fancybox-thumbs__list a:focus::before {
    opacity: .5;
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
    opacity: 1;
}

/* Styling for Small-Screen Devices */
@media all and (max-width: 576px) {
    .fancybox-thumbs {
        width: 110px;
    }
    .fancybox-show-thumbs .fancybox-inner {
        right: 110px;
    }
    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px);
    }
}

  /* AW Added to get thumbs at bottom, see https://codepen.io/fancyapps/pen/RjRQzm */
  @media all and (min-width: 800px) {
  .fancybox-thumbs {
    top: auto;
    width: auto;
    bottom: 0;
    left: 0;
    right : 0;
    height: 95px;
    padding: 10px 10px 5px 10px;
    box-sizing: border-box;
/* AW Same background as slide for the thumbnails: */
	background-image:url(GrayTextile.jpg);
    background-position:center top;
    background-repeat:repeat;
     background-color: rgba(51,51,51,1.0);
  }

  .fancybox-is-closing { /* AW see https://github.com/fancyapps/fancybox/issues/2068#issuecomment-422323537 */ 
  	opacity: 0;
  }
  
  .fancybox-show-thumbs .fancybox-inner {
    right: 0;
    bottom: 95px;
  }
}

.fancybox-infobar {
  pointer-events: auto; /* for audio control */
}



/* Styles for the templates */
/*
	styles.css - custom styles for the skin's Page templates
	Last change by André Wolff: 2023-04-14
	
*/

/************** Map page */

#map-page {
	margin-top: 20px;
	margin-right: 60px;
	margin-bottom: 20px;
	margin-left: 60px;
}
#map-page .map {
	background-color:#eee;
}

/************** About_album page */

#about_album-page {
	margin-top: 20px;
	margin-right: 60px;
	margin-bottom: 20px;
	margin-left: 60px;
}

#about_album-page .texts {
	overflow:hidden;
}
#about_album-page .texts p {
	line-height:1.5em;
}

/************** About page */

#about-page {
	margin:10px 10%;
}

/************** Music page */

#music-page {
	margin-top: 20px;
	margin-right: 60px;
	margin-bottom: 20px;
	margin-left: 60px;
}
#music-page  .texts {
	overflow:hidden;
}
#music-page  .texts p {
	line-height:1.5em;
}
/************** Contact page */

#contact-page .texts  .left {
	text-align: right;
	width: 49%;
	float: left;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-right: 1%;
}
#contact-page .texts  .right {
	text-align: left;
	width: 50%;
	float: left;
	margin-top: 10px;
	margin-bottom: 10px;
}

#contact-page .texts #address {
	font-weight: bold;	
}
.modalWindow {
    display: none; 
    position: fixed; /* Stay in place */
    overflow-y: auto;
    z-index: 99999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
	font-family: 'Roboto', sans-serif;
	font-size:18px;
}

.modalWindow .roundbutton {
    z-index: 999;
    float: right;
    margin-left: 25px;
    margin-bottom: 15px; 
}

.modalWindow h1 {
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	text-shadow: none;
}

.info-content{
    padding-left: 20px;
    padding-right: 20px;
}
.modal-content {
    margin: 10% auto;
    border: 1px solid  #ffffff;
    position: relative;
    background-color: rgba(51,51,51,1.0);
    color: #ffffff;
    padding: 20px;
    width: 85%;
}

#exifWindow .modal-content  {
    max-width: 420px; 
}
#exifContents {
    text-align: left;
    padding-top: 35px;
}

#settingsDiv .modal-content  {
    width: 90%;
    max-width: 620px; 
}

#settingsDiv #settings select {
    font-size: 24px; /* 17px; for unmodified viewport */
    height: 40px;  /*  24px; for unmodified viewport */
    margin-top: 20px;
    margin-bottom: 20px;
}

#shareWindow  .modal-content  {
    max-width: 360px;
}

.shareImage img {
    border: 4px solid #ffffff;
}



