/*dynamicgallery*/
.dynamicgallery{position: relative}
.dynamicgallery{
	/*display: flex;
    flex-wrap: nowrap;
    align-items: center;*/white-space: nowrap; /*overflow: hidden;*/ position: relative;}
.dynamicgalleryContent{position: relative; white-space: nowrap;  left:0;-webkit-transition: left 1s ease; -moz-transition: left 1s ease; transition: left 1s ease}
.dynamicgallery.alignfull { max-width: none;}
.dynamicgallery .galleryButtons{position: relative; }
.dynamicgallery .gallery{position: relative; overflow: hidden;}
.dynamicgalleryContent .galleryItem {
  display: inline-block;
  width: 100%;
  white-space:normal;
  /*flex-shrink: 0;*/
  vertical-align: top;
}
.dynamicgallery .galleryItem>figure{margin: auto}
.dynamicgallery.top .galleryItem {vertical-align: top;}
.dynamicgallery.middle .galleryItem {vertical-align: middle;}
.dynamicgallery.bottom .galleryItem {vertical-align: bottom;}


.dynamicgallery.equal-image-height .galleryItem>figure{width: 100%;aspect-ratio:1/1}
.dynamicgallery.equal-image-height .galleryItem>figure>img{max-width: 100%; height:100%; width:auto}


.dynamicgallery figcaption {font-size: var(--wp--preset--font-size--small); margin-bottom:0 }

.dynamicgallery.init.hoverbutton>.galleryButtons>.button_l,.dynamicgallery.init.hoverbutton>.galleryButtons>.button_r{opacity: 0;-webkit-transition: opacity 1s ease; -moz-transition: opacity 1s ease; transition: opacity 1s ease}
.dynamicgallery.init.hoverbutton:hover>.galleryButtons>.button_l, .dynamicgallery.init.hoverbutton:hover>.galleryButtons>.button_r{opacity: 1}

.dynamicgallery .quickjumpmenu {margin:0 auto;padding:  var(--padding-v)  var(--padding-h); text-align: center; position: relative; z-index: 55}
.dynamicgallery.quickjjump .quickjumpmenu span {display: inline-block; cursor: pointer; width: 1.2em; height: 1.2em; line-height: 0; background-color: var(--wp--preset--color--background); border: 2px solid var(--wp--preset--color--primary); border-radius: 50%; margin: 0 0.5em;-webkit-transition: all 0.5s ease; -moz-transition:all 0.5s ease; transition:all 0.5s ease}
.dynamicgallery.quickjjump .quickjumpmenu span:hover {background-color: var(--wp--preset--color--primary)}
.dynamicgallery.quickjjump .quickjumpmenu span.on {background-color: var(--wp--preset--color--tertiary)}

/*.dynamicgallery.thumbnails .thumbs {display: flex;}*/
/*.dynamicgallery.thumbnails {margin-bottom: 5rem}*/
.dynamicgallery.thumbnails .galleryItem>figure {padding: 4px}
.dynamicgallery.thumbnails.equal-image-height .galleryItem>figure {width:calc(100% - 4px)}


.dynamicgallery.thumbnails .quickjumpmenu {position: relative; margin-top: 0.5em; width: 100%}
.dynamicgallery.thumbnails .quickjumpmenu span {
  flex-shrink:0; display: flex; vertical-align: middle; cursor: pointer; width: 4rem; /*height: 4rem;*/ line-height: 0; 
  margin: 0; }
.dynamicgallery.thumbnails.equal-thumb-height .quickjumpmenu span {display:inline-block; width: auto; height: 6rem}
.dynamicgallery.thumbnails.equal-thumb-height .quickjumpmenu span img {height: calc(6rem - 8px); }

