body {
    /* background-color: #d4fae5; */
    /* background-color: #cdf5de; */
    background-color: #f9f9f9;
}


h1 {
    font-size: 24px;
}

h2 {
    font-size: 22px;
}

h1,
h2,
h3,
h4,
h5 {
    /* color: #04cb5b; */
    color: #009900;
}

.btn-green {
    background-color: #07C95B;
    color: white;
}

.bg-blue {
    background-color: #cdf5de;
    border-radius: 50%;
    color: #04cb5b;
}

.bg-green {
    background-color: #009900;
}

.text-green {
    color: #04cb5b;
}

.btn-yellow {
    background-color: #f4d45c;
}

.text-yellow {
    color: #f4d45c;
}

* {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2C3E50;
    font-size: 14px;
}


a {
    text-decoration: none;
}

.footer {
    background-color: #cdf5de;
}



/*===========================
  card-01 css
===========================*/
.single-card {
    box-shadow: var(--shadow-1);
    border-radius: 8px;
    overflow: hidden;
    margin-top: 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.single-card:hover {
    box-shadow: var(--shadow-4) !important;
}

.single-card .card-image img {
    width: 100%;
    height: 100%
}

.single-card .card-content {
    padding: 16px;
}

.single-card .card-content .card-title {
    margin-bottom: 0;
}

.single-card .card-content .card-title a {
    color: var(--black);
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}

.single-card .card-content .card-title a:hover {
    color: var(--primary) !important;
}

.single-card .card-content .text {
    color: var(--dark-3);
    margin-top: 8px;
}

/* card end */

/* Button Success */
.success-btn {
    background: var(--success);
    color: var(--white);
    box-shadow: var(--shadow-2);
}

.active.success-btn,
.success-btn:hover,
.success-btn:focus {
    background: var(--success-dark);
    color: var(--white);
    box-shadow: var(--shadow-4);
}

.deactive.success-btn {
    background: var(--success-light);
    color: var(--dark-3);
    pointer-events: none;
}

.success-btn-outline {
    border-color: var(--success);
    color: var(--success);
}

.active.success-btn-outline,
.success-btn-outline:hover,
.success-btn-outline:focus {
    background: var(--success-dark);
    color: var(--white);
}

.deactive.success-btn-outline {
    color: var(--dark-3);
    border-color: var(--success-light);
    pointer-events: none;
}

.success-btn-link {
    color: var(--success);
}

.active.success-btn-link,
.success-btn-link:hover,
.success-btn-link:focus {
    color: var(--success-dark);
}

.deactive.success-btn-link {
    color: var(--dark-3);
    pointer-events: none;
}

/* Button success end */

.txt-hvr {
    color: #333;
}

.txt-hvr:hover,
.txt-hvr:hover i,
.txt-hvr:hover span {
    cursor: pointer;
    color: #83a726;
}

.profile-box {
    width: 100px;
    height: 100px;
    background-image: url('../frontend/default_user.jpg');
    background-size: cover;
    border-radius: 50%;
}

/* Ribbon */
.crd {
    position: relative;
}

.crd .crd__container {
    position: relative;
}


.crd::before {
    position: absolute;
    top: 2rem;
    right: -0.5rem;
    content: '';
    background: #9b2424;
    height: 28px;
    width: 28px;
    transform: rotate(45deg);
}

.crd::after {
    position: absolute;
    content: attr(data-label);
    top: 11px;
    right: -14px;
    padding: 0.5rem;
    width: 10rem;
    background: #c42f2f;
    color: white;
    text-align: center;
    box-shadow: 4px 4px 15px rgba(26, 35, 126, 0.2);
}

/* Ribbon End */

.about {
    width: 100%;
}

.about p {
    color: white;
}




@media only screen and (min-width: 600px) {
    .about {
        width: 50%;
    }
}

.searchInput {
    width: 12rem;
}

@media only screen and (min-width: 600px) {
    .searchInput {
        width: 30rem;
    }
}

#mapid {
    width: 100%;
    height: 200px;
}

.transparent-bg {
    background-color: rgb(12, 12, 12, 0.6);
}

.cart-banner {
    background-image: url('../frontend/cart_bg5.jpg');
    width: 100%;
    height: 20vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.carousel_img {
    height: 90vh;
    object-fit:cover;
}

@media only screen and (min-width: 600px) {
    .cart-banner {
        background-image: url('../frontend/cart_bg5.jpg');
        width: 100%;
        height: 50vh;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }
}

@media only screen and (max-width: 800px) {
    .qty-form {
        width: 40px;
    }

    .carousel_img {
        max-height: 200px;
    }
}

@media only screen and (max-width: 800px) {
    .notes-form {
        width: 60px;
    }
}

.green_bg{
    background-color: #009900;
}

.compare{
    background-color: #dddddd;
    color: #009900;
    font-size: 14px;
}
.yellow{
    color: #FFCC33;
}
.green{
    color: #5BE25B78;
}

.signup_btn{
    background-color: #5BE25B78;
    padding: 4px 12px;
    color: white;
    border-radius: 4px;
}

.signup_btn:hover{
    color: white;
}

.login_btn{
    background-color: #FFCC33;
    padding: 4px 12px;
    color: black;
    border-radius: 4px;
}
.login_btn:hover{
    color: black;
}