/**
Theme Name: EnvisionWorks Marketing
Author: Brainstorm Force
Text Domain: envisionworks-marketing
Template: astra
*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

* { margin: 0px; padding: 0px; outline: none; }

:root {
    --primary-color: #fbd34a; 
    --white-color: #ffffff;  
    --black-color: #000000;  
    --font-open-family: 'Open Sans', sans-serif !important;
    --font-weight-light: 300;  
    --font-weight-regular: 400;  
    --font-weight-medium: 500;  
    --font-weight-semibold: 600;
    --font-weight-bold: 700;  
	  --font-weight-extrabold: 800; 
    
}

body {  font-size:24px; line-height: 36px; color: var(--black-color); font-family: var(--font-open-family); font-weight: var(--font-weight-regular); background: #fff; letter-spacing: 0px; }

#page h1 { color: var(--black-color); font-family: var(--font-open-family); font-size: 90px; line-height: 100px; font-weight: var(--font-weight-extrabold); letter-spacing: 1px; text-transform: capitalize; }
#page h2{ color: var(--black-color); font-family: var(--font-open-family); font-size: 80px; line-height: 90px; font-weight: var(--font-weight-extrabold); letter-spacing: 1px; text-transform: normal; }
#page h3{ color: var(--black-color); font-family: var(--font-open-family); font-size: 30px; line-height: 40px; font-weight: var(--font-weight-bold); letter-spacing: 1px; text-transform: normal; }
#page h4{ color: var(--black-color); font-family: var(--font-open-family); font-size: 24px; line-height: 34px; font-weight: var(--font-weight-bold); letter-spacing: 1px; text-transform: uppercase;  }
#page h5 { color: var(--black-color); font-family: var(--font-open-family); font-size: 20px; line-height: 30px; font-weight: var(--font-weight-bold); letter-spacing: 0; text-transform: normal; }
#page h6{ color: var(--black-color); font-family: var(--font-open-family); font-size: 15px; line-height: 25px; font-weight: var(--font-weight-extrabold); letter-spacing: 0; text-transform: uppercase; }
#page p, #page .elementor-widget-container { font-size:24px; line-height: 36px; color: var(--black-color); font-family: var(--font-open-family); font-weight: var(--font-weight-regular); letter-spacing: 0px; height: auto;}


#page .white-title h1, #page .white-title h2, #page .white-title h3, #page .white-title h4, #page .white-title h5, #page .white-title h6, #page .white-title p, #page .white-title .elementor-widget-container { color: var(--white-color); }
#page h1 .regular-title, #page h2 .regular-title , #page h3 .regular-title, #page h4 .regular-title, #page h5 .regular-title, #page h6 .regular-title, #page p .regular-title, #page .elementor-widget-container .regular-title { font-weight:var(--font-weight-regular); font-family: var(--font-open-family);}
#page h1 .light-title, #page h2 .light-title , #page h3 .light-title, #page h4 .light-title, #page h5 .light-title, #page h6 .light-title, #page p .light-title, #page .elementor-widget-container .light-title { font-weight:var(--font-weight-light); font-family: var(--font-open-family);}

.yellow-color { color: var(--primary-color) !important; }

#page .cap-title h1, #page .cap-title h2, #page .cap-title h3, #page .cap-title h4, #page .cap-title h5, #page .cap-title h6, #page .cap-title p, #page .cap-title .elementor-widget-container { text-transform: uppercase; }

#page .btn-border .elementor-button:focus, #page .btn-border .elementor-button:focus-visible { border-width: 0px !important; }

#page .btn-border .elementor-button, #page .submit-center input[type="submit"] { display: inline-flex; align-items: center; background: transparent; padding: 0; border: none; font-weight: var(--font-weight-bold); font-size: 18px; color: var(--black-color); text-decoration: none; text-transform: uppercase; transition: all 0.3s ease;  } 

#page .btn-border .elementor-button::before, #page .cf7-submit p::before { content: ""; background-image: url('https://dockingstation.co.in/envisionworksmarketing/wp-content/uploads/2025/05/button-icon.webp'); background-repeat: no-repeat; background-position: center; background-size: cover; width: 60px; height: 60px; margin-right: 20px; display: inline-block; transition: transform 0.3s ease; } 
#page .btn-border .elementor-button:hover::before, #page .cf7-submit p:hover::before { transform: rotate(30deg); }

#page .btn-border .elementor-button span, #page .btn-border a.elementor-cta__button, #page .submit-center input[type="submit"] { display: inline-flex; transition: transform 0.3s ease; } 
#page .btn-border .elementor-button:hover span, #page .btn-border a.elementor-cta__button:hover, .submit-center input[type="submit"]:hover { transform: scale(1.1);  }


.wpcf7-spinner { display: none; }

input, textarea, select { font-family: var(--font-open-family); }


img { height:auto; max-width:100%; }
a { text-decoration: none; transition: all 0.3s ease; }
a:hover { transition: all 0.3s ease; }  

#colophon { display:none; }

/******Header*****/

