/*
	venobox.css
	Last modified - 03 Apr 2026
*/
.vbox-overlay *,
.vbox-overlay *:before,
.vbox-overlay *:after {
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}

.vbox-overlay * {
   -webkit-backface-visibility: visible;
   backface-visibility: visible;
}

.vbox-overlay {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-justify-content: center;
   justify-content: center;
   -webkit-align-items: center;
   align-items: center;
   position: fixed;
   left: 0;
   top: 0;
   bottom: 0;
   right: 0;
   z-index: 999999;
}

.vbox-title {
   width: 100%;
   height: 40px;
   float: left;
   text-align: center;
   line-height: 28px;
   font-size: 12px;
   padding: 6px 50px;
   overflow: hidden;
   position: fixed;
   display: none;
   left: 0;
   z-index: 89;
}

.vbox-close {
   cursor: pointer;
   position: fixed;
   top: 10px;
   right: 10px;
   width: 48px;
   height: 48px;
   padding: 4px;
   display: block;
   background-position: 10px center;
   overflow: hidden;
   font-size: 34px;
   line-height: 34px;
   text-align: center;
   z-index: 99;
   border-radius: 100%;
   border: #b6b6b6 solid 1px;
}
.vbox-close:hover {
   background-color: white !important;
   color: black !important;
   border-color: white;
}

.vbox-left {
   cursor: pointer;
   position: fixed;
   left: 0;
   height: 40px;
   overflow: hidden;
   line-height: 28px;
   font-size: 12px;
   z-index: 99;
   display: flex;
   align-items: center;
}

.vbox-num {
   display: inline-block;
   margin: 6px 0 6px 15px;
}

.vbox-share {
   display: none !important;
}

.vbox-next,
.vbox-prev {
   position: fixed;
   top: 50%;
   margin-top: -15px;
   overflow: hidden;
   cursor: pointer;
   display: block;
   width: 45px;
   height: 45px;
   z-index: 99;
}

.vbox-next span,
.vbox-prev span {
   width: 20px;
   height: 20px;
   border: 2px solid transparent;
   border-top-color: #b6b6b6;
   border-right-color: #b6b6b6;
   text-indent: -100px;
   position: absolute;
   top: 8px;
   display: block;
}

.vbox-prev {
   left: 15px;
}

.vbox-next {
   right: 15px;
}

.vbox-prev span {
   left: 10px;
   -ms-transform: rotate(-135deg);
   -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
}

.vbox-next span {
   -ms-transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
   right: 10px;
}

.vbox-inline {
   width: 420px;
   height: 315px;
   height: 70vh;
   padding: 10px;
   background: transparent !important;
   margin: 0 auto;
   overflow: auto;
   text-align: left;
}
.vbox-inline,
.content__modal__body {
   scrollbar-width: thin;
   scrollbar-color: #888 #f1f1f1;
   scrollbar-gutter: stable;
   scroll-behavior: smooth;
}
/* WebKit browsers (Chrome, Safari, Edge) */
.vbox-inline::-webkit-scrollbar,
.content__modal__body::-webkit-scrollbar {
   width: 10px; /* Width of the vertical scrollbar */
   height: 10px; /* Height of the horizontal scrollbar */
   border-radius: 5px;
}

.vbox-inline::-webkit-scrollbar-track,
.content__modal__body::-webkit-scrollbar-track {
   background: #f1f1f1;
   border-radius: 5px;
}

.vbox-inline::-webkit-scrollbar-thumb,
.content__modal__body::-webkit-scrollbar-thumb {
   background: #888;
   border-radius: 5px;
}

.vbox-inline::-webkit-scrollbar-thumb:hover,
.content__modal__body::-webkit-scrollbar-thumb:hover {
   background: #555; /* Darken on hover */
}

.venoframe {
   max-width: 100%;
   width: 100%;
   border: none;
   height: 260px;
   height: 70vh;
}

.venoframe.vbvid {
   height: 260px;
}

@media (min-width: 768px) {
   .venoframe,
   .vbox-inline {
      width: 90%;
      height: 360px;
      height: 70vh;
   }

   .venoframe.vbvid {
      width: 640px;
      height: 360px;
   }
}

