.lds-ring{display:inline-block;position:relative;width:80px;height:80px;margin:20% auto}.lds-ring div{box-sizing:border-box;display:block;position:absolute;width:64px;height:64px;margin:8px;border-radius:50%;animation:lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;border:6px solid #0000;border-top-color:#ba8a4d}.lds-ring div div:first-child{animation-delay:-.45s;opacity:.8}.lds-ring div div:nth-child(2){animation-delay:-.3s;opacity:.5}.lds-ring div div:nth-child(3){animation-delay:-.15s;opacity:.3}@keyframes lds-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,400&display=swap";.preview-container{position:absolute;width:100%;left:0;top:0}.preview-container h2{font-family:Roboto,Arial;font-weight:400;font-size:1em;position:relative;z-index:2;padding:20px 0;background-color:#ba8a4d;color:#fff;border-radius:6px;margin:0}.preview-container .preview-controll{position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background-color:#ffffff80;opacity:0;transition:all 1s ease}.preview-container .preview-controll .controllers{position:absolute;top:0;width:50%;height:100%;display:block;padding-top:70%}.preview-container .preview-controll .controllers span{display:inline-block;border:2px solid #ba8a4d;width:70px;height:70px;padding-top:8px;border-radius:50%;background-color:#ffffffb3;font-size:30px}.preview-container .preview-controll .control-forward{right:0;border-left:1px solid #dee2e6}.preview-container .preview-controll .control-forward svg{color:#ba8a4d}.preview-container .preview-controll .control-back{left:0}.preview-container .preview-controll .control-back span{border-color:#dc3545}.preview-container .preview-controll .control-back svg{color:#dc3545}.preview-container .preview-controll.active{opacity:1}.preview-container img{width:100%;position:relative;z-index:0;transform:scaleX(-1)}