.elementor-nav-menu .elementor-item { font-size: 16px; letter-spacing: 0px; line-height: 26px; text-transform: uppercase; color: var(--black-color); font-weight: var(--font-weight-regular); font-family: var(--font-open-family) !important; }

/*****Page styles****/
#page .elementor-flip-box__front h3, #page .elementor-cta__content h2 {  font-family: var(--font-open-family); font-size: 90px; line-height: 100px; font-weight: var(--font-weight-extrabold); letter-spacing: 1px; text-transform: capitalize; }

#page .elementor-flip-box:hover .elementor-flip-box__back img { transform: scale(1.1); opacity: 1; }

.slide-img .elementor-image-box-img img  { width: 275px; height: 175px; object-fit: contain; }

#page .slide-img .elementor-image-box-content p{ font-weight: 700; }

.large-title { color: var(--black-color); font-family: var(--font-open-family); font-size: 70px; line-height: 80px; font-weight: var(--font-weight-medium); letter-spacing: 1px; text-transform: normal; }

.mid-large-title { color: var(--black-color); font-family: var(--font-open-family); font-size: 60px; line-height: 70px; font-weight: var(--font-weight-bold); letter-spacing: 1px; text-transform: normal; }

.no-marker-list { list-style: none; padding: 0; margin: 0; }

#page .btn-border .elementor-cta__button { background-color: var(--white-color); padding: 10px 20px; border-radius: 0px; margin-top: 10px; }

#ast-scroll-top { background-color: var(--primary-color);  border-radius: 0px; color: var(--black-color); }


#page .auto-scroll-carousel .swiper-wrapper { 
transition-timing-function: linear !important; -webkit-transition-timing-function: linear !important;  will-change: transform; }


/****Footer*****/
#page .ftr-sec .elementor-widget-container { color: var(--black-color); font-family: var(--font-open-family); font-size: 20px; line-height: 30px; font-weight: var(--font-weight-regular); letter-spacing: 0; text-transform: normal; }
#page .ftr-sec .elementor-widget-container a{ color: var(--black-color); }
#page .ftr-sec .elementor-widget-container a:hover{ color: var(--primary-color); }

/***Contact Form***/

.cf7-row { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px; } 
.cf7-half { flex: 1 1 48%; } 
.cf7-row textarea, .cf7-row input, .cf7-row select { width: 100%; box-sizing: border-box; }
.checkbox-row label { font-size: 14px; line-height: 1.4; display: flex; align-items: center; gap: 10px; } 
.cf7-submit { margin-top: 20px; }
textarea.wpcf7-form-control.wpcf7-textarea, .cf7-row p { width: 100% !important; box-sizing: border-box; display: block; }

.wpcf7 input[type=tel], .cf7-row input, .cf7-row textarea, .cf7-row input, .cf7-row select { border-radius: 0px !important; border-width: 0px 0px 1px 0px !important; background: transparent !important; }

 .checkbox-center { display: flex; justify-content: center; text-align: center; }  .checkbox-center label { display: flex; align-items: center; gap: 8px; }  