.dynamicgallery.thumbnails .quickjumpmenu span:hover a {border-color: var(--wp--preset--color--secondary)}
.dynamicgallery.thumbnails .quickjumpmenu span.on a {border-color: var(--wp--preset--color--primary)}
.dynamicgallery.thumbnails .quickjumpmenu a {border: 1.5px solid transparent; padding:2px; margin-right: 4px; display: flex; justify-content:center; align-items:stretch; -webkit-transition: all 0.5s ease; -moz-transition:all 0.5s ease; transition:all 0.5s ease}
.dynamicgallery.thumbnails.bg-light .quickjumpmenu a {background-color: var(--wp--preset--color--quaternary-light)}


.dynamicgallery.thumbnails .quickjumpmenu a img {/*width: 100%; height: 100%;*/ object-fit: contain;}
.dynamicgallery.thumbnails .quickjumpmenu .thumbsContainer {width: 100%; overflow: hidden; white-space: nowrap;}
.dynamicgallery.thumbnails .quickjumpmenu .thumbs{display:flex; --posX:calc(var(--pos,0) * -100%);transform: translate(var(--posX),0); transition: transform 0.75s ease}
.quickjumpmenu .button_l {left: -60px} .quickjumpmenu .button_r {right: -60px}
/*
.dynamicgallery { container-type: inline-size; }
@container (min-width: 400px) {
  .dynamicgallery.thumbnails .quickjumpmenu span {
    width:calc((100% - 40px)/10);
  }
}
*/
.dynamicgallery[data-type="fade"] .galleryItem:not(:first-child) {opacity: 0; visibility:hidden;}
.dynamicgallery.init[data-type="fade"] .galleryItem {
  visibility:hidden;
  opacity:0;
  -webkit-transition:visibility 0s linear 1s, opacity 1s linear;
  -moz-transition:visibility 0s linear 1s, opacity 1s linear;
  transition:visibility 0s linear 1s, opacity 1s linear;
}
.dynamicgallery.init[data-type="fade"] .galleryItem.on {
  visibility:visible;
  opacity:1;
  -webkit-transition-delay:0s;
  -moz-transition-delay:0s;
  transition-delay:0s;
}
.dynamicgallery[data-type="fade"] .galleryItem{margin-left: -100%}
.dynamicgallery[data-type="fade"] .galleryItem:first-child{margin-left: 0}
/* button styles set in theme
.button_l {
	background:url(images/slidearrow_left.svg) center no-repeat;
	position:absolute;
	display:block;
	cursor:pointer;
	top:0;
	left:0;
	height:100%;
	width:80px;
	z-index:50;
}
.button_l:hover {background:url(images/slidearrow_left-act.svg) center no-repeat;}
.button_r {
	background:url(images/slidearrow_right.svg) center no-repeat;
	position:absolute;
	display:block;
	cursor:pointer;
	top:0;
	right:0;
	height:100%;
	width:80px;
	z-index:51;
}
.button_r:hover {background:url(images/slidearrow_right-act.svg) center no-repeat;}*/


.wp-toolbar .dynamicgallery{background-color:rgba(0,0,0,0.2); border: 1px dotted #000}
.wp-toolbar .dynamicgallery>.block-editor-inner-blocks>.block-editor-block-list__layout{counter-reset: dynamiccharts;}
.wp-toolbar .dynamicgallery>.block-editor-inner-blocks>.block-editor-block-list__layout>*:not(.block-list-appender){/*display: block;*/ position: relative; margin:55px auto 15px auto; border: 2px solid #333; padding: 10px}
.wp-toolbar .dynamicgallery>.block-editor-inner-blocks>.block-editor-block-list__layout>*:not(.block-list-appender)::after {
  counter-increment: dynamiccharts;
  content: "Chart: " counter(dynamiccharts);
  font-size: 14px; line-height: 30px; font-weight: normal;
  min-height: 30px;
  position: absolute; display: block;padding:0 15px; background-color:#333; color: #999;
  left:auto; right: 0; top:-30px; bottom: auto; z-index: auto
}