.ADSCSS {
     .circle {
         /* width: 150px; */
         /* width: calc((100% - 4 * 15px) / 5); */
         width: 100%;
         /* height: 100px; */
         height: 200px;
         border-radius: 5px;
         background-color: rgb(254, 254, 254);
         border: 3px solid #eee;
         margin: 5px;
         padding: 5px;

         /* Replace with desired color */
     }

     @media (max-width: 1024px) {

         /* Adjust breakpoint as needed */
         .circle {
             border-radius: 5px;
             /* width: calc((100% - 4 * 15px) / 5); */
            height: 100px;
             width: auto;
             padding: 5px;
         }
     }

     #background-changer-adv1 {
         background-repeat: no-repeat;
         background-size: 100% 100%;
         /* transition: background-image 2s ease-in-out; */
         transition: background-image 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
         object-fit: cover;
     }

     #background-changer-adv2 {
         background-repeat: no-repeat;
         background-size: 100% 100%;
         /* transition: background-image 2s ease-in-out; */
         transition: background-image 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
         object-fit: cover;
     }

     #background-changer-adv3 {
         background-repeat: no-repeat;
         background-size: 100% 100%;
         /* transition: background-image 2s ease-in-out; */
         transition: background-image 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
         object-fit: cover;
     }

     #background-changer-adv4 {
         background-repeat: no-repeat;
         background-size: 100% 100%;
         /* transition: background-image 2s ease-in-out; */
         transition: background-image 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
         object-fit: cover;
     }

    
 }