/* HTML: <div class="rounded-edge"></div> */
.footBackA {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 4/2;
  /* update the 85% to control the curvature
     you can also update the 50% to control the position
  */
  /*clip-path: ellipse(40% 25% at 50% 50%);*/
  clip-path: polygon(31% 0, 67% 2%, 100% 0, 100% 100%, 80% 100%, 20% 100%, 0 100%, 0 3%);
  /*background: #CC2A41;*/

  padding-left: 10px;
  padding-right: 10px;
  /*background-color: var(--footupColor);*/
   background: linear-gradient(90deg,rgba(247, 149, 2, 1) 0%, rgba(247, 210, 25, 1) 50%, rgba(237, 221, 83, 1) 73%);
  color: #fff;
  z-index: 10;
}
 .backShopF{
                    background-image:url('../img/back-1.png');
                    background-position: center  bottom;
                    background-size: 100% 30%;
                    background-repeat:no-repeat;
                    width: 100%;
                    height:auto;
                    background-color:transparent;
                    
    }

/* responsive -----------------------------------------*/
@media  only screen and (min-width: 200px) and (max-width: 767px) {
   
.footBackA {
  height: auto;
  aspect-ratio: 5/2;
  /* update the 85% to control the curvature
     you can also update the 50% to control the position
  */
  /*clip-path: ellipse(100% 100% at 50% 100%);*/
   clip-path: polygon(31% 0, 67% 2%, 100% 0, 100% 100%, 80% 100%, 20% 100%, 0 100%, 0 3%);
  /*background: #CC2A41;*/
  /*background: #CC2A41;*/

  padding-left: 10px;
  padding-right: 10px;
  /*background-color: var(--footupColor);*/
   background: linear-gradient(90deg,rgba(247, 149, 2, 1) 0%, rgba(247, 210, 25, 1) 50%, rgba(237, 221, 83, 1) 73%);
  color: #fff;
}
}