.elementor-47897 .elementor-element.elementor-element-c26af24{--display:flex;--min-height:100vh;}.elementor-47897 .elementor-element.elementor-element-c26af24:not(.elementor-motion-effects-element-type-background), .elementor-47897 .elementor-element.elementor-element-c26af24 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F4F4F4;}/* Start custom CSS for html, class: .elementor-element-e3c30cb */#description {
  text-align: center;
  margin-bottom: 20px;
}
    .container {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .left-section, .right-section {
      width: 100%;
      margin-bottom: 20px;
      text-align: center;
    }
    #canvas {
      width: 100%;
      max-width: 400px;
      height: auto;
      border: 1px solid #ddd;
      margin-bottom: 20px;
    }
    .custom-file label {
      padding: 10px 15px;
      background-color: #1A9190;
      color: white;
      border-radius: 8px;
      cursor: pointer;
      margin: 0;
      margin-bottom: 30px;
      display: inline-block;
    }
    .custom-file label:hover {
      background-color: #336b6a;
    }
    input[type="file"] {
      display: none;
    }
    .color-box {
      display: inline-block;
      width: 100px;
      height: 25px;
      margin-top: 10px;
      border: 2px solid transparent;
      cursor: pointer;
      margin-right: 10px;
    }
    .color-info {
      margin-top: 10px;
      font-size: 18px;
    }
    .palette {
      justify-content: flex-start;
      flex-wrap: wrap;
      margin-top: 20px;
      gap: 10px;
      align-items: center;
    }/* End custom CSS */