@media (min-width: 992px) {
   .venoframe,
   .vbox-inline {
      max-width: 1200px !important;
      width: 80%;
      height: 540px;
      height: 70vh;
   }

   .venoframe.vbvid {
      width: 960px;
      height: 540px;
   }
}

.vbox-open {
   overflow: hidden !important;
}

.vbox-container {
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   overflow-x: hidden;
   overflow-scrolling: touch;
   -webkit-overflow-scrolling: touch;
   z-index: 20;
   max-height: 100%;
}

.vbox-content {
   text-align: center;
   float: left;
   width: 100%;
   position: relative;
   overflow: hidden;
   padding: 20px 4%;
}

.vbox-container img {
   max-width: 100%;
   height: auto;
   display: inline-block;
}

.vbox-figlio {
   /* box-shadow: 0 0 12px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); */
   max-width: 100%;
   text-align: initial;
}

img.vbox-figlio {
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -o-user-select: none;
   user-select: none;
}

.vbox-content.swipe-left {
   margin-left: -200px !important;
}

.vbox-content.swipe-right {
   margin-left: 200px !important;
}

.vbox-animated {
   -webkit-transition: margin 300ms ease-out;
   transition: margin 300ms ease-out;
}

.sk-double-bounce,
.sk-rotating-plane {
   width: 40px;
   height: 40px;
   margin: 40px auto;
}

.sk-rotating-plane {
   background-color: #333;
   -webkit-animation: sk-rotatePlane 1.2s infinite ease-in-out;
   animation: sk-rotatePlane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotatePlane {
   0% {
      -webkit-transform: perspective(120px) rotateX(0) rotateY(0);
      transform: perspective(120px) rotateX(0) rotateY(0);
   }

   50% {
      -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0);
      transform: perspective(120px) rotateX(-180.1deg) rotateY(0);
   }

   100% {
      -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
      transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
   }
}

@keyframes sk-rotatePlane {
   0% {
      -webkit-transform: perspective(120px) rotateX(0) rotateY(0);
      transform: perspective(120px) rotateX(0) rotateY(0);
   }

   50% {
      -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0);
      transform: perspective(120px) rotateX(-180.1deg) rotateY(0);
   }

   100% {
      -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
      transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
   }
}

.sk-double-bounce {
   position: relative;
}

.sk-double-bounce .sk-child {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   background-color: #333;
   opacity: 0.6;
   position: absolute;
   top: 0;
   left: 0;
   -webkit-animation: sk-doubleBounce 2s infinite ease-in-out;
   animation: sk-doubleBounce 2s infinite ease-in-out;
}

.sk-chasing-dots .sk-child,
.sk-spinner-pulse,
.sk-three-bounce .sk-child {
   background-color: #333;
   border-radius: 100%;
}

.sk-double-bounce .sk-double-bounce2 {
   -webkit-animation-delay: -1s;
   animation-delay: -1s;
}

