@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@100;200;300;400;500;600;700;800;900&display=swap');
body{
    font-family: 'League Spartan', sans-serif;
    background-color: #f0f0f0!important;
}

input#form-floating,.form-floating:not(.form-control:disabled)::before{
    pointer-events:none;
    background-color:transparent!important;
}
.avdrpd{
    min-width:50vw;
}
.avnav{
    display:inline;
}
.avside{
    display:none;
}
@media only screen and (max-width: 580px) {
    .fs-5{
        font-size: 16px!important;
    }
    .fs-6{
        font-size: 12px!important;
    }
    .avdrpd{
        min-width:100vw;
    }
}
@media only screen and (max-width: 824px) {
    .fs-5{
        font-size: 18px!important;
    }
    .fs-6{
        font-size: 16px!important;
    }
    .avnav{
        display:none!important;
    }
    .avside{
        display:block;
    }
}
.sgfd-parent{
    width:10px;
    height:70%;
    margin:0px;
}
.sgfd{
    opacity: 20%;
    background-color:black;
    width:1px;
    height:100%;
    margin: 5px 0px 5px 0px;
}
@media only screen and (max-width: 768px) {
    .fs-5{
        font-size: 16px!important;
    }
    .fs-6{
        font-size: 12px!important;
    }
    .sgfd-parent{
        width:100%;
        height:30px;
    }
   .sgfd{
        width:100%;
        height:1px;
        margin: 10px 0px 10px 0px;
    }
    .img-fluid-mobile{
        max-width:180px!important;
    }
}

.bg-ahvelo-light{
    background-color: #FF6E6E!important;
}

.bg-ahvelo{
    background-color: #FA3F3F!important;
}

.bg-notif{
    background-color: #f0f0f0!important;
}

.ahvpill{
    color: #FA3F3F!important;
    background-color: transparent!important;
}

.ahvpill.active{
    color: white!important;
    background-color: #FA3F3F!important;
}

.ahvbutton{
    color:white;
    background-color: #FA3F3F!important;
    border-radius:30px;
    transition-duration: 0.1s;
    border:0px;
}
.ahvbutton:hover{
    background-color: #D02A2A!important;
}
.ahvbutton:active{
    transition-duration: 0s;
    background-color: #FF6E6E!important;
}

.ahvpc{
    background-color: #D02A2A!important;
}

.ahvsc{
    background-color: #FA3F3F!important;
}

#prodcat::-webkit-scrollbar {
    display: none;
}

#prodcat {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

#catcat::-webkit-scrollbar {
    display: none;
}
#catcat {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.carousel-inner > .item > img {
  width: 100%;
}

.catgrad {
    background: rgb(240,240,240);
    background: linear-gradient(270deg, rgba(240,240,240,1) 0%, rgba(255,255,255,0) 100%);
}
.catgradb {
    background: rgb(240,240,240);
    background: linear-gradient(90deg, rgba(240,240,240,1) 0%, rgba(255,255,255,0) 100%);
}

.catgrad2 {
    background: rgb(240,240,240);
    background: linear-gradient(270deg, rgba(240,240,240,1) 0%, rgba(255,255,255,0) 100%);
}
.catgradb2 {
    background: rgb(240,240,240);
    background: linear-gradient(90deg, rgba(240,240,240,1) 0%, rgba(255,255,255,0) 100%);
}

.fw-black {
    font-weight: 900;
}

.material-symbols-outlined.filled {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
    font-variation-settings:
        'FILL' 1,
        'wght' 400,
        'GRAD' 0,
        'opsz' 48;
    transition: font-variation-settings 0.1s;
}

.material-symbols-outlined {
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 48;
    transition: font-variation-settings 0.1s;
}

/*Spinner CSS code starts*/
  
.spinnerCustom {
    vertical-align: baseline;
    animation: rotator 1.4s linear infinite;
}

circle{
    display: inline;
}

#loadSpinner{
    padding: 0px;
    width: 100px;
    height: 100px;
}
  
@keyframes rotator {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(270deg);
    }
}
  
.pathCustom {
    stroke-dasharray: 187;
    stroke-dashoffset: 0;
    transform-origin: center;
    animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
}
  
@keyframes colors {
    0% {
      stroke: #4285F4;
    }
    25% {
      stroke: #DE3E35;
    }
    50% {
      stroke: #F7C223;
    }
    75% {
      stroke: #1B9A59;
    }
    100% {
      stroke: #4285F4;
    }
}
  
@keyframes dash {
    0% {
      stroke-dashoffset: 187;
    }
    50% {
      stroke-dashoffset: 46.75;
      transform: rotate(135deg);
    }
    100% {
      stroke-dashoffset: 187;
      transform: rotate(450deg);
    }
}
  
/*Spinner CSS code ends*/