:root {
    --box-shadow: 0px 10px 15px -15px rgba(0, 0, 0, 0.32);
    --gridpad: 30px;
}

.tfhome_grid {
    display: grid;
    grid-template-columns: 1fr;
    /* gap: 10px; */
    /* padding: 30px; */
    box-sizing: content-box;
    /* margin-top: 60px; */

}

.tfhome_grid_one {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0px;
    /* padding: 30px; */
    box-sizing: content-box;
    /* padding: var(--gridpad); */

}

.tfhome_grid_three {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 60px;
    /* padding: 30px; */
    box-sizing: content-box;
    padding: var(--gridpad);

}

.tfhome_grid>div {
    /* background-color: #fff; */
    /* padding: 15px; */

}







.tfnewproducts_inner_content {

    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 15px;
}

ul.tfnewproducts_inner_content.products.columns-3.js_animated::before {
    display: none;

}

ul.tfnewproducts_inner_content>.product {
    width: 100% !important;

}

.badge {
    background-color: red !important;
    height: 15px;
    width: 120px;
    position: absolute;
    display: block;
    top: 15px;
    right: 15px;

}

.product-category-image {}

.product-category {
    display: flex;
    align-content: start;
    justify-content: start;
    flex-direction: column;
    /* height: 300px; */
    background-position: bottom right;
    background-size: 100%;
    background-repeat: no-repeat;
    padding: 0px !important;
    background-color: transparent !important;
    box-shadow: none !important;
    gap: 15px;
    overflow: hidden;
}

.product-number-1 {

    grid-area: 1 / 2;
}

.product-number-2 {

    grid-area: 1 / 4;
}

.product-number-3 {

    grid-area: 2 / 1;
}

.product-number-4 {

    grid-area: 3 / 2;
}

.product-number-5 {

    grid-area: 3 /5;
}

.product-number-6 {

    grid-area: 3 /4;
}

.tf_vp_inner_content>svg {
    max-width: 90%;
    transform: translateY(20px)
}



/* Define the animation */
@keyframes swap {

    0%,
    40% {
        opacity: 0;
        /* Hidden items will be invisible for the first 40% of the animation duration */
        pointer-events: none;
        /* Make the hidden items not respond to mouse events */
    }

    50%,
    90% {
        opacity: 1;
        /* Then they will become visible for the next 40% of the animation duration */
        pointer-events: auto;
        /* Make the hidden items respond to mouse events */
    }

    100% {
        opacity: 0;
        /* Hidden items will be invisible for the first 40% of the animation duration */
        pointer-events: none;
        /* Make the hidden items not respond to mouse events */
    }
}

.hidingProducts.product-number-1 {
    opacity: 1;
    pointer-events: auto;

    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 3s;
}

.hidingProducts.product-number-2 {
    opacity: 1;
    pointer-events: auto;

    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 8s;
    animation-play-state: running;
    /* Default state */

}

.hidingProducts.product-number-3 {
    opacity: 1;
    pointer-events: auto;
    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 12s;
}

.hidingProducts.product-number-4 {

    opacity: 1;
    pointer-events: auto;
    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 15s;
    animation-play-state: running;
    /* Default state */
}

.hidingProducts.product-number-5 {

    opacity: 1;
    pointer-events: auto;
    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 18s;
    animation-play-state: running;
    /* Default state */
}


.hidingProducts.product-number-6 {

    opacity: 1;
    pointer-events: auto;
    /* Make the hidden items not respond to mouse events */
    animation: swap 10s infinite;
    /* Animation will last 10 seconds and repeat indefinitely */
    animation-delay: 24s;
    animation-play-state: running;
    /* Default state */
}

.product-category:hover {
    border: solid 0px #fff;
    animation-play-state: paused;
}


.product-category-info {
    transform: scale(0);
    width: 100%;
    margin-top: 0%;
    transition: .2s;
    background-color: rgba(255, 255, 255, 0.7);
    height: 100%;
    padding: 30px;
    /* -webkit-backdrop-filter: blur(20px); */
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 15px;

}

.product-category-info h2 a {
    color: black !important;
    font-size: 18px;
    line-height: 0px;
    line-height: 1px !important;

}

.product-category:hover .product-category-info {
    transform: scale(1);
    transition: .2s;

}

.product-category:hover .product-category-image {

    background-size: 100%;
    transition: .2s;
    background-position: 50% 50%;
    background-blend-mode: normal;

}

.product-category-image {
    min-height: 100%;
    transition: .2s;
    background-size: 100%;
    background-position: 50% 50%;
    display: flex;
    background-repeat: no-repeat;
    /* border-radius: 40px; */
    /* -webkit-border-top-left-radius: 200px; */
    /* box-shadow: var(--box-shadow); */
    /* -webkit-border-top-right-radius: 200px; */
    background-color: #fafafa;
    background-blend-mode: multiply;

}


.product-category>* {
    /* position: absolute; */
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%; */

}

.badge {
    background-color: red !important;
    height: 15px;
    width: 120px;
    position: relative;
    display: flex;
    /* top: 15px; */
    left: 15px;
    position: static;
    flex-direction: column;
    align-items: center;
    align-content: center;
    justify-content: center;

}