@-webkit-keyframes sk-doubleBounce {
   0%,
   100% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   50% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

@keyframes sk-doubleBounce {
   0%,
   100% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   50% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

.sk-wave {
   margin: 40px auto;
   width: 50px;
   height: 40px;
   text-align: center;
   font-size: 10px;
}

.sk-wave .sk-rect {
   background-color: #333;
   height: 100%;
   width: 6px;
   display: inline-block;
   -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
   animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
}

.sk-wave .sk-rect1 {
   -webkit-animation-delay: -1.2s;
   animation-delay: -1.2s;
}

.sk-wave .sk-rect2 {
   -webkit-animation-delay: -1.1s;
   animation-delay: -1.1s;
}

.sk-wave .sk-rect3 {
   -webkit-animation-delay: -1s;
   animation-delay: -1s;
}

.sk-wave .sk-rect4 {
   -webkit-animation-delay: -0.9s;
   animation-delay: -0.9s;
}

.sk-wave .sk-rect5 {
   -webkit-animation-delay: -0.8s;
   animation-delay: -0.8s;
}

@-webkit-keyframes sk-waveStretchDelay {
   0%,
   100%,
   40% {
      -webkit-transform: scaleY(0.4);
      transform: scaleY(0.4);
   }

   20% {
      -webkit-transform: scaleY(1);
      transform: scaleY(1);
   }
}

@keyframes sk-waveStretchDelay {
   0%,
   100%,
   40% {
      -webkit-transform: scaleY(0.4);
      transform: scaleY(0.4);
   }

   20% {
      -webkit-transform: scaleY(1);
      transform: scaleY(1);
   }
}

.sk-wandering-cubes {
   margin: 40px auto;
   width: 40px;
   height: 40px;
   position: relative;
}

.sk-wandering-cubes .sk-cube {
   background-color: #333;
   width: 10px;
   height: 10px;
   position: absolute;
   top: 0;
   left: 0;
   -webkit-animation: sk-wanderingCube 1.8s ease-in-out -1.8s infinite both;
   animation: sk-wanderingCube 1.8s ease-in-out -1.8s infinite both;
}

.sk-chasing-dots,
.sk-spinner-pulse {
   width: 40px;
   height: 40px;
   margin: 40px auto;
}

.sk-wandering-cubes .sk-cube2 {
   -webkit-animation-delay: -0.9s;
   animation-delay: -0.9s;
}

@-webkit-keyframes sk-wanderingCube {
   0% {
      -webkit-transform: rotate(0);
      transform: rotate(0);
   }

   25% {
      -webkit-transform: translateX(30px) rotate(-90deg) scale(0.5);
      transform: translateX(30px) rotate(-90deg) scale(0.5);
   }

   50% {
      -webkit-transform: translateX(30px) translateY(30px) rotate(-179deg);
      transform: translateX(30px) translateY(30px) rotate(-179deg);
   }

   50.1% {
      -webkit-transform: translateX(30px) translateY(30px) rotate(-180deg);
      transform: translateX(30px) translateY(30px) rotate(-180deg);
   }

   75% {
      -webkit-transform: translateX(0) translateY(30px) rotate(-270deg)
         scale(0.5);
      transform: translateX(0) translateY(30px) rotate(-270deg) scale(0.5);
   }

   100% {
      -webkit-transform: rotate(-360deg);
      transform: rotate(-360deg);
   }
}

@keyframes sk-wanderingCube {
   0% {
      -webkit-transform: rotate(0);
      transform: rotate(0);
   }

   25% {
      -webkit-transform: translateX(30px) rotate(-90deg) scale(0.5);
      transform: translateX(30px) rotate(-90deg) scale(0.5);
   }

   50% {
      -webkit-transform: translateX(30px) translateY(30px) rotate(-179deg);
      transform: translateX(30px) translateY(30px) rotate(-179deg);
   }

   50.1% {
      -webkit-transform: translateX(30px) translateY(30px) rotate(-180deg);
      transform: translateX(30px) translateY(30px) rotate(-180deg);
   }

   75% {
      -webkit-transform: translateX(0) translateY(30px) rotate(-270deg)
         scale(0.5);
      transform: translateX(0) translateY(30px) rotate(-270deg) scale(0.5);
   }

   100% {
      -webkit-transform: rotate(-360deg);
      transform: rotate(-360deg);
   }
}

.sk-spinner-pulse {
   -webkit-animation: sk-pulseScaleOut 1s infinite ease-in-out;
   animation: sk-pulseScaleOut 1s infinite ease-in-out;
}

@-webkit-keyframes sk-pulseScaleOut {
   0% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 0;
   }
}

@keyframes sk-pulseScaleOut {
   0% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 0;
   }
}

.sk-chasing-dots {
   position: relative;
   text-align: center;
   -webkit-animation: sk-chasingDotsRotate 2s infinite linear;
   animation: sk-chasingDotsRotate 2s infinite linear;
}

.sk-chasing-dots .sk-child {
   width: 60%;
   height: 60%;
   display: inline-block;
   position: absolute;
   top: 0;
   -webkit-animation: sk-chasingDotsBounce 2s infinite ease-in-out;
   animation: sk-chasingDotsBounce 2s infinite ease-in-out;
}

.sk-chasing-dots .sk-dot2 {
   top: auto;
   bottom: 0;
   -webkit-animation-delay: -1s;
   animation-delay: -1s;
}

@-webkit-keyframes sk-chasingDotsRotate {
   100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}

@keyframes sk-chasingDotsRotate {
   100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}

