// .scroll-bar {
//     display: block;
//     overflow-y: scroll;
//     overflow-x: hidden;
//     height: 80vh;
//     scrollbar-width: thin;
//     border-radius: 6px;
// }

// .main-div {
//     display: flex;
// }

// .content {
//     flex: 1;
//     padding: 20px;
// }

// .canvas-div {
//     max-width: 640px;
//     max-height: 460px;
// }

// #c {
//     border: 2px dashed #cccccc;
// }

// .img-maindiv {
//     width: 250px;
// }

// .img-div {
//     // width: 200px;
//     width: 220px;
//     overflow-x: scroll;
//     padding-top: 10px;
// }

// .controls-div {
//     width: 350px;
// }

// .controls {
//     background-color: #f0f0f0;
//     margin-top: 20px;
//     padding: 10px;
// }

// .controls {
//     border-right: 2px solid #ddd;
// }

// .max-height {
//     overflow: auto;
//     // max-height: 350px;
//     max-height: 385px;
// }

// .images-item {
//     width: 48%;
//     cursor: pointer;
//     transition: .5s ease;
//     transition: .5s ease;
//     padding: 5px;
//     max-width: 120px;
// }

// .images-item:hover {
//     opacity: 0.7;
// }

// .images-item-upload {
//     width: 80%;
//     cursor: pointer;
//     padding-bottom: 10px;
//     transition: .5s ease;
//     transition: .5s ease;
// }

// .images-item-upload:hover {
//     opacity: 0.7;
// }

// .common-button {
//     border-radius: 4px;
//     line-height: 2;
//     background: var(--action-primary-default);
//     color: white;
//     padding-left: 10px;
//     padding-right: 10px;
//     margin: 4px;
// }

// .bg-select {
//     border: none;
//     width: 180px;
//     height: 30px;
//     background-color: var(--category-bg-violet);
//     padding-left: 5px;
//     margin-left: 10px;
// }

// .bg-option {
//     font-size: 15px;
// }

// .input-padding {
//     padding: 4px;
// }

// #addtxt {
//     padding-left: 3px;
//     line-height: 2;
// }

// .mat-style {
//     padding-right: 5px;
// }

// .renderer-div {
//     display: block;
//     margin-left: 10px;
// }

// .mat-button {
//     display: flex;
//     align-items: center;
//     justify-content: center;
// }

// .json-div {
//     margin-left: 15px;
// }

// #i {
//     max-width: 100vw;
//     height: 500px;
//     overflow-y: scroll;
// }

// .bottom-div {
//     height: 20px;
// }