.blog-contact-card{
    position: fixed;
    bottom: 0;
    top: 0;
    right: 0;
    margin-top: auto;
    margin-bottom: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    height: fit-content;
    z-index: 50;
    transform: translateX(402px);
    transition: all .4s;
}
.blog-contact-active{
    transform: translateX(0px);
}
.blog-contact-btn{
    height: 150px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(-55deg, #202449, #E84E1B, #273580, #E84E1B);
    animation: gradient 2s ease infinite;
    background-size: 400% 400%;
    border-radius: 15px 0px 0px 15px;
}
.blog-contact-btn span{
    transform: rotate(-90deg);
    width: 100%;
    min-width: 100px;
    color: white;
    font-weight: 500;
}
.blog-contact-form-close{
    margin-top: 10px;
    font-size: 15px;
    color: var(--blue);
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    width: 100%;
    display: block;
}
.blog-contact-form-close:hover{
    cursor: pointer;
}
.blog-contact-content{
    width: 100%;
    max-width: 400px;
    background: linear-gradient(180deg, #FDEDE7 0%, #FFFFFF 30.21%);
    box-shadow: 0px 187px 75px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
    border-radius: 16px 0px 0px 16px;
    padding: 35px 25px;
}
.blog-contact-head{
    text-align: center;
}
.blog-contact-head h6{
    font-size: 18px;
    font-weight: 500;
}
.blog-contact-head p{
    font-size: 15px;
    font-weight: 400;
}
.blog-contact-form label{
    font-size: 15px;
    color: #202449c2;
    font-weight: 500;
    margin-bottom: 5px;
}

.blog-contact-form .input-group:focus{
    border: 2px solid red;
}
.blog-contact-form-item{
    margin-bottom: 12px;
}
.blog-contact-form .input-group span{
    background-color: transparent;
    border: 0px;
    border-radius: 5px;
    position: absolute;
    z-index: 50;
    left: 2px;
    top: 0;
    bottom: 0px;
}
.blog-contact-form .input-group input{
    color: var(--blue);
    font-weight: 500;
    padding-left: 45px;
    height: 40px;
    border: 1px solid #e5e5e5;
    filter: drop-shadow(0px 1px 0px #efefef) drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
    border-radius: 5px !important;
}
.blog-contact-form .input-group input:focus{
    border-radius: 5px;
    border: 1.5px solid var(--blue);
    filter: drop-shadow(0px 1px 0px #efefef) drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
    box-shadow: unset;
}
.blog-contact-form .input-group input::placeholder{
    font-size: 15px;
    font-weight: 400;
    color: #202449c2;
}
.blog-contact-form-btn{
    margin-top: 15px;
    height: 40px;
    border: none;
    text-align: center;
   background-color: var(--blue);
    border-radius: 10px;
    color: white;
    font-size: 15px;
    font-weight: 500;
    width: 100%;
    filter: drop-shadow(0px 1px 0px #efefef) drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
}
.blog-contact-form-btn svg{
    margin-left: 6px;
    margin-top: -1px;

}
@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes textcolor {
    0% {
        color: white;
    }

    50% {
        color: #e84e1b;
    }

    100% {
        color: white;
    }
}
@media only screen and (max-width: 576px) {
    .blog-contact-btn{
        height: 145px;
        width: 35px;
        font-size: 15px;
    }
    .blog-contact-content{
        width: 310px;
        padding: 25px 15px;
    }
    .blog-contact-card{
        z-index: 250;
        transform: translateX(312px);
    }
    .blog-contact-active {
        transform: translateX(0px);
    }
    .blog-contact-head h6{
        font-size: 16px;
    }
    .blog-contact-head p{
        font-size: 14px;
        margin-bottom: 10px !important;
    }
    .blog-contact-form label{
        font-size: 14px;
    }
}