/**
Theme Name: Econowoodfloors
Theme URI: https://yourwebsite.com
Description: Child theme for Astra
Author: Your Name
Author URI: https://yourwebsite.com
Template: astra
Version: 1.0

/* Note: The CSS files are loaded from assets/css/ folder. */

:root {
    --ef-primary: #E7AC00;
    --ef-secondary: #2B5310;
    --ef-base: #FBF8F1;
    --ef-textcolor: #333;
    --ef-light-textcolor: #565656;
    --ef-textlink-white: #fff;
     --ef-textlink-black: #000;
}
@font-face {
  font-family: 'FaricyNew-Bold';
  src: url('assets/fonts/FaricyNew-Bold.otf') format('opentype'),
       url('assets/fonts/FaricyNew-Bold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FaricyNew-Medium';
  src: url('assets/fonts/FaricyNew-Medium.otf') format('opentype'),
       url('assets/fonts/FaricyNew-Medium.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'FaricyNew-Regular';
  src: url('assets/fonts/FaricyNew-Regular.otf') format('opentype'),
       url('assets/fonts/FaricyNew-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
.primary-color{
    color: var(--ef-primary) !;
}
.secondary-color{
    color: var(--ef-secondary) !important;
}
body{
    margin: 0;
    padding: 0;
    font-family: 'FaricyNew-Regular', Georgia, serif;
    color: var(--ef-textcolor);
    background: #FBF8F1;
	font-size:1rem;
}
.fw-bold{
    font-family: 'FaricyNew-Bold', Georgia, serif !important;
    font-weight: normal !important;
}
.fw-Medium{
    font-family: 'FaricyNew-Medium', Georgia, serif !important;
    font-weight: normal !important;
}
h1, .h1{
    font-size: 1.5rem;
    line-height: 1.75rem;
}
h2, 
.h2{
    font-size: 1.75rem;
    line-height: 2rem;
    font-family: FaricyNew-Bold;
}
p{
    font-size: 1rem;
    line-height: 1.875rem;
}

.btn-primary{
    border-radius: 30px;
    background: transparent;
    color: var(--ef-primary);
    border: solid 1px var(--ef-primary);
    text-transform: uppercase;
    padding-inline: 20px;
    font-size: 0.875rem;
}
.btn-primary:hover
{
    border-radius: 30px;
    background: var(--ef-primary);;
    color: #fff;
    border: solid 1px var(--ef-primary);
    text-transform: uppercase;
    padding-inline: 20px;
    font-size: 0.875rem;
}
.btn-base,
.btn-base:hover,
.btn-base.active,
.btn-base:active,
.btn-base:focus-visible{
  border-radius: 100px;
    background: #fff url(https://econowoodfloors.com/wp-content/uploads/2025/07/link-icon.svg) no-repeat 92% 50% !important;
    font-size: 1.25rem;
    line-height: 2rem;
    padding: 24px 60px 24px 24px;
    text-align: start;
    border:none;
	transition: all 0.5s ease;
	font-family: 'FaricyNew-Bold';
}
.btn-base.nextpage{
background: #fff url(https://econowoodfloors.com/wp-content/uploads/2025/07/nextpage-icon.svg) no-repeat 92% 50% !important;	
}
.btn-base:hover{
	background-position: 94% 50% !important;
}
.btn-base img{
    text-align: end;
    float: inline-end;
	margin-inline-end: 5px;
	transition: margin 0.5s ease;
}
.btn-base:hover img{
	margin-inline-end: 0px;
}
.text-link{
    text-decoration: none;
    font-size: 0.875rem;
    text-transform: uppercase;
    line-height: 2.375rem;
    color: var(--ef-primary);


}
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus-visible{
	font-size: 0.875rem;
	line-height: 1.5rem;
	background:transparent;
	border:none;
	color:#000;
	text-decoration:none;
}
.btn-secondary img{
	margin-inline-end: 5px;
	transition: margin 0.5s ease;
}
.btn-secondary:hover img{
	margin-inline-end: 0px;
}
@media (min-width: 1600px) {
 .container{ max-width: 1520px; }
}
@media (min-width: 1500px) {
 .container{ max-width: 1420px; }
}
/* Header section */

.header-top{
    padding: 8px 30px;
    color: #fff;
    font-size: 0.875rem;
}
.header-top a,
.header-top a:hover{
    color: #fff;
    text-decoration: none;
}
.header-section{
    padding: 18px 50PX;
    background: #FFF;
    box-shadow: 0px 2px 2px rgba(0,0,0, 0.15);
}
.sticky-top {
  top: 10px;
	position:fixed;
  z-index: 1020; 
	 padding: 8px 25PX;
}
.header-section.sticky-top a.logo-link img{
	width: 180px;
}
.header-section.sticky-top h1{
	font-size: 1rem;
    line-height: 1.25rem;
}
    
.home-link{
    background: url(https://citytechsoftware.in/wp/econowood/wp-content/uploads/2025/07/home-icon.svg) no-repeat 0 50%;
    padding-inline-start: 22px;
}

.CALL-link{
    background: url(https://citytechsoftware.in/wp/econowood/wp-content/uploads/2025/07/phone-icon.svg) no-repeat 0 50%;
    padding-inline-start: 22px;
    margin-inline-start: 5px;
}
.img-radius{
    border-radius: 16px;
}
/* banner section */
header:before{
	content:'';
	background: #000;
	background: linear-gradient(180deg,rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%);
	position:absolute;
	width:100%;
	height:100px;
	z-index:-1;
}

.top-slider .slick-dots{
bottom: -50px;	
}
.top-slider .slick-dots li{
    margin-inline: 0;
}
.slick-dots li button {
    font-size: 0.75rem;
}
.top-slider .slick-dots li button:before,
.top-slider .slick-dots li button:hover,
.top-slider .slick-dots li button:focus{
    font-size: 0.75rem;
    color: var(--ef-secondary) !important;
    opacity: 1 ;
}
.top-slider .slick-dots li.slick-active button:before{
    color: var(--ef-primary) !important;
}
.top-slider-item{
overflow: hidden;
aspect-ratio: 9 / 4;
}
.top-slider-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* home body */
.section-box{
    width: 100%;
    padding-top:60px;
    padding-bottom: 30px;
}

.bullet-list{
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.bullet-list li{
    background: url(https://citytechsoftware.in/wp/econowood/wp-content/uploads/2025/07/tick-icon.svg) 0 0 no-repeat;
    padding: 0 0 15px 25px;
}
.home-collection .collection-items{
	margin:0 15px;
}
.home-collection .slick-prev{
	left: 15px;
    z-index: 99;
}
.home-collection .slick-next{
	right: 35px;
    z-index: 99;
}
.home-collection .slick-prev:before,
.home-collection .slick-next:before{
	    font-size: 2.75rem;
}
#ast-scroll-top{
	width:42px;
	height:42px;
	background:url(https://econowoodfloors.com/wp-content/uploads/2025/07/go-top.svg) no-repeat 0 0;
	    position: fixed;
    bottom: 90px;
    right: 30px;
	cursor:pointer;
}
#ast-scroll-top svg{
	display:none;
}

/* inner page */
.breadcrumb-area{
	margin-top: -100px;
	margin-bottom: 100px;
    position: relative;
    z-index: 99;
}
.breadcrumb-area h3{
    display: inline;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.5rem;
	font-family: 'FaricyNew-Bold';
}
.back-btn{
    color: #fff;
    text-decoration: none;
    font-size: 0.875rem;
    background: url(https://econowoodfloors.com/wp-content/uploads/2025/07/back-icon.svg) no-repeat 0 50%;
    line-height: 1.5rem;
    padding: 0 5px 0 25px;
    text-transform: uppercase;
}
.collection-box .collection-items{
width:100%;
  aspect-ratio: 2 / 3; 
  overflow: hidden;
}
.collection-box .collection-items > img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* cover = fill with cropping, contain = fit inside */
}




/* footer */
#footerImg{
	max-width:100%;
}
.footer-top{
    background: var(--ef-secondary);
    border-radius: 0 0 60px 60px;
    padding: 70px;
    color: #fff;
}
body.contact-us .footer-top{
    background: transparent;
	color:#565656 !important;
}
.footer-top a,
.footer-top a:hover{
    color: #fff !important;
}
.hours-list{
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.hours-list li{
    line-height: 22px;
}
.hours-list li span{
    width: 120px;
    display: inline-block;
}
.contact-address{
    line-height: 30px;
}
.wpcf7 input:not([type=submit]),
.wpcf7 select, .wpcf7 textarea {
    width: 100%;
    padding: .5em !important;
}
.footer-top .form-label{
	color:#fff !important;
}

body.contact-us .footer-top .form-label,
body.contact-us .footer-top a,
body.contact-us .footer-top a:hover {
    color: #565656 !important;
}
.contact-us .slick-dots{
	display: none !important;
}

/* for top-video */
.top-video {
	margin-bottom: 30px;
}
.top-video .ratio-16x9 {
	--bs-aspect-ratio: 43.75%;
}
@media (max-width: 767px) {
.top-video .ratio-16x9 {
	--bs-aspect-ratio: 133.33%;
	overflow: hidden;
}
.top-video .ratio-16x9.ratio > * {
	width: auto;
}
}
/* for top-video */

/* for color-visualizer */
.color-visualizer {}
.color-visualizer .btn {
	width: 100%;
	border-radius: 0 0 16px 16px;
	text-align: center;
/* 	background: #fff url('https://econowoodfloors.com/wp-content/uploads/2025/07/link-icon.svg') no-repeat 92% 50% !important; */
/* 	padding-right: 4rem; */
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.5s ease;
	position: relative;
	padding-bottom: 22px;
}
.color-visualizer .btn::after {
	content: "";
	width: 32px;
	height: 32px;
	background: #fff url('https://econowoodfloors.com/wp-content/uploads/2025/07/link-icon.svg') no-repeat 92% 50% !important;
	/* position: absolute; */
	/* bottom: 0; */
	/* left: 50%; */
	/* transform: translate(-50%,-50%); */
	margin-left: 1rem;
	flex: 0 0 auto;
}
.color-visualizer .btn:hover {
	background-position: 94% 50% !important;
}
.color-visualizer a {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border-radius: 16px;
}
.color-visualizer a:hover {
	color: inherit;
}
.color-visualizer .wp-post-image {
	aspect-ratio: 4/5;
	object-fit: cover;
	object-position: left;
	border-radius: 16px 16px 0 0;
	display: block;
}

#footerTop {
  scroll-margin-top: 100px;
}
.color-visualizer .slick-slider {
/* 	padding-inline: 20px; */
}
.color-visualizer .slick-prev {
	left: 0;
}
.color-visualizer .slick-next {
	right: 0;
}
.color-visualizer .slick-prev, .color-visualizer .slick-next {
	width: 40px;
	height: 40px;
	z-index: 1;
}
.color-visualizer .slick-prev::before, .color-visualizer .slick-next::before {
	color: #ffffff;
	font-size: 40px;
}
.color-visualizer .slick-slide img {
	border-radius: 16px 16px 0 0;
}
/* for color-visualizer */

/* responsive  */
@media (max-width: 767px) {
	body{
	font-size:0.875rem;
}
	.header-section{
		padding:8px 15px;
	}
	.header-section a.logo-link img,
	.header-section.sticky-top a.logo-link img{
		width:112px;
	}
	
	.nav-text,
	.header-call span{
		display:none;
	}
	.top-slider-item {
    aspect-ratio: 3 / 4;
}
	
	.btn-primary,
	.btn-primary:hover{
		padding:4px 12px;
		padding-inline: 12px;
	}
	.text-link,
	.btn-primary,
	.btn-primary:hover{
    font-size: 0.75rem;
	}
	
	.btn-base,
	.btn-base:hover,
	.btn-base.active,
	.btn-base:active,
	.btn-base:focus-visible{
		    font-size: 1rem;
    line-height: 1.5rem;
    padding: 15px 50px 15px 20px;
	}
	
	h2,
	.h2 {
    font-size: 1.25rem;
    line-height: 1.5rem;
	}
	.breadcrumb-area h3,
	h5,
	.h5{
		font-size: 1.15rem;
	}
	p {
    font-size: 0.875rem;
    line-height: 1.5rem;
}
	.footer-top {
    padding: 50px 20px;
	}
	
	.head-right-link .me-3 {
    margin-right: 0.5rem !important;
	}
}
/*  responsive end */



