@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

.btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 177.1%;
    letter-spacing: .3em;
    padding: 1rem;
    border-radius: 25.5px;
    text-decoration: none;
    display: block;
    transition: all .5s ease-in-out
}

.btn_regular {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 500;
    letter-spacing: .3em;
    transition: all .5s ease-in-out
}

.green_btn {
    color: var(--white);
    background: var(--light-green);
    border: 1px solid var(--light-green);
    filter: drop-shadow(0px 14px 34px rgba(3,173,84,0.32))
}

    .green_btn:hover {
        color: var(--light-green);
        background: var(--white)
    }

.social_btn {
    display: flex;
    align-items: center;
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 110%;
    color: var(--white);
    text-decoration: none;
    border-radius: 6px;
    padding: 9px 5px;
    transition: all .5s ease-in-out
}

    .social_btn .text_wrapper {
        padding-left: 8px
    }

@media(min-width: 480px) {
    .social_btn {
        font-size: 14px;
        padding: 13px 12px
    }
}

.black_btn {
    background: var(--black);
    border: 1px solid var(--black);
    border-radius: 130px;
    color: var(--white)
}

    .black_btn:hover {
        color: var(--black);
        background: var(--white)
    }

.post_comment--btn {
    font-size: 12px;
    line-height: 124%;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--white)!important ;
    background: #eb1d1d!important ;
    border: 1px solid #eb1d1d!important ;
    border-radius: 27px!important ;
    max-width: 200px!important ;
    width: 100%!important 
}

    .post_comment--btn:hover {
        border-color: var(--black);
        background: 0 0;
        color: var(--black)
    }

.btn_read {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 146.1%;
    text-align: center;
    letter-spacing: .3em;
    border-radius: 21px;
    border-width: 3px;
    border-style: solid;
    display: block;
    max-width: 138px;
    width: 100%;
    padding: .3125rem 0 .1875rem;
    text-decoration: none;
    transition: all .5s ease-in-out
}

.read_more_yellow--btn {
    color: var(--black);
    background: #e4c02e;
    border-color: #e4c02e
}

    .read_more_yellow--btn:hover {
        color: var(--white);
        background: 0 0;
        border-color: var(--white)
    }

.read_more_trans--btn {
    color: var(--white);
    background: 0 0;
    border-color: var(--white)
}

    .read_more_trans--btn:hover {
        color: var(--white);
        background: var(--black);
        border-color: var(--black)
    }

@media(min-width: 480px) {
    .btn_read {
        padding: .59375rem .1875rem
    }
}

.add_to_cart--btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 500;
    font-size: 9px;
    line-height: 177.1%;
    text-align: center;
    letter-spacing: .3em;
    color: var(--white);
    display: block;
    background: var(--light-green);
    border-radius: 25.5px;
    transition: all .5s ease-in-out;
    max-width: 143px;
    width: 100%;
    padding: .6rem;
    text-decoration: none
}

    .add_to_cart--btn:hover {
        color: var(--white);
        background: var(--green-btn-hover)
    }

@media(min-width: 576px) {
    .add_to_cart--btn {
        font-size: 11px;
        max-width: 191px;
        padding: 1rem
    }
}

.buy_now--btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 183.1%;
    color: #f5faf6;
    background: var(--light-green);
    display: block;
    text-align: center;
    text-decoration: none;
    border-radius: 22.5px;
    padding: 10px;
    width: 123px;
    transition: all .5s ease
}

    .buy_now--btn:hover {
        color: var(--white);
        background: var(--green-btn-hover)
    }

.home_btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 93.1%;
    letter-spacing: .17em;
    color: var(--white);
    background: var(--light-green);
    padding: 12px;
    text-align: center;
    border-radius: 100px;
    display: block;
    max-width: 158px;
    width: 100%;
    transition: all .5s ease-in-out
}

    .home_btn:hover {
        color: var(--white);
        background: var(--green-btn-hover);
        text-decoration: none
    }

@media(min-width: 768px) {
    .home_btn {
        font-size: 14px;
        padding: 19px
    }
}

.dairy_read--btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    text-transform: uppercase;
    display: block;
    border-width: 1px;
    border-style: solid;
    outline: none;
    text-decoration: none;
    max-width: 200px;
    width: 100%;
    padding: .9rem;
    transition: all .5s ease
}

.dairy_read_transparent--white {
    border-color: var(--white);
    color: var(--white)
}

.dairy_read_transparent--black {
    border-color: var(--black);
    color: var(--black)
}

.dairy_read--yellow {
    background: var(--dairy-secondary-color);
    border-color: var(--dairy-secondary-color);
    color: var(--black)
}

.dairy_read_transparent--white:hover {
    border-color: var(--dairy-secondary-color);
    color: var(--dairy-secondary-color)
}

.dairy_read_transparent--black:hover {
    color: var(--black);
    background: var(--dairy-secondary-color);
    border-color: var(--dairy-secondary-color)
}

.dairy_read--yellow:hover {
    color: var(--black);
    border-color: var(--black);
    background: 0 0
}

@media(min-width: 768px) {
    .dairy_read--btn {
        font-size: 20px;
        line-height: 23px;
        max-width: 251px;
        padding: 1.0625rem
    }
}

.veg_btn {
    font-family: "Comic Neue", cursive;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    text-transform: uppercase;
    color: var(--white);
    background: var(--veg-btn);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    max-width: 183px;
    width: 100%;
    padding: .75rem;
    text-decoration: none;
    position: relative;
    transition: all .5s ease-in-out;
    z-index: 999
}

    .veg_btn:hover {
        color: var(--black);
        background: var(--veg-primary-color);
        text-decoration: none
    }

@media(min-width: 576px) {
    .veg_btn {
        max-width: 193px;
        padding: 1.1875rem
    }
}