.dunebox-v2 { background: rgba(0, 0, 0, 0.85); }

.dunebox-v2 ::-webkit-scrollbar { width: 10px; height: 5px; background-color: transparent; /* or add it to the track */ border-radius: 5px; }

.dunebox-v2 ::-webkit-scrollbar-track { background: #f1f1f1; }

.dunebox-v2 ::-webkit-scrollbar-thumb { background: #34495e; }

.dunebox-v2 ::-webkit-scrollbar-thumb:hover { background: #4f6f8f; }

.dunebox-v2.duneBox-mobile { width: 100vw; height: 100vh; position: fixed; top: 0; bottom: 0; left: 0; right: 0; }

.dunebox-v2.duneBox-mobile .dunebox-image img { width: 100vw; height: 100vh; -o-object-fit: contain; object-fit: contain; }

.dunebox-v2.duneBox-desktop { width: 100vw; height: 100vh; position: fixed; top: 0; bottom: 0; left: 0; right: 0; }

.dunebox-v2.duneBox-desktop .dunebox-image img { width: 100vw; height: calc(100vh - 80px); -o-object-fit: contain; object-fit: contain; }

.dunebox-v2 .dunebox-controls { position: fixed; top: 0; right: 0; }

.dunebox-v2 .dunebox-controls button { background: transparent; border: none; border-radius: 0; color: #fff; cursor: pointer; outline: none; transition: all ease 0.3s; padding: 9px; }

.dunebox-v2 .dunebox-controls button:hover { color: #bfbfbf; }

.dunebox-v2 .dunebox-title { position: absolute; left: 50%; right: 50%; bottom: 10%; transform: translate(-50%, -50%); width: 50%; height: 10%; background: rgba(0, 0, 0, 0.5); color: white; }

.dunebox-v2 .dunebox-content { width: 100%; height: calc(100% - 80px); display: flex; align-items: center; }

.dunebox-v2 .dunebox-content .dunebox-image { max-height: 100%; margin: auto; }

.dunebox-v2 .dunebox-content .dunebox-image img { max-width: 100%; max-height: 100%; }

.dunebox-v2 [data-dunebox-gallery-controls] { display: flex; flex-direction: row; justify-content: center; position: fixed; left: 0; right: 0; bottom: 0; background: #fff; height: 80px; }

.dunebox-v2 [data-dunebox-gallery-controls].isMinified { background: transparent; height: 50px; justify-content: space-between; }

.dunebox-v2 [data-dunebox-gallery-controls].isMinified div[data-dunebox-gallery-miniatures] { display: none; }

.dunebox-v2 [data-dunebox-gallery-controls].isMinified[data-dunebox-gallery-controls-left], .dunebox-v2 [data-dunebox-gallery-controls].isMinified[data-dunebox-gallery-controls-right] { width: 32px; margin: 9px; }

.dunebox-v2 [data-dunebox-gallery-controls].isMinified button { background: #fff; color: #000; border-radius: 3px; width: 32px; font-size: 11px; height: 32px; line-height: 32px; }

.dunebox-v2 [data-dunebox-gallery-controls].isMinified button:hover { background: #bfbfbf; color: #000; }

.dunebox-v2 [data-dunebox-gallery-controls] > div { display: flex; justify-content: center; align-self: center; width: 80%; }

.dunebox-v2 [data-dunebox-gallery-controls] > div[data-dunebox-gallery-controls-left], .dunebox-v2 [data-dunebox-gallery-controls] > div[data-dunebox-gallery-controls-right] { width: 10%; }

.dunebox-v2 [data-dunebox-gallery-controls] > div button { background: transparent; border: none; padding: 0.5rem; color: #34495e; cursor: pointer; outline: none; transition: all ease 0.3s; font-size: 12px; width: 40px; height: 40px; line-height: 40px; border-radius: 3px; }

.dunebox-v2 [data-dunebox-gallery-controls] > div button:hover { background: #34495e; color: #fff; }

.dunebox-v2 [data-dunebox-gallery-controls] [data-dunebox-gallery-miniatures] [data-dunebox-gallery-miniatures-content] { display: flex; flex-direction: row; justify-content: flex-start; overflow: hidden; overflow-x: auto; flex-wrap: nowrap; background: #fff; width: 100%; }

.dunebox-v2 [data-dunebox-gallery-controls] [data-dunebox-gallery-miniatures] [data-dunebox-gallery-miniatures-content] div { -o-object-fit: contain; object-fit: contain; margin: 0.5rem; padding: 0.5rem; border: 4px solid transparent; transition: all ease 0.3s; align-self: center; flex: 0 0 auto; }

.dunebox-v2 [data-dunebox-gallery-controls] [data-dunebox-gallery-miniatures] [data-dunebox-gallery-miniatures-content] div img { height: 50px; -o-object-fit: contain; object-fit: contain; }

.dunebox-v2 [data-dunebox-gallery-controls] [data-dunebox-gallery-miniatures] [data-dunebox-gallery-miniatures-content] div.active { border: 4px solid #34495e; }

.dunebox-v2 [data-dunebox-gallery-controls] [data-dunebox-gallery-miniatures] [data-dunebox-gallery-miniatures-content] div:hover { background: #34495e; cursor: pointer; }