/*--------------------- Copyright (c) 2025 ----------------------- [Master Stylesheet] Project: Ayurveda Version: 1.0.0 Author: Template Bundle ------------------------------------------------------------------- [Table of contents] 1. Global CSS Start 2. Comman CSS Start 3. Preloader CSS Start 4. Header CSS Start 5. Banner CSS Start 6. About CSS Start 7. Service CSS Start 8. Our Service CSS Start 9. Our Team CSS Start 10. Testimonial Start 11. Counter CSS Start 12. Shop CSS Start 13. Partners CSS Start 14. Footer CSS Start 15. Responsive CSS Start -------------------------------------------------------------------*/ /******************************************************** 1. Global CSS Start ********************************************************/ body { color: var(--main-pc-text); background: var(--main-bg-color); } a, a:hover, a:focus { color: var(--main-link-color); } .white-header { background-image: unset !important; background: var(--white-color) !important; } #scroll { position: fixed; right: 15px; bottom: 15px; cursor: pointer; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; z-index: 9; visibility: hidden; -webkit-transform: translateY(150px); -ms-transform: translateY(150px); transform: translateY(150px); background: var(--primary-color); } #scroll.active { visibility: visible; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); animation: bounceInDown 2s; -webkit-animation: bounceInDown 2s; -moz-animation: bounceInDown 2s; } /******************************************************** 2. Comman CSS Start ********************************************************/ :root { --main-black: #000000; --white-color: #ffffff; --primary-color: #6c8d3c; --heading-color: #493534; --secondary-color: #974E13; --text-color: #474848; --main-link-color: #5a647a; } body { font-family: "Nunito", serif; font-weight: 400; font-size: 16px; line-height: 1.5; color: var(--text-color); -webkit-font-smoothing: antialiased; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } *, *:before, *:after { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } a:hover, a:focus { color: var(--primary-color); font-size: 16px; font-weight: 400; text-decoration: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } h1, h2, h3, h4, h5, h6 { color: var(--heading-color); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; margin: 0; padding: 0; text-transform: capitalize; } img { max-width: 100%; } input, textarea, select, button, label, svg, svg path, svg rect, svg polygon, img, a, :after, :before, :hover, :focus, .form-control:focus { outline: none !important; box-shadow: none; } ul { padding: 0; margin: 0; list-style-type: none; } p { margin: 0px; font-weight: 500; font-size: 16px; } .container { max-width: 1200px; } a { text-decoration: none; } /* button css */ .pc_banner_left_content .pc_green_btn a { margin: 0; } .pc_green_btn a { max-width: fit-content; background-color: var(--primary-color); color: var(--white-color); border: solid 2px var(--primary-color); padding: 10px 20px; margin: auto; /* height: 45px; */ width: auto; text-align: center; transition: all 0.5s; font-weight: 500; display: flex; align-items: center; border-radius: 30px; } .pc_green_btn a:hover { background-color: var(--white-color); ; color: var(--primary-color); border: solid 2px var(--primary-color); } .pc_main_pink_btn a { background-color: var(--primary-color); color: var(--white-color); border: solid 2px var(--primary-color); padding: 11px 25px; height: 50px; width: auto; text-align: center; transition: all 0.5s; font-weight: 500; display: inline-block; border-radius: 6px; } .pc_main_pink_btn a:hover { background-color: var(--white-color); ; color: var(--primary-color); border: solid 2px var(--primary-color); } ::-webkit-input-placeholder { color: #a5a5a7; } .pc_blog_wrapper_img_none { background-image: none !important; } /******************************************************** 3. Preloader CSS Start ********************************************************/ .preloader_active .preloader_holder { background-color: var(--main-bg-color); } .preloader_active .preloader_holder .preloader span { box-shadow: 0px 0px 0px 0px var(--primary-color); } @-webkit-keyframes loadingCircles { 0% { -webkit-transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px var(--primary-color); } 100% { -webkit-transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px var(--primary-color); } } @-moz-keyframes loadingCircles { 0% { -moz-transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px var(--primary-color); } 100% { -moz-transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px var(--primary-color); } } @keyframes loadingCircles { 0% { transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px var(--primary-color); } 100% { transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px var(--primary-color); } } .preloader_open:before, .preloader_open:after { background-color: var(--main-bg-color); } /******************************************************** 4. Header CSS Start ********************************************************/ .pc_main_header_wrapper { position: absolute; top: 30px; left: 0; right: 0; z-index: 9; } .pc_main_header_wrapper .container { max-width: 1200px; } .pc_main_header_box { background-color: #fff; border-radius: 10px; padding: 0px 10px; height: 90px; } @keyframes animate { 0% { background-position: left 0px top 0px; } 25% { background-position: left 150px top -150px; } 50% { background-position: left 300px top -300px; } 75% { background-position: left 150px top -150px; } 100% { background-position: left 0px top 0px; } } .pc_banner_wrapper .container { max-width: 1200px; margin: auto; } .pc_banner_right_img { animation: mover 2s infinite alternate; } @keyframes mover { 0% { transform: translateY(0); } 100% { transform: translateY(-10px); } } .pc_nav_items ul { display: flex; align-items: center; gap: 30px; } .main_menu_wrapper>ul>li>a { color: var(--heading-color); text-transform: capitalize; position: relative; margin: 0 0px; font-size: 16px; font-weight: 600; display: block; } ul.sub_menu li a:hover { color: var(--primary-color); } .main_menu_wrapper>ul>li { position: relative; } .main_menu_wrapper>ul>li.active>a { color: var(--primary-color); } .main_menu_wrapper>ul>li.active>a:before { position: absolute; content: ''; width: 90%; bottom: 0; height: 1px; left: 0; right: 0; margin: auto; border-radius: 30px; background: #6c8d3c; } .main_menu_wrapper>ul>li.active>a:after { position: absolute; content: ''; width: 90%; bottom: 0; height: 1px; left: 0; right: 0; margin: auto; border-radius: 30px; background: #6c8d3c; } .main_menu_wrapper>ul>li.active>a:after { bottom: -3px; width: 65%; } .main_menu_wrapper>ul>li>a, .main_menu_wrapper>ul>li:hover>a:before { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .main_menu_parent { display: flex; align-items: center; margin-left: auto; justify-content: end; gap: 30px; } .call_icon { background-color: var(--heading-color); padding: 18px 18px; border: 1px solid var(--heading-color); font-size: 18px; font-weight: 500; fill: #fff; transition: all 0.4s linear; border-radius: 6px 0 0 6px; } .call_number { color: #fff; background: var(--primary-color); padding: 18px 18px; border: 1px solid var(--primary-color); font-size: 18px; font-weight: 700; border-radius: 0 6px 6px 0; } /******************************************************** 4. Banner CSS Start ********************************************************/ .pc_banner_wrapper { background-image: url(../images/banner-bg.jpg); background-size: cover; background-repeat: no-repeat; background-position: bottom; position: relative; z-index: 1; width: 100%; padding: 200px 0 180px 0; } .pc_banner_left_text1 p { font-size: 18px; font-weight: 700; color: var(--primary-color); line-height: 1.5; padding-bottom: 10px; display: flex; align-items: center; gap: 8px; line-height: normal; } .pc_banner_left_text1 h1 { font-size: 52px; font-weight: 900; color: var(--heading-color); } .pc_banner_left_text1 h1>span { color: var(--primary-color); } .pc_banner_left_content { margin-top: 90px; } .pc_banner_btn { margin-top: 25px; } .pc_banner_form span { display: grid; } .pc_banner_form form { display: flex; } .pc_banner_form_section input { border: none; border-bottom: 1px solid transparent; height: 34px; } .pc_banner_form_section label { font-size: 16px; font-weight: bold; color: var(--heading-color); } .pc_banner_form span { display: grid; width: 100%; padding-right: 10px; } .pc_banner_form_section input:focus { border-bottom: 1px solid var(--secondary-color); } .pc_banner_form_section_box { display: flex; align-items: center; justify-content: center; gap: 50px; } .pc_banner_form { padding: 15px; max-width: 1170px; width: 100%; margin-top: 150px; border-radius: 6px; margin: 0 auto; margin-bottom: -80px; } .pc_banner_form_margin { bottom: 0px; left: 50%; transform: translate(-50%, 60px); margin: auto; position: relative; width: 100%; z-index: 1; margin-top: -200px; } input[type="text"] { color: var(--text-center); } .pc_banner_right_img img { margin: 60px auto 20px; -webkit-mask-size: 100% 100%; } .mt-100 { margin-top: 100px !important; } /******************************************************** 5. About CSS Start ********************************************************/ .pc_breadcrumb_wrapper { background-image: url(../images/brdcrmb-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 190px 0 0px 0; position: relative; height: 350px; } .pc_breadcrumb_title h1 { font-size: 40px; font-weight: 800; color: var(--primary-color); color: var(--white-color); } .pc_breadcrumb_title ul { display: flex; justify-content: center; align-items: center; gap: 5px; } .pc_breadcrumb_title ul li, .pc_breadcrumb_title ul li a { font-size: 18px; font-weight: 600; color: var(--white-color); } .pc_breadcrumb_title ul li:last-child { color: var(--primary-color); } .pc_about_img { max-width: 450px; width: 100%; } .pc_logo { width: 150px; } .ps_about_heading { font-size: 34px; font-weight: 800; padding: 10px 0; } .ps_about_heading>span { color: var(--primary-color); } .ps_about_text1 p { color: var(--primary-color); font-size: 18px; font-weight: 700; } p.ps_about_text2 span { text-decoration: underline; } .ps_about_list li { font-size: 16px; color: var(--text-center); font-weight: 400; line-height: 1.2; } .ps_about_body { margin-top: 80px; } h1.ps_about_heading { padding: 5px 0 10px; font-size: 34px; font-weight: 400; line-height: 1.5; } .ps_about_list { padding: 5px 0; } .ps_about_list ul li::before { content: "\2022"; color: var(--primary-color); font-weight: bold; display: inline-block; width: 1em; font-size: 22px; } .ps_about_btn { margin-top: 35px; } .pc_about_wrapper { margin: 235px 0 80px; } /******************************************************** 5.Banner Start *******************************************************/ /* .d_banner_section .d_banner_text { margin-left: 119px; position: relative; } .d_bannner_title { font-size: 28px; color: #3b3d60; font-weight: 600; letter-spacing: 5px; } .d_bannner_shadwtitle { opacity: 0; visibility: hidden; -webkit-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_shadwtitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } */ /* .d_banner_wrapper { position: relative; width: 100%; background-image: url(../images/index14/banner.jpg); background-position: center center; padding: 2px 0px 46px !important; height: 100%; } */ /* .d_bannner_mtitle { font-size: 90px; font-family: 'Dancing Script', cursive; color: var(--d-red-color); margin-top: 3px; } .d_bannner_stitle { font-size: 130px; text-transform: uppercase; color: var(--d-gray-color); padding-left: 127px; letter-spacing: 5px; } .d_bannner_shadwtitle { font-size: 150px; text-transform: uppercase; color: rgb(255 48 82 / 0.10); position: absolute; top: -100px; left: -57px; letter-spacing: 5px; } .d_banner_section { background-position: center; background-repeat: no-repeat; background-size: cover; /* background-color: var(--main-border-color); padding: 17% 0 10%; position: relative; } */ .d_banner_section.slide1 { background-image: url(../images/icon1.png); } .d_banner_section.slide2 { background-image: url(../images/icon2.png); } .d_banner_section.slide3 { background-image: url(../images/ic.jpg); } /* .d_banner_wrapper .pagination { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 60px; margin: auto; z-index: 2; display: flex; flex-direction: column; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: var(--d-red-color); transform: translateX(-30px); -webkit-transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .d_banner_wrapper .pagination .swiper-pagination-bullet { width: 60px; height: 2px; border-radius: 0; margin: 12px 0; position: relative; opacity: 1; background: #383a57; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:after { content: "01"; position: absolute; right: -30px; top: 50%; transform: translateY(-50%); font-weight: 700; font-size: 16px; color: var(--d-red-color); -webkit-transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(2):after { content: "02"; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(3):after { content: "03"; } .d_social>ul { display: flex; } .d_banner_social>ul { position: absolute; right: 60px; bottom: 30px; } .d_banner_social>ul>li { margin-left: 20px; } .d_banner_social>ul>li>a { color: #383a57; font-size: 17px; } .d_banner_social>ul>li>a:hover { color: var(--d-red-color); } */ /*animation css*/ /* .d_bannner_title { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_title { opacity: 1; visibility: visible; -webkit-transition-delay: 800ms; -o-transition-delay: 800ms; transition-delay: 800ms; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .d_bannner_mtitle { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateX(50px); -ms-transform: translateX(50px); transform: translateX(50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_mtitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1000ms; -o-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .d_bannner_stitle { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } .d_banner_wrapper .swiper-slide-active .d_bannner_stitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .d_banner_social>ul>li { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li { opacity: 1; visibility: visible; -webkit-transition-delay: 1500ms; -o-transition-delay: 1500ms; transition-delay: 1500ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(02) { -webkit-transition-delay: 1600ms; -o-transition-delay: 1600ms; transition-delay: 1600ms; } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(03) { -webkit-transition-delay: 1700ms; -o-transition-delay: 1700ms; transition-delay: 1700ms; } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(04) { -webkit-transition-delay: 1800ms; -o-transition-delay: 1800ms; transition-delay: 1800ms; } */ /******************************************************** 6. Service CSS Start ********************************************************/ .pc_service_box { text-align: center; background: var(--white-color); padding: 30px 25px 45px; position: relative; border-radius: 10px; } .pc_service_box:after { position: absolute; content: ""; bottom: 0; right: 0; left: 0; margin: auto; width: 0%; height: 4px; background-color: transparent; border-radius: 0 0 10px 10px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .pc_service_box:hover:after { opacity: 1; visibility: visible; width: 100%; background-color: var(--primary-color); } .pc_service_seperater { padding: 8px 0 5px; } .pc_service_box_body h3 { font-size: 20px; font-weight: 700; padding: 26px 0 0px; } .pc_service_heading h2 { font-size: 34px; font-weight: 400; margin: 0px auto 30px auto; text-align: center; width: 70%; line-height: 1.3; } .pc_service_slider_wrapper { margin-top: 60px; } .pc_service_box_btn a { font-size: 16px; font-weight: bold; color: var(--primary-color); /* border-bottom: 1px solid var(--primary-color); */ } .pc_service_wrapper { margin-bottom: 80px; padding: 0px 0 80px; } .pc_our_services_wrapper { padding: 50px 0 80px; } .pc_service_box_body p { padding: 10px 0; } .pc_service_heading h2 { padding: 5px 0 10px; font-size: 34px; font-weight: 800; width: 80%; margin-bottom: 0px; } .pc_service_heading h2>span { color: var(--primary-color); } .pc_service_button { cursor: pointer; } .pc_diff_slider_wrapper { position: relative; } .pc_service_wrapper .swiper-container { z-index: 0; overflow: hidden; padding: 0px 0; } .pc_service_wrapper .swiper-button-next1 svg { text-align: right; margin-right: 0; background: var(--primary-color); padding: 14px 10px; width: 45px; height: 45px; float: right; fill: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; top: calc(50% - 22.5px); right: -70px; border-radius: 6px; } .pc_service_wrapper .swiper-button-next1:hover svg { background: var(--white-color); fill: var(--text-color); border: 1px solid #dcdcdb; } .pc_service_wrapper .swiper-button-prev1 svg { margin-right: 0px; background: var(--primary-color); padding: 14px 10px; width: 45px; height: 45px; fill: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; top: calc(50% - 22.5px); left: -70px; border-radius: 6px; } .pc_service_wrapper .swiper-button-prev1:hover svg { background: var(--white-color); fill: var(--text-color); border: 1px solid #dcdcdb; } .pc_service_icon { padding: 20px 0 5px; } /******************************************************** 7. Our Service CSS Start ********************************************************/ .pc_service_types { padding-bottom: 40px; } /*=========video play button style start=========*/ .video-play-button { position: absolute; z-index: 0; bottom: 25%; left: 80px; transform: translateX(-50%) translateY(-50%); box-sizing: content-box; display: block; width: 32px; height: 44px; border-radius: 50%; padding: 18px 20px 18px 28px; } a#play-video { background: var(--primary-color); } .video-play-button:before { content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 80px; height: 80px; border-radius: 50%; animation: pulse-border 1500ms ease-out infinite; border: 1px solid var(--primary-color); } .video-play-button:after { content: ""; position: absolute; z-index: 1; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 90px; height: 90px; border-radius: 50%; animation: pulse-border 1500ms ease-out infinite; transition: all 200ms; border: 1px solid var(--primary-color); } .video-play-button img { position: relative; z-index: 3; max-width: 100%; width: auto; height: auto; } .video-play-button span { display: block; position: relative; z-index: 3; width: 0; top: 10px; left: 5px; height: 0; } @keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } .video-overlay { position: fixed; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.80); opacity: 0; transition: all ease 500ms; } .video-overlay.open { position: fixed; z-index: 1000; opacity: 1; } .video-overlay-close { position: absolute; z-index: 1000; top: 15px; right: 20px; font-size: 36px; line-height: 1; font-weight: 400; color: #fff; text-decoration: none; cursor: pointer; transition: all 200ms; } .video-overlay-close:hover { color: #fa183d; } .video-overlay iframe { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); box-shadow: 0 0 15px rgba(0, 0, 0, 0.75); } /*=========video play button style end=========*/ .pc_our_services_text1 p { color: var(--primary-color); font-size: 18px; font-weight: 700; } .pc_our_services_heading h2 { padding: 5px 0 10px; font-size: 34px; font-weight: 800; max-width: 450px; width: 100%; } .pc_our_services_heading h2>span { color: var(--primary-color); } .pc_service_type_box { margin-top: 30px; } .pc_service_type_box img { width: 70px; height: 70px; object-fit: contain; } .pc_service_type_box h5 { font-size: 18px; font-weight: bold; line-height: 1.5; padding: 20px 0 5px; } .pc_service_type_box:hover h5 { color: var(--primary-color); } .pc_our_services_img { position: relative; } .timmer .container { max-width: 900px; } /******************************************************** 8. Team CSS Start ********************************************************/ .pc_team_wrapper { padding: 70px 0 80px; background-image: url(../images/banner2.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; } .pc_team_slider_wrapper { position: relative; } .pc_team_wrapper .swiper-container { z-index: 0; overflow: hidden; } .pc_team_section { position: relative; background: var(--main-bg-color); transition: all 0.4s; overflow: hidden; text-align: center; /* margin: 20px 0; */ } .pc_team_img_wrapper { display: flex; } .pc_team_img { width: 180px; height: 180px; position: relative; border-radius: 50%; overflow: hidden; margin: auto; } .pc_team_img img { width: 100%; border-radius: 6px; } .pc_team_hover { background-color: #2d333b40; backdrop-filter: blur(8px); position: absolute; top: 0px; bottom: 90px; left: 0; right: 0px; height: 0; border: none; opacity: 0; visibility: hidden; display: flex; justify-content: center; align-items: center; font-weight: 500; border-radius: 6px; transition: all 0.4s; z-index: 1; } .pc_team_img_wrapper { position: relative; z-index: 1; } .pc_team_img_wrapper:hover .pc_team_hover { opacity: 1; visibility: visible; height: 100%; } /* .pc_team_info { background: transparent; opacity: 0; position: absolute; top: -56px; bottom: 90px; left: 0; right: 0px; transition: all 0.4s; } */ .social_icon:hover .pc_team_info { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); } .pc_team_section .pc_share_icon { position: absolute; right: 15px; bottom: 70px; z-index: 1; } .pc_team_info_icon { position: absolute; right: 15px; bottom: 30px; transform: scaleY(0); transform-origin: bottom; transition: all 0.5s; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; } .pc_partner_button { cursor: pointer; position: relative; } .pc_team_img_wrapper:hover .pc_team_info_icon { transform: scaleY(1); } .pc_team_inner { margin: 195px 0 15px 175px; text-align: center; color: var(--main-bg-color); } .pc_team_info:first-child { margin-bottom: 10px; padding-bottom: 10px; position: relative; } .pc_team_button { cursor: pointer; } /* .pc_team_info { width: 100%; display: inline-block; } */ .pc_team_info h6 { font-size: 20px; color: var(--main-primary-color); } .pc_team_info_icon a { width: 100%; width: 45px; height: 45px; border-radius: 100%; display: flex; justify-content: center; align-items: center; } .pc_fb_bg { background: #0b8ff3; } .pc_lnkdn_bg { background: #0794b3; } .pc_x_bg { background: var(--main-black); } .pc_team_img_wrapper, .pc_team_img_wrapper:hover, .pc_team_img_wrapper .pc_team_hover, .pc_team_img_wrapper:hover .pc_team_hover, .pc_team_button>div, .pc_team_button>div:hover, .pc_team_button>div svg, .pc_team_button>div:hover svg { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .pc_share_icon a { background: var(--primary-color); width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; border-radius: 100%; } .pc_team_identity>a { color: var(--heading-color); font-weight: bold; font-size: 20px; margin-top: 17px; display: inline-block; } .pc_heading h2 { padding: 5px 30px 10px; font-size: 34px; font-weight: 800; margin-bottom: 20px; } .pc_heading h2>span { color: var(--primary-color); } .text-center { text-align: left; padding: 0 25px 10px; } .pc_team_identity p { color: var(--primary-color); } .pc_team_identity { padding: 0 0px 15px; margin-top: 5px; } .pc_team_wrapper .swiper-button-next1 svg { text-align: right; margin-right: 0; background: var(--primary-color); padding: 14px 10px; width: 45px; height: 45px; float: right; fill: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; top: calc(50% - 22.5px); right: -70px; border-radius: 6px; } .pc_team_wrapper .swiper-button-next1:hover svg { background: var(--white-color); fill: var(--text-color); border: 1px solid #dcdcdb; } .pc_team_wrapper .swiper-button-prev1 svg { margin-right: 0px; background: var(--primary-color); padding: 14px 10px; width: 45px; height: 45px; fill: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; top: calc(50% - 22.5px); left: -70px; border-radius: 6px; } .pc_team_wrapper .swiper-button-prev1:hover svg { background: var(--white-color); fill: var(--text-color); border: 1px solid #dcdcdb; } /******************************************************** 9. Testimonial CSS Start ********************************************************/ .pc_testimonial_wrapper .pc_heading h2 { margin-bottom: 0; } .pc_testimonial_section { background-color: var(--white-color); border-radius: 10px; box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.05); padding: 30px; position: relative; } .pc_temnl_flex { display: flex; justify-content: flex-start; align-items: center; gap: 30px; } .pc_client_quote { max-width: 350px; } .pc_client_quote h4 { color: var(--heading-color); font-size: 16px; padding-top: 10px; font-weight: 700; } .pc_client_quote span { color: var(--primary-color); font-size: 14px; padding-left: 10px; } img.pc_testimonial_icon { position: absolute; left: 50%; top: 35px; } .pc_testimonial_button { cursor: pointer; } .pc_client_img_quote img { position: absolute; right: 10px; bottom: 10px; width: 80px; height: 80px; } img.pc_client_main_img { display: block; background-color: var(--primary-color); border-radius: 50px; width: 90px; height: 90px; object-fit: cover; border-radius: 100%; padding: 2px; } .pc_testimonial_wrapper { padding-top: 100px; background-image: url(../images/banner3.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; } .pc_testimonial_button { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 20px; } .pc_testimonial_button .swiper-button-next1, .pc_testimonial_button .swiper-button-prev1 { width: 45px; height: 45px; background: var(--primary-color); border-radius: 6px; display: flex; justify-content: center; align-items: center; border: 1px solid var(--primary-color); transition: all 0.4s; z-index: 1; } .pc_testimonial_button .swiper-button-prev1:hover, .pc_testimonial_button .swiper-button-next1:hover { background: var(--white-color); border: 1px solid #dcdcdb; } .pc_testimonial_button .swiper-button-prev1:hover svg, .pc_testimonial_button .swiper-button-next1:hover svg { fill: var(--text-color); } .pc_testimonial_button .swiper-button-next1 svg, .pc_testimonial_button .swiper-button-prev1 svg { fill: var(--white-color); transition: all 0.4s; } .pc_testimonial_icon_img { position: relative; z-index: 2; } .pc_testimonial_wrapper .swiper-container { z-index: 0; overflow: hidden; padding: 25px; } /******************************************************** 9. Counter CSS Start ********************************************************/ .pc_counter_wrapper { background-image: url(../images/banner5.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; padding: 80px 0 80px; position: relative; z-index: 0; margin-top: 80px; } .pc_counter_wrapper:after { content: ""; position: absolute; top: 0; width: 100%; height: 100%; opacity: 0.96; background: transparent; z-index: -1; } .pc_counter_icon svg { fill: var(--white-color); } .pc_counter_icon_box { text-align: center; } .pc_counter_icon p { width: 100px; height: 100px; border-radius: 100%; display: flex; justify-content: center; align-items: center; margin: 0 auto; position: relative; } p.pc_counter_icon1 { background: #6dd1ff; border: 10px solid #f9f9f9; position: relative; } p.pc_counter_icon1:after { content: ""; position: absolute; width: 100px; height: 100px; border: 1px dashed #6dd1ff; border-radius: 50px; top: -10px; left: -10px; animation-name: spin; animation-duration: 0.5s; animation-iteration-count: infinite; animation-timing-function: linear; } p.pc_counter_icon2 { background: #ffb064; border: 10px solid #f9f9f9; position: relative; } p.pc_counter_icon2:after { content: ""; position: absolute; width: 100px; height: 100px; border: 1px dashed #ffb064; border-radius: 50px; top: -10px; left: -10px; animation-name: spin; animation-duration: 0.5s; animation-iteration-count: infinite; animation-timing-function: linear; } p.pc_counter_icon3 { background: #e086ff; border: 10px solid #f9f9f9; position: relative; padding: 20px; } p.pc_counter_icon3:after { content: ""; position: absolute; width: 100px; height: 100px; border: 1px dashed #e086ff; border-radius: 50px; top: -10px; left: -10px; animation-name: spin; animation-duration: 0.5s; animation-iteration-count: infinite; animation-timing-function: linear; } p.pc_counter_icon4 { background: #ff7283; border: 10px solid #f9f9f9; position: relative; padding: 20px; } p.pc_counter_icon4:after { content: ""; position: absolute; width: 100px; height: 100px; border: 1px dashed #ff7283; border-radius: 50px; top: -10px; left: -10px; animation-name: spin; animation-duration: 0.5s; animation-iteration-count: infinite; animation-timing-function: linear; } .pc_counter_text h2 { padding: 20px 0px 10px; font-size: 28px; font-weight: 800; color: var(--title-color); } .pc_counter_text p { font-size: 18px; font-weight: 600; color: var(--heading-color); } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /******************************************************** 11. Pet Shop CSS Start ********************************************************/ .pc_shop_wrapper { margin-top: 70px; } .pc_shop_item_discount span { color: var(--white-color); padding: 5px 10px; text-align: center; font-size: 12px; font-weight: 300; border-radius: 4px; } .pc_shop_item_discount { position: absolute; left: 20px; top: 20px; z-index: 1; } .pc_shop_item_dis1 span { background: #6c8d3c; } .pc_shop_item_dis2 span { background: #6c8d3c; } .pc_shop_item_dis3 span { background: #6c8d3c; } .pc_shop_item_dis4 span { background: #6c8d3c; } .pc_shop_item_dis5 span { background: #6c8d3c; } .pc_shop_item_dis6 span { background: #6c8d3c; } .pc_shop_item_dis7 span { background: #6c8d3c; } .pc_shop_item_dis8 span { background: #6c8d3c; } h5.pc_shop_item_heading { font-size: 18px; font-weight: bold; } .pc_shop_item_content p { font-size: 14px; padding: 0px 0 5px; line-height: 1.5; } p.pc_shop_item_price { color: var(--primary-color); font-size: 18px; font-weight: 800; } .pc_shop_item_content { padding-top: 20px; } h5.pc_shop_item_heading:hover { color: var(--primary-color); } .pc_shop_btn { margin: 40px 0 0; } .pc_shop_img_box { position: relative; } .pc_shop_img_box .overlay { position: absolute; bottom: 0; left: 0; right: 0; background-color: #2d333b40; backdrop-filter: blur(8px); border-radius: 6px; overflow: hidden; z-index: 0; width: 100%; height: 0; transition: .5s ease; } .pc_shop_box:hover .overlay { height: 100%; } .pc_shop_img { width: 100%; } .pc_shop_box_text { position: absolute; width: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } /******************************************************** 12. Blog CSS Start ********************************************************/ .pc_blog_img_box { position: relative; } .pc_blog_text h3 { font-size: 18px; font-weight: 800; transition: all 0.3s; } .pc_blog_text h3:hover { color: var(--primary-color); } .pc_blog_text p { padding: 8px 0px; } .pc_single_blog_text p { text-align: justify; } .pc_blog_user a { transition: all 0.3s; } .pc_blog_user a:hover { color: var(--primary-color); } .pc_blog_user_comment img { padding-right: 5px; } .pc_blog_text_body { background: var(--white-color); padding: 12px 30px 25px 10px; border-radius: 0 0 8px 8px; } .pc_blog_comment a { transition: all 0.3s; } .pc_blog_comment a:hover { color: var(--primary-color); } .pc_blog_user_comment { display: flex; align-items: center; } .pc_blog_comment { padding-left: 40px; } .pc_blog_img img { transition: all 0.4s; position: relative; width: 100%; height: 275px; object-fit: contain; border-radius: 6px 6px 0 0; } .pc_blog_img:hover img { transition: all 0.4s; transform: scale(1.1); } .pc_blog_img { border-radius: 8px 8px 0 0; overflow: hidden; transition: all 0.4s; } .pc_blog_wrapper { margin-top: 80px; /* background: #6c8d3c; */ background-image: url(../images/banner3.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; padding: 80px 0; } .pc_shop_img { transition: 0.4s; border-radius: 6px; background: #f6f7fb; } .pc_shop_img:hover { filter: brightness(0.7); } /******************************************************** 13. Partners CSS Start ********************************************************/ .pc_partner_wrapper .swiper-container { z-index: 0; overflow: hidden; } .pc_partner_wrapper { padding: 80px 0 150px; } .pc_partners_container img { filter: grayscale(100%); } .pc_partners_container:hover img { filter: grayscale(0%); } .pc_partners_container:hover img, .pc_partners_container:hover, .pc_partners_container img, .pc_partners_container { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .pc_partner_button .swiper-button-next1 { margin-right: -100px; background: var(--primary-color); border-radius: 6px; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; color: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; right: 0; bottom: 25px; z-index: 1; } .pc_partner_button .swiper-button-next1:hover { background: transparent; border: 1px solid #a5a9b133; } .pc_partner_button .swiper-button-prev1 { margin-left: -100px; background: var(--primary-color); border-radius: 6px; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; color: #fff; border: 1px solid var(--primary-color); transition: all 0.4s; position: absolute; left: 0; bottom: 25px; z-index: 1; } .pc_partner_button .swiper-button-prev1:hover { background: transparent; border: 1px solid #a5a9b133; } .pc_partner_button .swiper-button-next1 svg, .pc_partner_button .swiper-button-prev1 svg { fill: var(--white-color); } .pc_partner_button .swiper-button-next1:hover svg, .pc_partner_button .swiper-button-prev1:hover svg { fill: var(--text-color); } /******************************************************** 14. Contact CSS Start ********************************************************/ .pc_contact_wrapper { position: absolute; width: 100%; background: var(--main-black); padding: 0px 0px 20px; top: 0px; } .cs_footer_logo { width: 150px; } .pc_contact_top_box { background: #6c8d3c; background-image: url(../images/feature.png); background-size: inherit; background-repeat: repeat; background-position: center; padding: 20px 10px; border-radius: 6px; margin-top: -50px; } .pc_contact_box h1 { color: var(--white-color); font-size: 18px; font-weight: 700; padding: 15px 0px 10px 0; } .pc_contact_box p { color: var(--white-color); font-weight: 300; font-size: 15px; } .pc_contact_box { text-align: center; } /* .pc_contact_wrapper .row { border-bottom: 1px solid #80808042; padding-bottom: 50px; } */ button.sal_btn.submitForm { background-color: var(--primary-color); color: var(--white-color); border: solid 2px var(--primary-color); padding: 10px 40px; height: 50px; width: auto; text-align: center; transition: all 0.5s; font-weight: 500; } button.sal_btn.submitForm:hover { background-color: var(--white-color); color: var(--primary-color); border: solid 2px var(--primary-color); } /******************************************************** 15. Footer CSS Start ********************************************************/ .cs_footer_wrapper { position: relative; background: var(--main-black); padding-top: 175px; } .cs_footer_icon a { width: 40px; height: 40px; border-radius: 100%; display: flex; justify-content: center; align-items: center; transition: all 0.3s; } .cs_footer_icon a:hover { transform: translateY(-5px); } .cs_footer_icon .pc_x_bg { background: #25272e; } .cs_footer_icon ul { display: flex; justify-content: flex-start; align-items: center; gap: 10px; } .cs_footer_icon h5 { font-size: 18px; font-weight: 600; color: var(--white-color); padding: 25px 0px 15px; } .cs_footer_section1 p { padding: 25px 0px 0px; color: var(--white-color); font-weight: 300; } .cs_footer_icon h5 { padding-top: 20px; } .pc_footer_widget_title { font-size: 20px; font-weight: 700; color: var(--white-color); padding: 15px 0px 25px; } .pc_footer_widget ul li { margin-bottom: 10px; position: relative; transition: all 0.3s; } .pc_footer_widget ul li:last-child { margin-bottom: 0; } .pc_footer_widget ul li::before { content: ''; position: absolute; top: 6px; left: 0; width: 10px; height: 10px; border-radius: 100%; background-color: var(--white-color); transition: all 0.3s; transform: scale(0); } .pc_footer_widget ul li:hover { padding-left: 18px; } .pc_footer_widget ul li:hover::before { transform: scale(1); } .pc_footer_widget ul li a { color: var(--white-color); } .cs_copyright { text-align: center; margin-top: 30px; border-top: 1px solid #202020; padding: 15px 0; } .cs_footer_logo a:hover { color: var(--white-color); } .cs_copyright p { color: var(--white-color); } .cs_copyright p a { color: var(--primary-color); } /******************************************************** Team Page ********************************************************/ .pc_team_grid .pc_heading h2 { margin-bottom: 0; padding-bottom: 0; } .pc_team_grid .text-center { padding: 0; } /******************************************************** Blog Page ********************************************************/ .pc_sidebar_search input[type="text"] { width: 100%; border: 1px solid #e6e6e6; height: 47px; padding: 0 40px 0 20px; position: relative; line-height: 50px; margin-bottom: 4px; border-radius: 6px; } .pc_sidebar_search a { position: absolute; top: 0; right: 0; background: var(--primary-color); color: var(--white-color); padding: 11px 15px; width: 47px; height: 47px; display: flex; justify-content: center; align-items: center; border-radius: 6px; } h4.pc_sub_heading.relative { font-size: 18px; font-weight: 800; margin-bottom: 10px; } .pc_category_field ul li { padding: 0 0 12px 0px; position: relative; justify-content: space-between; display: flex; flex-wrap: wrap; } .pc_sidebar_tags_box { margin-top: 22px; } .pc_latestPost_field { margin-top: 20px; } .pc_category_field a:hover { color: var(--primary-color); } .pc_sidebar_post { margin-top: 10px; margin-bottom: 30px; } .pc_sidebar_tags_box ul li { border: none; margin-bottom: 20px; display: inline-block; margin-right: 7px; } .pc_sidebar_search { position: relative; margin-bottom: 30px; } .pc_category_field a { color: #898d94; font-size: 16px; font-weight: 400; } .pc_latestPost_field li { display: flex; margin-bottom: 20px; } a.pc_blog_title:hover { color: var(--primary-color); } p.pc_blog_date { color: var(--primary-color); font-size: 16px; } .pc_blog_sidebar_tags { margin-top: 5px; } a.pc_blog_title { font-size: 16px; color: #898d94; } .pc_blog_title_wrap { width: 80%; margin-left: 15px; } a.ed_btn.ed_orange { color: var(--white-color); background: var(--primary-color); padding: 7px 10px; border: 1px solid var(--primary-color); transition: all 0.4s; border-radius: 6px; text-transform: capitalize; } a.ed_btn.ed_orange:hover { color: var(--primary-color); background: var(--white-color); padding: 7px 10px; border: 1px solid var(--primary-color); } .pc_blog_section2 { margin-top: 30px; } .blog_pagination_wrapper ul li { display: inline-block; font-size: 18px; } .pagination { display: -ms-flexbox; display: flex; padding-left: 0; list-style: none; border-radius: .25rem; justify-content: center; margin-top: 50px; } li.page-item a { color: var(--white-color); background: var(--primary-color); padding: 10px 15px; margin-right: 10px; border-radius: 6px; } li.page-item a:hover { z-index: 2; color: var(--primary-color); text-decoration: none; background-color: var(--white-color); border-color: var(--primary-color); } .page-link:focus { outline: none; box-shadow: none; } /******************************************************** Single Blog Page ********************************************************/ .pc_blockquote { display: flex; flex-wrap: wrap; align-items: center; } .pc_blockquote_img { width: 160px; margin-right: 10px; position: relative; } .pc_blockquote_img img.pc_quote_user { border: 2px solid var(--primary-color); border-radius: 6px; width: 130px; height: 130px; } .pc_quote_user { color: var(--main-link-color); font-weight: 700; font-size: 20px; width: 100%; display: inline-block; } .pc_blockquote_quote p, .pc_quote_user { text-align: left; } .pc_blockquote_quote { width: calc(100% - 170px); color: #898d94; position: relative; text-align: center; } .pc_blockquote_quote p, .pc_quote_user { text-align: left; } .pc_quote_user { color: #2c3e4a; font-weight: 700; font-size: 20px; width: 100%; display: inline-block; } .pc_quote_user>span { color: var(--main-txt-color); font-size: 16px; font-weight: 400; } .pc_img_text_container { display: flex; flex-wrap: wrap; align-items: center; } .pc_img_text_container img { width: 370px; display: inline-block; margin: 6px 15px 6px 0; border-radius: 6px; } .pc_img_text_container p { display: inline-block; width: calc(100% - 385px); } .pc_divider { margin: 22px 0; display: block; } .pc_author_message_box { background: var(--white-color); box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.05); border: none; border-radius: 6px; padding: 30px; display: flex; flex-wrap: wrap; align-items: center; margin: 74px 0 73px; color: var(--main-bg-color); } .pc_S_blog_wrapper { margin-top: 0; } .pc_author_image { width: 110px; height: 110px; overflow: hidden; margin-right: 30px; } .pc_author_image img { width: 110px; height: 110px; border: none; border-radius: 100%; object-fit: fill; } .pc_author_content { width: calc(100% - 140px); } .pc_author_content h5 { color: var(--main-bg-color); font-weight: 700; font-size: 20px; } .pc_author_content h5 span { font-weight: 400; font-size: 16px; } .pc_section_heading { font-size: 28px; margin-bottom: 35px; font-weight: 700; } .pc_blog_comment>ul>li { margin-bottom: 26px; display: inline-block; } .pc_comment_holder { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 30px; } .pc_comment_user { width: 100px; height: 100px; overflow: hidden; margin-right: 30px; } .pc_comment_user img { width: 100px; height: 100px; border: none; border-radius: 100%; object-fit: fill; } h5.pc_user_name { font-weight: 700; font-size: 18px; } .pc_comment_detail { width: calc(100% - 130px); } .pc_reply_btn { color: var(--primary-color); margin-left: 15px; } .pc_blog_comment ul li ul { padding-left: 80px; } .pc_reply_btn svg { width: 16px; fill: var(--primary-color); } .pc_comment_form .pc_section_heading { margin-bottom: 40px; } .pc_field_holder { margin-bottom: 30px; } .pc_form_field { width: 100%; border: 1px solid var(--main-border-color); padding: 0 20px; height: 50px; border-radius: 6px; display: flex; } textarea.pc_form_field { height: 150px; resize: none; padding: 12px 20px; } .pc_blog_single .pc_blog_text h3 { padding-top: 15px; } /******************************************************** 17. Contact CSS Start ********************************************************/ .pc_contact_form { padding: 50px 40px 50px 30px; box-shadow: 0 19px 38px rgb(255 255 255 / 7%), 0 15px 12px rgb(255 255 255 / 5%); margin-top: 40px; background: #f9f9f9; } .pc_contact_form .pc_sub_heading { margin-bottom: 30px; font-size: 26px; } .pc_sub_heading { padding-bottom: 10px; margin-bottom: 10px; font-weight: 700; font-size: 22px; text-transform: capitalize; } .pc_contact_form .pc_field_holder { margin-bottom: 30px; } .pc_form_field { width: 100%; border: 1px solid #e6e6e6; padding: 0 20px; height: 50px; border-radius: 6px; display: flex; } .pc_contact_form textarea.pc_form_field { height: 140px; } textarea.pc_form_field { height: 150px; resize: none; padding: 12px 20px; } .cs_map_wrapper { margin-top: 0; margin-bottom: 0; } iframe { width: 100%; border: none; } .pc_main_contact_wrapper { background: #f9f9f9; padding: 80px 0; } .pc_banner_form { position: relative; } .pc_shop_box { position: relative; z-index: 0; } .cs_map_section>div { font-size: 0; } .elementor-image-box-wrapper { padding: 15px; text-align: center; display: grid; justify-content: center; align-items: center; gap: 10px; border-style: dashed; border-width: 0px 1px 0px 0px; border-color: #acbf92; } .row>div:last-child .elementor-image-box-wrapper { border-right: none; } .elementor-image-box-wrapper img { width: 80px; height: 80px; margin: auto; } .elementor-image-box-wrapper p { color: #161616; font-size: 15px; font-weight: 500; line-height: 14px; } .elementor-image-box-wrapper h3 { color: #161616; font-size: 19px; font-weight: 700; margin-bottom: 12px; } .pc_call_btn .dm-more-menu-toggle a { position: relative; display: flex; cursor: pointer; align-items: center; gap: 10px; } .dm-more-menu-toggle a svg { width: 35px; height: 35px; background-color: var(--primary-color); fill: #fff; padding: 8px; border-radius: 50%; } .dm-pro-price { font-weight: 800; font-size: 20px !important; } .dm-pro-price del { font-weight: 600; color: #b0b0b0; padding-left: 3px; font-size: 16px !important; } .dm-pro-offer { color: #6abc6a; font-weight: 600; padding-left: 10px; font-size: 16px; } .dm-feature-box { box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 20px; text-align: center; background: #fff; position: relative; } .dm-feature-icon { margin-bottom: 20px; position: relative; transition: 0.3s; min-height: 87px; } .dm-feature-shape { width: fit-content; width: -moz-fit-content; margin: auto; overflow: hidden; } .dm-feature-shape img { z-index: 1; position: relative; } .dm-feature-shape svg { position: absolute; left: 0; right: 0; margin: auto; z-index: 0; fill: #f50056; } .dm-feature-shape svg { fill: #6c8d3c; } .dm-feature-icon>img, .dm-feature-icon>i, .dm-feature-icon>svg { width: 40px; height: 40px; z-index: 2; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; display: flex; justify-content: center; align-items: center; } .dm-feature-icon>i { font-size: 25px; color: #fff; } .dm-feature-title { font-size: 20px; font-weight: 700; padding-bottom: 14px; position: relative; width: fit-content; width: -moz-fit-content; margin: 0 auto 20px; display: inline-block; } .dm-feature-box p { font-size: 13px; padding-bottom: 0.7rem; margin-bottom: 0; word-break: break-word; text-align: center; } .dm-feature-title:after, .dm-feature-title:before, .dm-btn { background: #6c8d3c; } .dm-feature-title:after, .dm-feature-title:before { position: absolute; content: ''; width: 80%; bottom: 0; height: 2px; left: 0; right: 0; margin: auto; border-radius: 30px; } .dm-feature-title:after { bottom: -5px; width: 65%; } .dm-counter-icon { width: 90px; height: 90px; margin: 0 auto 0px; border-radius: 100%; box-shadow: 0px 5px 10px 0px rgb(0 0 0 / 0.07); display: flex; justify-content: center; align-items: center; border-top: 3px solid #f50056; background: #fff; } .dm-counter-icon { border-color: #6c8d3c; } .dm-counter-icon img { max-width: 100%; height: auto; width: 50px; } /* ******************************************************** 5.Banner Start ******************************************************* */ @keyframes slideInLeft { 0% { transform: translateX(-100%); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes slideInRight { 0% { transform: translateX(100%); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @keyframes slideInUp { 0% { transform: translateY(50px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .d_bannner_title.animate-left { animation: slideInLeft 1s forwards; } .d_bannner_mtitle.animate-right { animation: slideInRight 1s forwards; } .d_bannner_stitle.animate-up { animation: slideInUp 1s forwards; } .d_banner_section .d_banner_text { margin-left: 119px; position: relative; } .d_bannner_title { font-size: 18px; font-weight: 700; color: var(--primary-color); line-height: 1.5; padding-bottom: 10px; display: flex; align-items: center; gap: 8px; line-height: normal; } .d_bannner_shadwtitle { opacity: 0; visibility: hidden; -webkit-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_shadwtitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .d_banner_wrapper { position: relative; width: 100%; /* background-image: url(../images/index14/banner.jpg); */ background-position: center center; padding: 2px 0px 46px !important; height: 100%; } .banner_img { max-width: 700px; width: 100%; height: 450px; object-fit: contain; } .banner_img img { width: 100%; height: 100%; } .d_bannner_mtitle { font-size: 52px; font-weight: 900; color: var(--heading-color); } .d_bannner_stitle { font-size: 15px; text-transform: uppercase; color: var(--d-gray-color); /* padding: 10px 20px; */ letter-spacing: 0px; margin-bottom: 0px; } .d_bannner_shadwtitle { font-size: 150px; text-transform: uppercase; color: rgb(255 48 82 / 0.10); position: absolute; top: -100px; left: -57px; letter-spacing: 5px; } .d_banner_section { background-position: center; background-repeat: no-repeat; background-size: cover; /* background-color: var(--main-border-color); */ padding: 17% 0 10%; position: relative; } /* .d_banner_section.slide1 { background-image: url(../images/about.png); } .d_banner_section.slide2 { background-image: url(../images/abt-img.png); } .d_banner_section.slide3 { background-image: url(../images/banner2.jpg); } */ .d_banner_wrapper .pagination { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 60px; margin: auto; z-index: 2; display: flex; flex-direction: column; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: red; transform: translateX(-30px); -webkit-transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .d_banner_wrapper .pagination .swiper-pagination-bullet { width: 60px; height: 2px; border-radius: 0; margin: 12px 0; position: relative; opacity: 1; background: #383a57; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:after { content: "01"; position: absolute; right: -30px; top: 50%; transform: translateY(-50%); font-weight: 700; font-size: 16px; color: red; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(2):after { content: "02"; } .d_banner_wrapper .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:nth-child(3):after { content: "03"; } .d_social>ul { display: flex; } .d_banner_social>ul { position: absolute; right: 60px; bottom: 30px; } .d_banner_social>ul>li { margin-left: 20px; } .d_banner_social>ul>li>a { color: #383a57; font-size: 17px; } .d_banner_social>ul>li>a:hover { color: var(--d-red-color); } /*animation css*/ .d_bannner_title { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_title { opacity: 1; visibility: visible; -webkit-transition-delay: 800ms; -o-transition-delay: 800ms; transition-delay: 800ms; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .d_bannner_mtitle { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateX(50px); -ms-transform: translateX(50px); transform: translateX(50px); } .d_banner_wrapper .swiper-slide-active .d_bannner_mtitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1000ms; -o-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } .d_bannner_stitle { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } .d_banner_wrapper .swiper-slide-active .d_bannner_stitle { opacity: 1; visibility: visible; -webkit-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .d_banner_social>ul>li { opacity: 0; visibility: hidden; -webkit-transition: all 800ms ease; -o-transition: all 800ms ease; transition: all 800ms ease; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li { opacity: 1; visibility: visible; -webkit-transition-delay: 1500ms; -o-transition-delay: 1500ms; transition-delay: 1500ms; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(02) { -webkit-transition-delay: 1600ms; -o-transition-delay: 1600ms; transition-delay: 1600ms; } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(03) { -webkit-transition-delay: 1700ms; -o-transition-delay: 1700ms; transition-delay: 1700ms; } .d_banner_wrapper .swiper-slide-active .d_banner_social>ul>li:nth-child(04) { -webkit-transition-delay: 1800ms; -o-transition-delay: 1800ms; transition-delay: 1800ms; } /******************************************************** 17. Responsive CSS Start ********************************************************/ @media(min-width:1200px) { ul.sub_menu { display: block; } ul.sub_menu li { display: block; text-align: left; padding: 0; } ul.sub_menu li a { display: block; padding: 12px 20px 0; overflow: hidden; position: relative; color: var(--heading-color); text-transform: capitalize; font-size: 16px; font-weight: 600; } /* Header Menu */ ul.sub_menu { position: absolute; width: max-content; min-width: 200px; top: 45px; left: 0; z-index: 9; transform: translate(20px, 0px); transition: 0.3s; opacity: 0; visibility: hidden; border: none; border-radius: 0 0 10px 10px; padding: 0 0 15px; background: var(--white-color); /* box-shadow: 0px 6px 6px 0 rgba(0, 0, 0, 0.06); */ } /* Header Menu */ .main_menu_wrapper>ul>li:hover ul.sub_menu { transform: translate(0px, 0px); visibility: visible; opacity: 1; } header.pc_main_header_wrapper.pc_main_header_wrapper_fixed { position: fixed; top: 0; left: 0; right: 0; z-index: 9; background: var(--white-color); box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.05); } } @media only screen and (min-width: 1400px) and (max-width: 1480px) { .pc_banner_form span { margin-left: -25px; } } @media (max-width: 1400px) { .pc_banner_form { padding: 40px 20px 40px 20px; width: 100%; margin-top: 80px; margin-left: 0; } .main_menu_parent { margin-right: 10px; } .pc_banner_left_content { margin-top: 60px; } .pc_contact_wrapper { padding: 60px 0px; } .call_icon { padding: 18px 10px; } .call_number { padding: 18px 10px; } .pc_sidebar_search a { padding: 11px 15px; } .pc_sidebar_search input[type="text"] { height: 47px; } .pc_service_wrapper .swiper-button-next1 svg, .pc_service_wrapper .swiper-button-prev1 svg, .pc_team_wrapper .swiper-button-next1 svg, .pc_team_wrapper .swiper-button-prev1 svg, .pc_partner_button .swiper-button-prev1, .pc_partner_button .swiper-button-next1 { position: unset; } .pc_service_button, .pc_team_button, .pc_partner_button { display: flex; justify-content: center; align-items: center; gap: 10px; } .pc_partner_button { margin-top: 50px; } } @media (max-width: 1199px) { .menu_btn { width: 50px; height: 50px; display: flex; justify-content: center; flex-direction: column; border: 1px solid transparent; border-radius: 50%; } .menu_btn span { display: block; width: 18px; height: 2px; transition: 0.3s; margin: 0 auto 3px; background: var(--main-link-color); } .menu_btn_wrap.open .menu_btn span:nth-child(2) { opacity: 0; visibility: hidden; } .menu_btn_wrap.open .menu_btn span:nth-child(1) { transform: translate(0px, 4px) rotate(-48deg); } .menu_btn_wrap.open .menu_btn span:nth-child(3) { transform: translate(0px, -6px) rotate(48deg); } .main_menu_wrapper { position: fixed; left: -300px; top: 0; bottom: 0; width: 300px; z-index: 999; overflow: hidden; overflow-y: auto; background: var(--white-color); box-shadow: 2px 4px 28px 0px rgba(0, 0, 0, 0.1); } .pc_nav_items ul { flex-direction: column; gap: 0; } .main_menu_wrapper.open { left: 0; } .main_menu_wrapper, .main_menu_wrapper.open { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .main_menu_wrapper li { width: 100%; text-align: left; padding-bottom: 15px; border-bottom: 1px solid var(--main-border-color); } .main_menu_wrapper li.has_submenu { padding-left: 0; } .main_menu_wrapper li.has_submenu>ul { display: none; } .main_menu_wrapper li:last-child { border: none; padding-bottom: 0; } .main_menu_wrapper li>ul>li { padding-left: 25px; } .main_menu_wrapper ul>li>a { padding: 15px 20px 0px; width: 100%; } .main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after { position: absolute; bottom: 0; content: ''; } .main_menu_wrapper li.has_submenu:after { right: 21px; width: 12px; height: 2px; top: 25px; } .main_menu_wrapper li.has_submenu:before { right: 26px; width: 2px; height: 12px; top: 20px; } .main_menu_wrapper li.has_submenu.open::before { content: unset; } .main_menu_wrapper::-webkit-scrollbar { width: 3px; } .main_menu_wrapper::-webkit-scrollbar-track { background-color: var(--main-border-color); } .main_menu_wrapper::-webkit-scrollbar-thumb { background-color: var(--main-txt-color); } .main_menu_wrapper ul>li>a { padding: 12px 10px; } .call_number { padding: 12px 10px; font-size: 16px; font-weight: 600; } li.pc_call_info_box a p { display: flex; align-items: center; } .call_icon { padding: 0 10px; height: 50px; display: flex; justify-content: center; align-items: center; } .pc_call_btn { margin-left: 5px; } .main_menu_parent { margin-right: 0px; } .pc_main_pink_btn a { padding: 11px 10px; } .pc_banner_form_section input[type="text"] { width: 100%; } .pc_banner_form { width: 100%; margin-top: 60px; margin-left: 0px; } .pc_banner_form form { display: flex; } .pc_contact_wrapper { padding: 60px 0px; } .pc_service_button { right: 70px; top: -40px; } .video-play-button { bottom: 20%; left: 20px; } .pc_call_btn.menu_btn_wrap ul { display: flex; align-items: center; } .main_menu_wrapper li { width: 100%; text-align: left; padding-bottom: 15px; border-bottom: 1px solid #ececec; } .main_menu_wrapper li>ul>li { padding-left: 25px; } .main_menu_wrapper ul>li>a { padding: 15px 20px 0px; display: block; } .main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after { position: absolute; bottom: 0; content: ''; background: var(--primary-color); } .main_menu_wrapper li.has_submenu:after { right: 21px; width: 12px; height: 2px; top: 25px; } .pc_testimonial_section { padding: 30px 10px 30px 30px; } img.pc_client_main_img { width: 80px; height: 80px; } .pc_temnl_flex { gap: 20px; } .pc_client_img { max-width: 80px; width: 100%; } .pc_banner_left_content { margin-top: 0px; } .pc_banner_wrapper { padding: 150px 0 100px 0; } .pc_main_header_wrapper { top: 0; } } @media (max-width: 1024px) { .main_menu_parent { margin-right: 20px; } .main_menu_wrapper ul>li>a { padding: 12px 15px; } img.pc_testimonial_icon { left: 40%; top: 150px; } .cs_footer_section4 { margin-top: 30px; } .cs_footer_section5 { margin-top: 30px; } .main_menu_wrapper ul>li>a { padding: 12px 7px; } } @media (max-width: 991.98px) { .main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after { background: var(--primary-color); } .main_menu_wrapper li.has_submenu:before { right: 26px; width: 2px; height: 12px; top: 20px; } .main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after { position: absolute; bottom: 0; content: ''; } .fixed_header { position: relative; padding: 0; } .page_title_wrapper { padding: 41px 0 41px; } } @media (max-width: 991px) { .pc_banner_form { width: 100%; margin-top: 60px; margin-left: 0; } .main_menu_wrapper ul>li>a { padding: 15px 20px 0px; } .call_number { padding: 0px 10px; font-size: 14px; height: 50px; display: flex; justify-content: center; align-items: center; } .call_number:hover { padding: 14px 10px; font-size: 14px; } .main_menu_parent { margin-right: 0; } .pc_banner_form form { flex-wrap: wrap; } .pc_banner_form span { display: inline-block; margin-bottom: 10px; flex: 0 0 50%; } span.pc_header_form_btn.pc_main_pink_btn { margin-bottom: 0; } .pc_banner_form span:last-child { margin-bottom: 0; padding-bottom: 0; } .pc_banner_left_content { margin-top: 60px; } .video-play-button { top: 61%; left: 80px; } .pc_contact_wrapper { padding: 60px 0px; } .pc_logo { text-align: left; margin-right: 0; } img.pc_testimonial_icon { left: 40%; top: 150px; } .pc_about_img { text-align: center; } .pc_banner_right_img { margin-right: 0; margin-top: 60px; } .pc_contact_form { margin-right: 0; margin-bottom: 40px; } .pc_img_text_container { display: block; } .pc_img_text_container p { width: 100%; padding: 15px 0 0; } .pc_blog_comment ul li ul { padding-left: 0; } .pc_banner_left_text1 h1 { font-size: 40px; } .pc_about_wrapper { margin: 150px 0 60px; padding: 20px; } .pc_service_box { padding: 0px 20px 5px; } .pc_our_services_img { text-align: center; } .pc_testimonial_section { max-width: 510px; width: 100%; margin: auto; } .pc_testimonial_wrapper .pc_heading h2 { max-width: 600px; width: 100%; margin-left: auto; margin-right: auto; padding: 0; } .pc_testimonial_wrapper .swiper-container { padding: 25px 0 0 0; } .d_bannner_mtitle { font-size: 40px; font-weight: 900; color: var(--heading-color); } } @media (max-width: 767px) { .pc_contact_wrapper { padding: 60px 0px; } .pc_banner_form { width: 100%; margin-top: 60px; margin-left: 0; } .pc_banner_form form { display: block; } .pc_banner_form span { padding-bottom: 10px; } .pc_banner_left_content { margin-top: 60px; } .cs_footer_section4 { margin-top: 30px; } .cs_footer_section5 { margin-top: 30px; } .pc_blog_user_comment { display: block; } .pc_blog_comment { padding-left: 0; } .video-play-button { top: 20%; left: 15%; transform: translateX(0%) translateY(0%); } .pc_about_img { text-align: center; } .pc_logo { text-align: left; margin-right: 0; } .main_menu_parent { margin-right: 0; } .pc_client_quote { padding-right: 0px; } img.pc_testimonial_icon { left: 25%; top: 150px; } .pc_contact_box { padding-bottom: 10px; } .pc_banner_right_img { margin-right: 0; margin-top: 60px; } .pc_our_services_img { margin-top: 50px; text-align: center; } .cs_footer_section3 { margin-top: 30px; } .pc_sidebar_wrapper { margin-top: 50px; } .pc_blockquote { display: block; } .pc_blockquote_quote { width: 100%; margin: 15px 0 0; } .pc_img_text_container { display: block; } .pc_img_text_container p { width: 100%; } .pc_author_message_box { display: block; margin: 40px 0 43px; } .pc_author_content { width: 100%; padding: 13px 0 0; } .pc_comment_holder { display: block; } .pc_comment_detail { width: 100%; padding: 12px 0; } .pc_blog_comment ul li ul { padding-left: 0; } .ps_about_body { margin-top: 30px; } .pc_service_wrapper .swiper-container { padding: 0px 0 20px 0; } .pc_service_wrapper { padding: 50px 0; } .pc_contact_top_box .col-lg-4.col-md-4.col-sm-12.col-12:last-child .pc_contact_box { padding-bottom: 0; } .pc_banner_wrapper { padding: 60px 0 50px 0; } .pc_our_services_wrapper { padding: 20px 20px 40px; } .pc_contact_box h1 { font-size: 16px; padding: 5px 0px 5px; } } @media (max-width: 567px) { .pc_banner_form { width: 100%; margin-top: 60px; margin-left: 0; } .main_menu_parent { margin-right: 0; } .pc_banner_form form { display: inline-block; } .pc_about_img { text-align: center; } .pc_banner_form span { padding-bottom: 10px; } .pc_contact_wrapper { padding: 60px 0px; } .cs_footer_section4 { margin-bottom: 30px; } .cs_footer_section5 { margin-bottom: 30px; } .pc_call_btn { margin-left: 0; } .pc_banner_left_content { margin-top: 60px; } .pc_our_services_img { margin-top: 40px; } .main_menu_parent { margin-right: 0px; } .pc_banner_left_text1 h1 { font-size: 26px; } .pc_banner_left_text1 p { font-size: 14px; } .pc_logo { text-align: left; margin-right: 0; } .pc_service_heading.center h2 { padding: 5px 0 10px; font-size: 24px; width: 100%; } .cs_footer_section2 { margin-top: 30px; } .cs_footer_section3 { margin-top: 30px; } .cs_footer_section4 { margin: 0; } h2.ps_about_heading { font-size: 24px; } .pc_our_services_heading h2 { font-size: 24px; width: 100%; } .pc_heading h2 { padding: 5px 0px 0px; font-size: 24px; margin-bottom: 0; } .pc_shop_box { max-width: 350px; width: 100%; margin: auto; } .pc_client_quote { padding-right: 0px; } img.pc_testimonial_icon { left: 25%; top: 150px; } .pc_banner_right_img { margin-right: 0; margin-top: 60px; } .video-play-button { width: 60px; height: 60px; border-radius: 100%; display: flex; justify-content: center; align-items: center; padding: 0; } .video-play-button span { position: unset; width: auto; height: auto; } .video-play-button:before { width: 60px; height: 60px; } .video-play-button:after { width: 70px; height: 70px; } .pc_service_wrapper { margin-bottom: 50px; } .pc_team_wrapper { padding: 50px 0; } .pc_testimonial_wrapper .pc_heading h2 { max-width: 400px; margin: auto; width: 100%; } .pc_team_wrapper .pc_heading h2 { padding-bottom: 15px; max-width: 380px; width: 100%; margin: auto; } .pc_testimonial_wrapper { margin-top: 50px; } .pc_testimonial_wrapper .swiper-container { padding: 15px 0 0 0; } .pc_counter_wrapper { padding: 50px 0; margin-top: 50px; } .pc_counter_text h2 { padding: 15px 0px 0px; font-size: 28px; font-weight: 800; } .pc_counter_text p { font-size: 16px; } .pc_shop_wrapper { margin-top: 50px; } .pc_shop_wrapper .pc_heading h2 { padding-bottom: 0; } .pc_blog_wrapper { margin-top: 50px; padding: 50px 0; } .pc_partner_wrapper { padding: 50px 0; } .cs_copyright { margin-top: 10px; } .pc_footer_widget_title { padding: 15px 0px; } } @media (max-width: 480px) { .main_menu_parent { max-width: 170px; } .call_number { padding: 0px 10px; font-size: 13px; height: 35px; border-radius: 6px; } .call_icon { height: 40px; display: none; } .menu_btn { width: 30px; height: 30px; } .pc_call_btn.menu_btn_wrap ul { gap: 5px; } .pc_about_img { max-width: 300px; } .pc_temnl_flex { flex-direction: column; text-align: center; } .pc_client_img_quote img { right: 10px; bottom: auto; top: 10px; } .pc_blog_text_body { padding: 20px 10px 20px 15px; } } @media (max-width: 425px) { .pc_counter_text h2 { padding: 10px 0px 0px; font-size: 25px; } .pc_counter_text p { font-size: 14px; } .pc_counter_icon p, p.pc_counter_icon1:after, p.pc_counter_icon2:after, p.pc_counter_icon3:after, p.pc_counter_icon4:after { width: 80px; height: 80px; } } @media (max-width: 400px) { .pc_banner_form { width: 100%; margin-top: 50px; margin-left: 0; } .pc_banner_form form { display: inline-block; } .cs_footer_section3 { margin-bottom: 20px; } .pc_contact_wrapper { padding: 50px 0px; } .pc_call_btn { margin-left: 0; } .call_icon { padding: 15px 3px; font-size: 14px; } .cs_footer_section2 { margin-top: 30px; } .cs_footer_section5 { margin-top: 0; } .cs_footer_section4 { margin: 0 0 30px; } .pc_banner_left_content { margin-top: 40px; } .pc_logo { text-align: left; margin-right: 0; } .pc_our_services_heading h2 { font-size: 24px; width: 100%; } .pc_banner_left_text1 p { font-size: 14px; } img.pc_testimonial_icon { left: 25%; top: 150px; } .pc_client_quote { padding-right: 0px; } .pc_banner_right_img { margin-right: 0; margin-top: 60px; } .video-play-button { top: 20%; transform: translateX(0%) translateY(0%); } .pc_shop_wrapper .pc_heading h2 { padding-bottom: 0; margin-bottom: 10px; } } @media (max-width: 375px) { .main_menu_wrapper { width: 200px; } .cs_copyright p { font-size: 15px; } } @media (max-width: 300px) { .pc_client_quote { padding-right: 0px; } .pc_main_menu.main_menu_parent { text-align: center; margin-top: 20px; } .pc_banner_left_text1 p { font-size: 14px; } .pc_banner_right_img { margin-top: 40px; } .ps_about_text1 p { font-size: 14px; } h1.ps_about_heading { font-size: 24px; } .pc_heading h2 { padding: 5px 0px 10px; font-size: 24px; } .pc_counter_icon_box { margin-top: 20px; } .pc_shop_item_discount { left: 40px; top: 40px; } .pc_shop_box { margin-top: 20px; } .cs_footer_section2 { margin-top: 30px; } .cs_footer_section3 { margin-top: 30px; } .cs_footer_section4 { margin-bottom: 0px; margin-top: 0px; } .call_icon { padding: 15px 3px; font-size: 14px; } .call_number { padding: 15px 3px; font-size: 14px; } img.pc_testimonial_icon { left: 25%; top: 150px; } .pc_banner_right_img { margin-right: 0; margin-top: 60px; } } /* Banner Styles */ .pc_banner_wrapper { /* Remove background-image for better control in responsiveness */ position: relative; overflow: hidden; /* Ensure slides don't overflow */ /* Adjust padding as needed */ } .swiper-slide { display: flex; /* Use flexbox for easy arrangement */ align-items: center; justify-content: space-between; /* Distribute space between image and text */ } .pc_banner_left_content { flex: 0 0 50%; /* Occupy 50% width */ padding: 0 20px; /* Add padding for better spacing */ } .pc_banner_wrapper .swiper-button-prev { display: none !important; } .pc_banner_wrapper .swiper-button-next { display: none !important; } @media (max-width: 768px) { .swiper-slide { flex-direction: column; /* Stack image over text on smaller screens */ align-items: center; /* Center content */ text-align: center; /* Center text */ } .pc_banner_left_content { flex: 1 0 auto; width: 100%; padding: 0; margin-top: 20px; } .banner_img { flex: 1 0 auto; width: 100%; height: auto; margin-bottom: 20px; } .pc_banner_wrapper { padding: 150px 0 40px; /* Reduce padding on smaller screens */ } } /* paras css */ .my-img { height: 400px !important; object-fit: cover; } /* Write for us */ .custom-list-style { list-style-type: decimal; } .send_btn[disabled] { opacity: 0.6; cursor: not-allowed; } .send_btn { background-color: #6c8d3c; color: #ffffff; border: solid 2px #6c8d3c; padding: 10px 40px; height: 50px; width: auto; text-align: center; transition: all 0.5s; font-weight: 500; } .terms-and-condition-scroll-box { height: 200px; overflow-y: auto; border: 1px solid #ccc; padding: 8px; border-radius: 8px; background-color: #f9f9f9; } .custom-margin-bottom { margin-bottom : 100px; } /* Write for us end */