.submit-center { text-align: center; } .submit-center input[type="submit"] { display: inline-block; }

 input::placeholder, textarea::placeholder { color: #bbbbbb !important; font-family: var(--font-open-family); }  
.checkbox-center label, .wpcf7 form .wpcf7-list-item-label { color: #bbbbbb !important; font-family: var(--font-open-family); }  
select, select option { color: #bbbbbb !important; font-family: var(--font-open-family); }

#page .submit-center input[type="submit"] { color: var(--white-color); }
#page .cf7-submit p { display: inline-flex; }


/*****Responsive*******/

@media (min-width: 1200px) and (max-width: 1728px) {
	.elementor-nav-menu .elementor-item { font-size: 13px; line-height: 23px;}
	.elementor-nav-menu--main .elementor-item  { padding-left: 3px !important; padding-right: 3px !important; }
}

@media (min-width: 1400px) and (max-width: 1499px) {


}


@media (min-width: 1025px) and (max-width: 1200px) {

#page h1 { font-size: 80px; line-height: 90px; }
#page h2, #page .elementor-flip-box__front h3, #page .elementor-cta__content h2 { font-size: 70px; line-height: 80px;  }
#page h3 { font-size: 28px; line-height: 38px; }
#page h4{ font-size: 24px; line-height: 34px; }
#page h5 { font-size: 20px; line-height: 30px; }
#page h6{ font-size: 15px; line-height: 25px;  }
	
.large-title { font-size: 60px; line-height: 70px; }
.mid-large-title { font-size: 50px; line-height: 60px; }

}

@media (min-width: 881px) and (max-width: 1024px) {

#page h1 { font-size: 64px; line-height: 74px; }
#page h2, #page .elementor-flip-box__front h3, #page .elementor-cta__content h2 { font-size: 60px; line-height: 70px;  }
#page h3 { font-size: 26px; line-height: 36px; }
#page h4{ font-size: 24px; line-height: 34px; }
#page h5 { font-size: 20px; line-height: 30px; }
#page h6{ font-size: 15px; line-height: 25px;  }

.large-title { font-size: 50px; line-height: 60px; }
.mid-large-title { font-size: 40px; line-height: 50px; }
	
}

@media (min-width: 768px) and (max-width: 880px) {

#page h1 { font-size: 62px; line-height: 72px; }
#page h2, #page .elementor-flip-box__front h3, #page .elementor-cta__content h2{ font-size: 60px; line-height: 70px;  }
#page h3{ font-size: 26px; line-height: 36px; }
#page h4{ font-size: 24px; line-height: 34px; }
#page h5 { font-size: 20px; line-height: 30px; }
#page h6{ font-size: 15px; line-height: 25px;  }
	
.large-title { font-size: 50px; line-height: 60px; }
.mid-large-title { font-size: 40px; line-height: 50px; }
	
}

@media (max-width: 767px) {
	
#page h1 { font-size: 60px; line-height: 70px; }
#page h2, #page .elementor-flip-box__front h3, #page .elementor-cta__content h2 { font-size: 50px; line-height: 60px;  }
#page h3{ font-size: 26px; line-height: 36px; }
#page h4{ font-size: 24px; line-height: 34px; }
#page h5 { font-size: 20px; line-height: 30px; }
#page h6{ font-size: 15px; line-height: 25px;  }
	
body, #page p, #page .elementor-widget-container { font-size:20px; line-height: 30px; }
	
.large-title { font-size: 40px; line-height: 50px; }
.mid-large-title { font-size: 30px; line-height: 40px; }
#page .ftr-sec .elementor-widget-container, , #page .ftr-sec .elementor-widget-container a { font-size: 16px; line-height: 26px; }
	
	
}


@media (max-width: 480px) {

#page h1 { font-size: 42px; line-height: 52px; }
#page h2, #page .elementor-flip-box__front h3, #page .elementor-cta__content h2 { font-size: 38px; line-height: 48px;  }
#page h3{ font-size: 24px; line-height: 34px; }
#page h4{ font-size: 22px; line-height: 32px; }
#page h5 { font-size: 20px; line-height: 30px; }
#page h6{ font-size: 15px; line-height: 25px;  }
	
body, #page p, #page .elementor-widget-container { font-size:18px; line-height: 28px; }
	
.large-title { font-size: 36px; line-height: 46px; }
.mid-large-title { font-size: 30px; line-height: 40px; }
#page .ftr-sec .elementor-widget-container, #page .ftr-sec .elementor-widget-container a { font-size: 16px; line-height: 26px; }
.slide-img .elementor-image-box-img img { width: 210px; height: 120px; }
	
}