.tfhome_grid>div {
    /* border-radius: 13px; */
    overflow: hidden;
    /* box-shadow: var(--box-shadow); */
    /* max-width: 1200px; */
    /* margin: 0 auto; */

}

.tfbanner_inner {
    display: flex;
    flex-wrap: wrap;
    height: 100%;
    max-width: 1000px;
    margin: 0 auto;
    min-height: 500px;

}

.tfbanner_inner_content,
.tfbanner_image {
    flex: 1 0 50%;
    box-sizing: border-box;
    align-content: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
    text-align: center;
    background-color: #f5f5f5;

}

.tfbanner_image {
    background-size: cover;
    background-position: center;
}

@media (max-width: 768px) {

    .tfbanner_inner_content,
    .tfbanner_image {
        flex: 1 0 100%;
    }
}

.tfintrotype {
    grid-column: span 3;
    height: 20vh;
    box-shadow: none !important;
    display: flex;
    align-content: center;

    justify-content: center;
    flex-direction: column;
    text-align: center;
    font-size: 42px !important;

}

.tfintrotype h2 {

    font-size: 42px !important;

}

.page-template-twoFourHome-php .site-content {

    max-width: 100% !important;
}

.page-template-twoFourHome-php .content-area {
    padding: 0px !important;
}

.tf_intro_type h2 {
    font-size: 80px;
    font-weight: 900;
    color: ;

}

.tf_intro_type {
    /* background-color: white; */
    /* box-shadow: none; */
    /* min-height: 40vh; */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px;
    text-align: center;
    font-size: 40px;
    /* margin-bottom: 50px; */
    /* background-color: rgb(255, 255, 255); */
    width: 500px;
    border-radius: 13px;

}

.tfhome_grid_one.tf_white.tf_full {
    background-color: #fafafa;
    min-width: 100%;
    /* height: 100vh; */
    box-sizing: border-box;
    /* height: 100vh; */
    display: flex;
    align-items: center;
    justify-content: center;

}

.tf_full>.tfbanner {
    min-width: 80%;
    /* padding: 10%; */
    /* margin: 0 auto; */
    /* box-shadow: var(--box-shadow) !important; */

}

.tf_white {
    background-color: white;

    padding: 30px;

}

.tfnewproducts {
    max-width: 1300px;
    margin: 0 auto;
    padding: 60px 0px;

}


.tf_atf_grid {
    max-width: 100vw !important;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 0px;
    height: calc(100vh - 145px);
    background-color: #fff;
    gap: 15px;
    padding: 15px;
    padding-top: 0px;

}

.tf_vp {
    grid-row: 2;
    grid-column: 2 / span 3;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center
}

.product-category-info {
    /* display: none; */

}

.tf_button {
    background-color: black;
    color: white !important;
    padding: 5px 10px;
    border-radius: 13px;

}

/* Initially hide the hidden items */


@keyframes slider {

    0% {
        transform: translateX(0vw);



    }

    100% {
        transform: translateX(-400vw);


    }
}


.scrolling-text {

    grid-column: span 5;
    animation: slider 20s infinite;
    animation-timing-function: linear;
    animation-fill-mode: forwards;
    background-color: white;


}

.text-container>div {
    min-width: 100vw !important;
    background-color: white;
    padding: 5px 15px;
    display: flex;
    align-content: center;
    justify-content: center;
    font-weight: 900;
    font-size: 18px;
    ;

}

.text-container:last-child:after {
    content: '';
    min-width: 100vw;
    height: 50px display: block;
    position: relative;
    background-color: white !important;
}

.text-container:first-child:before {
    content: '';
    min-width: 100vw;
    height: 50px display: block;
    position: relative;
    background-color: white !important;
}

.text-container {
    display: flex;
}

.tfnewproducts_inner.woocommerce h1 {
    text-align: center;
    font-size: 5vw !important;

}

.tfnewproducts_inner.woocommerce {
    gap: 10px;
    display: flex;
    flex-direction: column;
}

.tfnewproducts_inner.woocommerce {
    height: 100%;
    display: flex;
    align-content: center;
    justify-content: center;
    flex-direction: column;
    gap: 30px;
}

.tfnewproducts_inner.woocommerce h3 {
    text-align: center;
    font-size: 4vw;
    font-weight: 600;
    background-color: white;

    margin: 0 auto;
    padding: 5px 15px;
    border-radius: 13px;
}


.tfnewproducts_inner.woocommerce button {
    text-transform: capitalize !important;
    font-size: 2vw;
    font-weight: 600;
    background-color: white;
    width: calc(15vw);
    margin: 0 auto;
    padding: 15px 5px;
    border-radius: 13px;
}

.tfnewproducts_inner.woocommerce .product {
    background-color: white;
    border-radius: 13px;
    padding: 15px !important;
    margin: 0px !important;

}

.tf_white {
    background-color: #ffffff !important;
}

.tf_offwhite {
    background-color: #f5f5f5 !important;
}