/**
Theme Name: Hello Elementor Child Theme
Theme URI: https://techitdev.com
Author: TechIT Dev
Author URI: https://techitdev.com
Version: 1.0.0
Template: hello-elementor
Tags: Child theme, child theme create by Techit Dev
Desciption: This Child Theme created Hello Elementor Parant Theme
**/



:root{
    --white: #FFF;
    --dark-green:#006400;
    --light-green: #70E000;
    --dark-yellow: #FB8500;

}

p#billing_country_field {
    display: none;
}

/* Menu or Nav Bar */
.techitdev-sticky-menu {
	position: -webkit-sticky;
}

.header, .techitdev-sticky-menu {
	color: #fff;
    transition: background-color 0.4s ease-in-out;
  
}

.sticky {
    position: sticky;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 100;
    border-top: 0;
    background-color: rgba(0,0,0, 50%) !important;
    scroll-behavior: smooth;
}
.sticky li.menu-item a, .sticky a, .sticky i {
    color: #fff !important;
    transition: color 0.4s ease-in-out;
}



  /* Woocommerce Page */
.woocommerce-deleveryitime-message {
    border: 1px solid #ddd;
    padding: 10px;
    background: #ddd3;
	margin: 15px 0px;
}
.woocommerce-deleveryitime-message .delivery-date {
    color: #888;
    margin: 5px 0px;
}
.woocommerce-deleveryitime-message .delevery-time {
    color: #006400;
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 5px 0px;
}

/* Single Product page */
.you_save_price {
	background: #f9f9f9;
	padding: 10px;
	border: 1px dashed #ddd;
	width: 150px;
	font-size: 14px;
	font-weight: 600;
	margin-top: 10px;
}
.woolentor-countdown-flip .woolentor-time .woolentor-time-inner .woolentor-count { 
    background-color: #008000;
}
.single-product .woolentor-flash-product-offer-timer-text {
    background-color: #008000;
}
.product_meta {
    display: none;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: green;
    font-size: 18px;
    font-weight: 700;
}
h1.product_title.entry-title {
    font-size: 1.75em;
}
.you_save_price {
    background: #008000;
    border: 1px dashed #70E000;
    color: #FFFFFF;
}

span.woolentor-flash-sale-price {
    color: #fB8500;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt {
    background-color: #008000;
}
.woocommerce span.onsale {
    background-color: #008000;
    color: #60ff60;
}
/* Checkout page */
div#customer_details h3 {
    background: var(--dark-green);
    color: var(--white);
    padding: 10px 10px;
}
dd.variation- , dt.variation- {
    display: none;
    visibility: hidden;
}
/* td.product-total {
    visibility: hidden;
} */
tr.order-first-installment {
    visibility: hidden;
    display: none;
}

/*  My Account Page */
div#customer_login {
    display: none !important;
}



tr.woocommerce-cart-form__cart-item.cart_item td {
    font-size: 18px;
}
.you_save_price {
    background: #008000;
    border: 1px dashed #70E000;
    color: #FFFFFF;
}

span.woolentor-flash-sale-price {
    color: #fB8500;
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: green;
    font-size: 18px;
    font-weight: 700;
}



/* WP Backand style */
td.order_status.column-order_status mark.order-status.status-waiting-call.tips {
    background: red !important;
    color: #FFF !important;
}
.order-status:hover {
    background: green;
    color: #fff;
}
.woocommerce-error, .woocommerce-info, .woocommerce-message {
    background-color: #008000;
    color: #ffffff;
    font-weight: 700;
    font-size: 18px;
}


/* Auto Floating Shapes */
.auto-moving1{
    animation: linear 20s animationFrameOne infinite;
}
.auto-moving2{
    animation: linear 20s animationFrameTwo infinite;
}
.auto-moving3{
    animation: linear 20s animationFrameThree infinite;
}
.auto-moving4{
    animation: linear 20s animationFrameFour infinite;
}
.auto-moving5{
    animation: linear 20s animationFrameFive infinite;
}
.auto-moving6{
    animation: linear 20s animationFrameSix infinite;
}
@keyframes animationFrameOne{
    0%{
        transform: translate(0px, 0px) rotate(0deg);
    }
    20%{
        transform: translate(73px, -1px) rotate(36deg);
    }
    40%{
        transform: translate(141px, 72x) rotate(72deg);
    }
    60%{
        transform: translate(83px, 122px) rotate(108deg);
    }
    80%{
        transform: translate(-40px, 72px) rotate(144deg);
    }
    100%{
        transform: translate(0px, 0px) rotate(0deg);
    }
}
@keyframes animationFrameTwo{
    0%{
        transform: translate(0px, 0px) rotate(0deg) scale(1);
    }
    20%{
        transform: translate(73px, -1px)  rotate(36deg) scale(0.9);
    }
    40%{
        transform: translate(141px, 72px)  rotate(72deg) scale(1);
    }
    60%{
        transform: translate(83px, 122px)  rotate(108deg) scale(1.2);
    }
    80%{
        transform: translate(-40px, 72px)  rotate(144deg) scale(1.1);
    }
    100%{
        transform: translate(0px, 0px)  rotate(0deg) scale(1);
    }
}
@keyframes animationFrameThree{
    0%{
        transform: translate(165px, -179px);
    }
    100%{
        transform: translate(-34px, 617px);
    }
}
@keyframes animationFrameFour{
    0%{
        transform: translate(-300px, 151px) rotate(0deg);
    }
    100%{
        transform: translate(251px, -200px) rotate(180deg);
    }
}
@keyframes animationFrameFive{
    0%{
        transform: translate(61px, -99px) rotate(0deg);
    }
    21%{
        transform: translate(4px, -190px) rotate(38deg);
    }
    41%{
        transform: translate(-139px, -200x) rotate(74deg);
    }
    60%{
        transform: translate(-263px, -164px) rotate(108deg);
    }
    80%{
        transform: translate(-195px, -49px) rotate(144deg);
    }
    100%{
        transform: translate(-1px, 0px) rotate(180deg);
    }
}
@keyframes animationFrameSix{
    0%{
        transform: translate(-10px, -280px) rotate(0deg);
    }
    20%{
        transform: translate(-150px, -90px) rotate(40deg);
    }
    40%{
        transform: translate(-280px, 100px) rotate(76deg);
    }
    60%{
        transform: translate(-320px, -120px) rotate(108deg);
    }
    80%{
        transform: translate(-170px, -190px) rotate(144deg);
    }
    100%{
        transform: translate(-10px, -280px) rotate(180deg);
    }
}