
.top-cart
{
  display: none;
  position: fixed;
  top: 59px;
  left: 80%;
  background-color: #fff;
  z-index: 9999;
  width: 200px;
}

.razorpay-payment-button{
  background-color: #e3a25d;
  padding:10px 20px;
  border-radius: 10px;
  margin:0 auto;

}
ul.footer {
  list-style-type: none;
}

video-container {
  width: 100%; /* Ensures the container uses the full width of its parent */
}

.video-container iframe {
  width: 100%;
  height: auto; /* Height is calculated automatically */
  aspect-ratio: 16 / 9; /* Maintains the standard 16:9 ratio */
}
  .progress-red {
    width: 100%;
    height: 20px;
    background: #e0e153;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
  }
  
  .progress-red::-webkit-progress-bar {
    width: 100%;
    height: 20px;
    border-radius: 30px;
  }
  
  .progress-red::-webkit-progress-value {
    background: #e0e153;
      height: 20px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
  }
  
  .progress-red::-moz-progress-bar {
    width: 100%;
     height: 20px;
    background: #e0e153;
    border-radius: 30px;
  }

.marquee-container {
  width: 100%; /* Or a fixed width */
  overflow: hidden; /* Hide content outside the container */
  white-space: nowrap; /* Prevent content from wrapping */
  box-sizing: border-box;
}

.marquee-content {
  display: inline-block; /* Allow content to flow horizontally */
  animation: marquee-scroll 15s linear infinite; /* Apply the animation */
}

.marquee-content span {
  padding-right: 20px; /* Spacing between items */
}

@keyframes marquee-scroll {
  0% {
    transform: translateX(100%); /* Start off-screen to the right */
  }
  100% {
    transform: translateX(-100%); /* End off-screen to the left */
  }
}

ul{
    padding-left: 20px;
    font-family: "font_raleway";
    color: #4c5758;
}

@keyframes wiggle {
    0% { transform: rotate(0deg); }
   80% { transform: rotate(0deg); }
   85% { transform: rotate(5deg); }
   95% { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}

input[type="submit"].paw-sign:hover{
  cursor: url("https://maggies.in/images/icons/paws.png"), pointer ;
}

.field_with_errors input[type="text"] {
  border: 1px solid red;
}




a{
  cursor: pointer;
}
button{
    cursor: pointer;
}
.wiggle {
  display: inline-block;
  animation: wiggle 2s infinite;
}
.header-peeking{
  max-width:120px;padding:25px;margin-bottom:-20px;
    display: inline-block;
  animation: wiggle 2s infinite;
}


.border-powder{
   border: 1px solid #d1e4ea;
}
.border-olive{
    border: 1px solid #4f4f2b;

}

.border-dgrey
{ border: 1px solid #4c5758;

}
a.contribute-btn:hover{
  background-color: #f3e9df;
}

button.mp-select{
   border: 1px solid #d1e4ea;
   background: #fff;
   cursor: pointer;
}
button.mp-select:hover{
   border: 1px solid #d1e4ea;
  background-color: #d1e4ea;


}

.rounded {
  border-radius: 4px;
}
.no-border {
  border: 0px;
}
.no-margin {
  margin: 0px;
}
.br-grey{
border-right:1px solid #9aa6a7;
}
.bb-grey{
border-bottom:1px solid #9aa6a7;
}


ul.circle-list li {
  list-style-type: circle; /* Can also style individual list items */
}

select.mp-select  {
            /* for Firefox */
            -moz-appearance: none;
            /* for Safari, Chrome, Opera */
            -webkit-appearance: none;
            border-radius:4px 0 0 4px;
        }

        /* for IE10 */
        select.mp-select::-ms-expand {
            display: none;
        }


        .slick-carousel{
    display: none;
}

.slick-carousel.slick-initialized {
    display:block; /* or display: flex, depending on your layout */
}

.atc_mobile_fixed
{
  position: fixed;
  bottom:0;
  left:0;

  text-align:center;

  width:100%;
  display:inline-block;
}




/* #cart display */

#notification-area {
            position: fixed;
            top: 100px;
            right: 150px;
            background-color: #e0e153;
            color: #000;
            padding: 10px;
            border-radius: 5px;
            display: none; 
        }

#notification-area:after{
  content:'';
            position: absolute;
            top: 90%;
            right: 50%;
            background-color: red;
            color: #000;
            padding: 2px;
            border-radius: 5px;
        translate:50% 50% ;
        z-index:-1;
        width:100%;
        border
        height:100%;
        animation: fadeOut 2s ease-out forwards
           
        }

        @keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    /* Element is invisible, but still takes up space */
  }
}