@-webkit-keyframes sk-chasingDotsBounce {
   0%,
   100% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   50% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

@keyframes sk-chasingDotsBounce {
   0%,
   100% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   50% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

.sk-three-bounce {
   margin: 40px auto;
   width: 80px;
   text-align: center;
}

.sk-three-bounce .sk-child {
   width: 20px;
   height: 20px;
   display: inline-block;
   -webkit-animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
   animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
}

.sk-circle .sk-child:before,
.sk-fading-circle .sk-circle:before {
   display: block;
   border-radius: 100%;
   content: "";
   background-color: #333;
}

.sk-three-bounce .sk-bounce1 {
   -webkit-animation-delay: -0.32s;
   animation-delay: -0.32s;
}

.sk-three-bounce .sk-bounce2 {
   -webkit-animation-delay: -0.16s;
   animation-delay: -0.16s;
}

@-webkit-keyframes sk-three-bounce {
   0%,
   100%,
   80% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   40% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

@keyframes sk-three-bounce {
   0%,
   100%,
   80% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   40% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

.sk-circle {
   margin: 40px auto;
   width: 40px;
   height: 40px;
   position: relative;
}

.sk-circle .sk-child {
   width: 100%;
   height: 100%;
   position: absolute;
   left: 0;
   top: 0;
}

.sk-circle .sk-child:before {
   margin: 0 auto;
   width: 15%;
   height: 15%;
   -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
   animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
}

.sk-circle .sk-circle2 {
   -webkit-transform: rotate(30deg);
   -ms-transform: rotate(30deg);
   transform: rotate(30deg);
}

.sk-circle .sk-circle3 {
   -webkit-transform: rotate(60deg);
   -ms-transform: rotate(60deg);
   transform: rotate(60deg);
}

.sk-circle .sk-circle4 {
   -webkit-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   transform: rotate(90deg);
}

.sk-circle .sk-circle5 {
   -webkit-transform: rotate(120deg);
   -ms-transform: rotate(120deg);
   transform: rotate(120deg);
}

.sk-circle .sk-circle6 {
   -webkit-transform: rotate(150deg);
   -ms-transform: rotate(150deg);
   transform: rotate(150deg);
}

.sk-circle .sk-circle7 {
   -webkit-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   transform: rotate(180deg);
}

.sk-circle .sk-circle8 {
   -webkit-transform: rotate(210deg);
   -ms-transform: rotate(210deg);
   transform: rotate(210deg);
}

.sk-circle .sk-circle9 {
   -webkit-transform: rotate(240deg);
   -ms-transform: rotate(240deg);
   transform: rotate(240deg);
}

.sk-circle .sk-circle10 {
   -webkit-transform: rotate(270deg);
   -ms-transform: rotate(270deg);
   transform: rotate(270deg);
}

.sk-circle .sk-circle11 {
   -webkit-transform: rotate(300deg);
   -ms-transform: rotate(300deg);
   transform: rotate(300deg);
}

.sk-circle .sk-circle12 {
   -webkit-transform: rotate(330deg);
   -ms-transform: rotate(330deg);
   transform: rotate(330deg);
}

.sk-circle .sk-circle2:before {
   -webkit-animation-delay: -1.1s;
   animation-delay: -1.1s;
}

.sk-circle .sk-circle3:before {
   -webkit-animation-delay: -1s;
   animation-delay: -1s;
}

.sk-circle .sk-circle4:before {
   -webkit-animation-delay: -0.9s;
   animation-delay: -0.9s;
}

.sk-circle .sk-circle5:before {
   -webkit-animation-delay: -0.8s;
   animation-delay: -0.8s;
}

.sk-circle .sk-circle6:before {
   -webkit-animation-delay: -0.7s;
   animation-delay: -0.7s;
}

.sk-circle .sk-circle7:before {
   -webkit-animation-delay: -0.6s;
   animation-delay: -0.6s;
}

.sk-circle .sk-circle8:before {
   -webkit-animation-delay: -0.5s;
   animation-delay: -0.5s;
}

.sk-circle .sk-circle9:before {
   -webkit-animation-delay: -0.4s;
   animation-delay: -0.4s;
}

.sk-circle .sk-circle10:before {
   -webkit-animation-delay: -0.3s;
   animation-delay: -0.3s;
}

.sk-circle .sk-circle11:before {
   -webkit-animation-delay: -0.2s;
   animation-delay: -0.2s;
}

.sk-circle .sk-circle12:before {
   -webkit-animation-delay: -0.1s;
   animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleBounceDelay {
   0%,
   100%,
   80% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   40% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

@keyframes sk-circleBounceDelay {
   0%,
   100%,
   80% {
      -webkit-transform: scale(0);
      transform: scale(0);
   }

   40% {
      -webkit-transform: scale(1);
      transform: scale(1);
   }
}

.sk-cube-grid {
   width: 40px;
   height: 40px;
   margin: 40px auto;
}

.sk-cube-grid .sk-cube {
   width: 33.33%;
   height: 33.33%;
   background-color: #333;
   float: left;
   -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
   animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}

.sk-cube-grid .sk-cube1 {
   -webkit-animation-delay: 0.2s;
   animation-delay: 0.2s;
}

.sk-cube-grid .sk-cube2 {
   -webkit-animation-delay: 0.3s;
   animation-delay: 0.3s;
}

.sk-cube-grid .sk-cube3 {
   -webkit-animation-delay: 0.4s;
   animation-delay: 0.4s;
}

.sk-cube-grid .sk-cube4 {
   -webkit-animation-delay: 0.1s;
   animation-delay: 0.1s;
}

.sk-cube-grid .sk-cube5 {
   -webkit-animation-delay: 0.2s;
   animation-delay: 0.2s;
}

.sk-cube-grid .sk-cube6 {
   -webkit-animation-delay: 0.3s;
   animation-delay: 0.3s;
}

.sk-cube-grid .sk-cube7 {
   -webkit-animation-delay: 0ms;
   animation-delay: 0ms;
}

.sk-cube-grid .sk-cube8 {
   -webkit-animation-delay: 0.1s;
   animation-delay: 0.1s;
}

.sk-cube-grid .sk-cube9 {
   -webkit-animation-delay: 0.2s;
   animation-delay: 0.2s;
}

@-webkit-keyframes sk-cubeGridScaleDelay {
   0%,
   100%,
   70% {
      -webkit-transform: scale3D(1, 1, 1);
      transform: scale3D(1, 1, 1);
   }

   35% {
      -webkit-transform: scale3D(0, 0, 1);
      transform: scale3D(0, 0, 1);
   }
}

@keyframes sk-cubeGridScaleDelay {
   0%,
   100%,
   70% {
      -webkit-transform: scale3D(1, 1, 1);
      transform: scale3D(1, 1, 1);
   }

   35% {
      -webkit-transform: scale3D(0, 0, 1);
      transform: scale3D(0, 0, 1);
   }
}

.sk-fading-circle {
   margin: 40px auto;
   width: 40px;
   height: 40px;
   position: relative;
}

.sk-fading-circle .sk-circle {
   width: 100%;
   height: 100%;
   position: absolute;
   left: 0;
   top: 0;
}

.sk-fading-circle .sk-circle:before {
   margin: 0 auto;
   width: 15%;
   height: 15%;
   -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
   animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}

.sk-fading-circle .sk-circle2 {
   -webkit-transform: rotate(30deg);
   -ms-transform: rotate(30deg);
   transform: rotate(30deg);
}

.sk-fading-circle .sk-circle3 {
   -webkit-transform: rotate(60deg);
   -ms-transform: rotate(60deg);
   transform: rotate(60deg);
}

.sk-fading-circle .sk-circle4 {
   -webkit-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   transform: rotate(90deg);
}

.sk-fading-circle .sk-circle5 {
   -webkit-transform: rotate(120deg);
   -ms-transform: rotate(120deg);
   transform: rotate(120deg);
}

.sk-fading-circle .sk-circle6 {
   -webkit-transform: rotate(150deg);
   -ms-transform: rotate(150deg);
   transform: rotate(150deg);
}

.sk-fading-circle .sk-circle7 {
   -webkit-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   transform: rotate(180deg);
}

.sk-fading-circle .sk-circle8 {
   -webkit-transform: rotate(210deg);
   -ms-transform: rotate(210deg);
   transform: rotate(210deg);
}

.sk-fading-circle .sk-circle9 {
   -webkit-transform: rotate(240deg);
   -ms-transform: rotate(240deg);
   transform: rotate(240deg);
}

.sk-fading-circle .sk-circle10 {
   -webkit-transform: rotate(270deg);
   -ms-transform: rotate(270deg);
   transform: rotate(270deg);
}

.sk-fading-circle .sk-circle11 {
   -webkit-transform: rotate(300deg);
   -ms-transform: rotate(300deg);
   transform: rotate(300deg);
}

.sk-fading-circle .sk-circle12 {
   -webkit-transform: rotate(330deg);
   -ms-transform: rotate(330deg);
   transform: rotate(330deg);
}

.sk-fading-circle .sk-circle2:before {
   -webkit-animation-delay: -1.1s;
   animation-delay: -1.1s;
}

.sk-fading-circle .sk-circle3:before {
   -webkit-animation-delay: -1s;
   animation-delay: -1s;
}

.sk-fading-circle .sk-circle4:before {
   -webkit-animation-delay: -0.9s;
   animation-delay: -0.9s;
}

.sk-fading-circle .sk-circle5:before {
   -webkit-animation-delay: -0.8s;
   animation-delay: -0.8s;
}

.sk-fading-circle .sk-circle6:before {
   -webkit-animation-delay: -0.7s;
   animation-delay: -0.7s;
}

.sk-fading-circle .sk-circle7:before {
   -webkit-animation-delay: -0.6s;
   animation-delay: -0.6s;
}

.sk-fading-circle .sk-circle8:before {
   -webkit-animation-delay: -0.5s;
   animation-delay: -0.5s;
}

.sk-fading-circle .sk-circle9:before {
   -webkit-animation-delay: -0.4s;
   animation-delay: -0.4s;
}

.sk-fading-circle .sk-circle10:before {
   -webkit-animation-delay: -0.3s;
   animation-delay: -0.3s;
}

.sk-fading-circle .sk-circle11:before {
   -webkit-animation-delay: -0.2s;
   animation-delay: -0.2s;
}

.sk-fading-circle .sk-circle12:before {
   -webkit-animation-delay: -0.1s;
   animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
   0%,
   100%,
   39% {
      opacity: 0;
   }

   40% {
      opacity: 1;
   }
}

@keyframes sk-circleFadeDelay {
   0%,
   100%,
   39% {
      opacity: 0;
   }

   40% {
      opacity: 1;
   }
}

.sk-folding-cube {
   margin: 40px auto;
   width: 40px;
   height: 40px;
   position: relative;
   -webkit-transform: rotateZ(45deg);
   transform: rotateZ(45deg);
}

.sk-folding-cube .sk-cube {
   float: left;
   width: 50%;
   height: 50%;
   position: relative;
   -webkit-transform: scale(1.1);
   -ms-transform: scale(1.1);
   transform: scale(1.1);
}

.sk-folding-cube .sk-cube:before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #333;
   -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
   animation: sk-foldCubeAngle 2.4s infinite linear both;
   -webkit-transform-origin: 100% 100%;
   -ms-transform-origin: 100% 100%;
   transform-origin: 100% 100%;
}

.sk-folding-cube .sk-cube2 {
   -webkit-transform: scale(1.1) rotateZ(90deg);
   transform: scale(1.1) rotateZ(90deg);
}

.sk-folding-cube .sk-cube3 {
   -webkit-transform: scale(1.1) rotateZ(180deg);
   transform: scale(1.1) rotateZ(180deg);
}

.sk-folding-cube .sk-cube4 {
   -webkit-transform: scale(1.1) rotateZ(270deg);
   transform: scale(1.1) rotateZ(270deg);
}

.sk-folding-cube .sk-cube2:before {
   -webkit-animation-delay: 0.3s;
   animation-delay: 0.3s;
}

.sk-folding-cube .sk-cube3:before {
   -webkit-animation-delay: 0.6s;
   animation-delay: 0.6s;
}

.sk-folding-cube .sk-cube4:before {
   -webkit-animation-delay: 0.9s;
   animation-delay: 0.9s;
}

@-webkit-keyframes sk-foldCubeAngle {
   0%,
   10% {
      -webkit-transform: perspective(140px) rotateX(-180deg);
      transform: perspective(140px) rotateX(-180deg);
      opacity: 0;
   }

   25%,
   75% {
      -webkit-transform: perspective(140px) rotateX(0);
      transform: perspective(140px) rotateX(0);
      opacity: 1;
   }

   100%,
   90% {
      -webkit-transform: perspective(140px) rotateY(180deg);
      transform: perspective(140px) rotateY(180deg);
      opacity: 0;
   }
}

@keyframes sk-foldCubeAngle {
   0%,
   10% {
      -webkit-transform: perspective(140px) rotateX(-180deg);
      transform: perspective(140px) rotateX(-180deg);
      opacity: 0;
   }

   25%,
   75% {
      -webkit-transform: perspective(140px) rotateX(0);
      transform: perspective(140px) rotateX(0);
      opacity: 1;
   }

   100%,
   90% {
      -webkit-transform: perspective(140px) rotateY(180deg);
      transform: perspective(140px) rotateY(180deg);
      opacity: 0;
   }
}

.gallery__list {
   padding-block-start: 40px;
   --card-col-gap: 20px;
   --card-row-gap: 20px;
}

.gallery-thumb {
   position: relative;
   overflow: hidden;
}

.gallery-thumb,
.gallery-thumb img,
.gallery-thumb::before {
   border-radius: 10px;
}

.gallery-thumb::before {
   position: absolute;
   z-index: 1;
   pointer-events: none;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.4);
   content: "";
   background-position: center;
   background-repeat: no-repeat;
   background-size: 40px;
   opacity: 0;
   visibility: hidden;
   transition: all ease-in-out 200ms;
}

.gallery-thumb.video--gallery::before {
   opacity: 1;
   visibility: visible;
   background-color: rgba(0, 0, 0, 0.3);
}

@media (hover: hover) and (pointer: fine) {
   .gallery-thumb::before {
      background-color: rgba(0, 0, 0, 0.6);
   }

   .gallery-thumb:hover::before {
      opacity: 1;
      visibility: visible;
   }

   .gallery-thumb.video--gallery:hover::before {
      background-color: rgba(0, 0, 0, 0.5);
   }
}

.gallery-thumb.image--gallery::before {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADkAAAA5CAYAAACMGIOFAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAN0SURBVHgB7Vr9ddowED/68n+zQZQJygbV6wLJBvUGsAF0gtIJcCegWaBxJghdoHYngExwlaK7WlYJyLaEBcnvvXsHz/r6+T70ZYBXgBEEACJeKjVWcqvkin6LHUXXSrZKHpQUo9GogNShyEklSyUb7IYN1ZcQEZ0sSYOaKZHOo0pJAcZiT/Sfoa19RXUEGGu7defKut9hSChyYyX3jjX0/wm5bJu2hJJMyaPT3ko/gyFARFxyEgKA3N59eVM4FrSFKG4YJUaKIbJsafX1FWKDCD46rtTKLTv0qd04dzwmTp87CM7hiND92UQhBrSrDEXQGsM8muuqBmdDE7TGMg+ejCgmGEtIAJQLNPTiQUBfWNmtxKHmKweUH8og8YkmhTM+Q0JAM5cyJHRFsLdVtycopgQEANYLhm7jC/ammm0uQsZ21zG+s35npNcBt0BBJ3EaV0F/b33r2SRvSC8gbdyR9s4ZzyTJ9PzWHyBt5KQvfV2WLcmFtatWkDDU+PTJQkV/xz51mORH0n/gNMDe9sGnMJNkVy3gNLAm3cqSXLiE08CWtFf2vnD+P4EnaIKfHSjGYSAPzJW630WLfMDlhE/hC+iODOq59RCER1ltnTlEQB+SORh3eb+njARDsILD8Z5DTGB9bppBQGB9jBF0y6bau+Wdkk95TjytAjkBCNKVT2EmySnZa95JAJzQvBIlk+RFgITTgCBd+BRmkj+4MkY+cuwLmrp4Xl/71LHdleMyg7QhSVe+W8JnkrTo5S3MDaSNCenCt4K9n8xJSwx/DeC9ktoHGhe76jfogt5nKP+3l9YZDzUS/JwnFJyTRAl9YL2tMpVMSx5RBls9UYO8zFtBArCWh2Uo19eNTi3XOLSdigps3suEPfDG+sx0MKJ4jIsnbF5xH5WoQxAx1r0MmouWldXREiNfAu3oc2PHoxKIAsd1S4x0GYRmCiutvhbYzKxaX8ckOsXmR0n3GO/rD91PZj0/KlH3o4V/lm3rxuSWE9z9XZB4oe/fXYh2/SIrA3MXIZ1HejdTgVk86z3q1nomwJwHjaE++7Gh63zZt7Mg8j+VXFM/n5SUqg5EA7lZjs04agPtljruZIs+W1s02CuggerjE60Fib0srMBYdk3yq+sV4SAWHQLYI0ZPCm9Ezw1vRM8Nr5oonCNcomc2e9awFgx3fwE/VnXnEgYkvgAAAABJRU5ErkJggg==");
}

.gallery-thumb.video--gallery::before {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAYAAACohjseAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANtSURBVHgB1ZuPVdswEMa/5HUA2MAwQAssQMoCpV2g6QSlHaBAByiwQKELtEzQhAVKWIBkgiZdIOp90SkY5++LJVn+vXdx/ji2v9xZupOUBjxjjNmSzZ7YK93S+F5W2HWgNhLrij00Go0uUoSixI7FOmJDszn87i+x90gBFXZqyolaRF/sQixDbAILKzLWc20hBsaGYt/E59GEDF1jvXZhqucbfCMHzcTuTTrQm9k6195YR5xsOpht5qumL3YkXctg2U5LBSYszrFS5EKBNRDnWCpyrkBjm+R7pC/OwWulyFHxg+aCL5yiPuLIvtiXeR/MeFC815bNNeqHgfViN//mM4E1uu8WwfvxIB+qxRBlppChvuyIneTfmHpQvddH/RmK7Tov5j14Br9cwf6iH2Drvlhso+DFCcZvAn1bODZTvRsTj79Gq4+mXkAbfu+9Xv4FO2GxNuJ5040qTEP0DSIgIm9k81rsB8LCtuUjnziBLURCU6q22CfY8ZhQHPKhKeHZgnVpNEQkN5diBwgXsqxfW/TgHiqAIsXYLbGlPUcY9ijwEBWi3jwT24Vfb/LALykwanjOI6A3Jx7MkAg5bx7Bjze3khJIVCQTforsoRxZEwmiIhmyn1GSJAX6JEmB0n9xw6S59BgoBQ6QECqO6dwflO+jBxQYMl1aGwrTCuBC7Df8NH4TgQ+oGPUaB444OnYCf/yjwLJNcSlUHEUxJDP4gwe+e4GKBKowZi7fEa6a6TV1mC3qfajiWK/Ray2EYURtrpuI4kVtSDLYTIXlUsg8+I4PTuAVAqLCmJ68hW1IWggLQ+Q2fwEsDn1OR3dUlLNtE3fy9NFpm3hQxxB9erEFWxWw6Xedts/mfxVd9yQ/8Mv7gQlu5fVhSRieu246bZqLBvBiVXzNzxUWJ1/oPYbTDurJzGTos2pCvVi6BqsIhuZ5caZ3plySHdi8XqJ+XMm1zwwoL5vCZka/j3owMy/omFvw6o7vUI/pNHffzU0311lGQk+m2uhsvozEkbDItRYCrRyT0QMcIa1wdctGBvCFeVqMNzbVwmsIl23JwdvGLoaLDc95jBgYOyV9ZuJ4c6jnip8jq9Br/XV9i61O2DyMDd2fxi4AGJvNBLtF6ce+hK3sJjbB2Flj/q2Ac4/uLwVZ4ZwD2LGgnlqQvxX8BzKJY1/gAW/SAAAAAElFTkSuQmCC");
}

@media (max-width: 640px) {
   .gallery__list {
      padding-block-start: 20px;
      --card-col-gap: 10px;
      --card-row-gap: 10px;
   }

   .gallery-thumb,
   .gallery-thumb img,
   .gallery-thumb::before {
      border-radius: 5px;
   }

   .gallery-thumb::before {
      background-size: 30px;
   }

   .vbox-container {
      display: flex;
      align-items: center;
   }

   .vbox-content {
      padding: 0;
      margin: 0 !important;
   }

   .vbox-inline {
      height: 100dvh;
   }
}
