.service__inner:hover .thumb::after, .natureplant__gardingmake .item:hover .thumb::after, .feature__inner:hover .icon::after { animation: feature 5s infinite; } @keyframes feature { 100% { transform: rotate(180deg); } } body, button, input, select, optgroup, textarea { font-family: "Poppins", sans-serif; } .feature__inner .text p { font-family: "Public Sans", sans-serif; } .section__header span { font-family: "Manrope", sans-serif; } .blog__inner:hover .content .text h6 a, .blog__inner .content .text ul li i, .service__inner:hover .text a, .service__inner:hover .text h6 a, .natureplant__gardingmake .item .text span, .natureplant__content ul li i, .feature__inner:hover .text h6, .footer__link ul li:hover a, .footer__link ul li i, .header .menu-item-has-children.open > a::after, .header .menu-item-has-children.open > a::before, .header__nav .mainactive > ul li > ul li:hover::after, .header__bottom .right .ellepsis i, .header__bottom .right .bar i, .header__topcontent--topcontentpage2 .right ul li a i, .header__topcontent .left ul li .icon i, .section__header span { color: #1E1E1E; } .project__item:hover .content, .header__nav .mainactive > ul li > ul { visibility: visible; } .testmonial .thum { width: 80px; height: 80px; line-height: 80px; } .blog__inner:hover .thumb::after, .blog__inner:hover .thumb::before, .imghover:hover::after, .imghover:hover::before { opacity: 0; } .blog__inner .thumb::after, .blog__inner .thumb::before, .project__item:hover .content, .project__item .content, .swiper-pagination-bullet, .header__nav .mainactive > ul li > ul li:hover::after, .header__nav .mainactive > ul li > ul, .imghover::after, .imghover::before { opacity: 1; } .scrollToTop i{ font-size: 1.2rem; } .swiper-pagination-bullet, .pluse_1::after, .pluse_2::after { background: transparent; } .service--servicepage3, .banner--bannertwo::after, .banner--bannertwo { background: transparent !important; } .footer__link ul li i, .header__nav .mainactive > ul li > ul li a, .header__bottom .right .ellepsis, .header__bottom.header-fixed .ellepsis { transition: all 0.3s ease; } .project__item .content, .project__item:after, .feature__inner .icon img, .header__bottom.header-fixed, .header__bottom { transition: all 0.5s ease; } .testmonial .thum, body, button, input, select, optgroup, textarea { background: #fff; } .project--projectpage3, .natureplant--natureplantpage2, .header__topcontent--topcontentpage2 .right ul li a { background: #fff !important; } .feature__inner .icon, .header__bottom, .header, .partner__item, .section__header--header2 p { margin: auto; } .blog__inner .content .text ul, .natureplant__gardingmake .item, .natureplant__gardingmake, .natureplant__content ul, .footer__link ul, .header__nav .mainactive > ul, .header__bottom .right, .header__topcontent .right ul, .header__topcontent .left ul li, .header__topcontent .left ul, .header__topcontent, .nav-pills { display: flex; flex-wrap: wrap; } .header .menu-item-has-children > a, .scrollToTop i, .testmonial .thum, .skill, .request, .question, .process, .blog__inner .thumb, .blog, .feedback, .team, .project__item, .service__inner .thumb, .service, .natureplant__gardingmake .item .thumb, .natureplant, .feature__inner .icon, .custom-btn, .banner__content, .banner, .header__nav .mainactive > ul li > ul li, .header__nav .mainactive > ul li, .header__bottom, .imghover { position: relative; } .blog__inner .thumb::after, .blog__inner .thumb::before, .feedback::after, .project__item .content, .project__item:after, .service--servicepage3::before, .service--servicepage3::after, .service__inner .thumb::after, .natureplant .position, .natureplant__gardingmake .item .thumb::after, .feature__inner .icon::after, .header .menu-item-has-children > a::before, .header .menu-item-has-children > a::after, .imghover::after, .imghover::before, .pluse_1::after, .pluse_1::before, .pluse_2::after, .pluse_2::before, .pluse_1, .pluse_2, .custom-btn:before, .custom-btn:after { position: absolute; content: ""; } .blog__inner .thumb::after, .project__item .content, .header .menu-item-has-children > a::after, .header__nav .mainactive > ul li > ul li::after, .imghover::after, .pluse_1::after, .pluse_1::before, .pluse_2::after, .pluse_2::before, .pluse_1, .pluse_2 { top: 50%; } .blog__inner:hover .thumb::after, .blog__inner .thumb::before, .feedback::after, .project__item:after, .service--servicepage3::before, .service--servicepage3::after, .service__inner .thumb::after, .natureplant__gardingmake .item .thumb::after, .feature__inner .icon::after, .custom-btn:before, .custom-btn:after, .imghover:hover::after, .imghover::before, .preloader { top: 0; } .blog__inner .thumb::before, .project__item .content, .imghover::before, .pluse_1::after, .pluse_1::before, .pluse_2::after, .pluse_2::before, .pluse_1, .pluse_2 { left: 50%; } .blog__inner:hover .thumb::before, .blog__inner .thumb::after, .feedback::after, .project__item:after, .service--servicepage3::after, .service__inner .thumb::after, .natureplant__gardingmake .item .thumb::after, .feature__inner .icon::after, .custom-btn:before, .custom-btn:after, .imghover:hover::before, .imghover::after, .preloader { left: 0; } .blog__inner:hover .thumb::before, .blog__inner .thumb::after, .service--servicepage3::before, .custom-btn:before, .custom-btn:after, .imghover:hover::before, .imghover::after { right: 0%; } .blog__inner .thumb::after, .imghover::after { bottom: 50%; } .blog__inner:hover .thumb::after, .blog__inner .thumb::before, .custom-btn:before, .custom-btn:after, .imghover:hover::after, .imghover::before { bottom: 0%; } * { padding: 0; margin: 0; } .natureplant__content ul, .footer__link ul, .header__nav .mainactive > ul li > ul li, .header__nav .mainactive > ul li > ul, .header__nav .mainactive > ul li, .header__nav .mainactive > ul, .header__topcontent .right ul, .header__topcontent .left ul { padding: 0 !important; margin: 0 !important; } .blog__inner .thumb, .blog__inner, .project__item .content, .project__item:after, .project__item, .banner__content, .blog__inner .content .text h6 a, .blog__inner .content .text h6, .custom-btn { overflow: hidden; } .header__bottom .right .ellepsis i, .header__bottom .right .bar i { cursor: pointer; } a .testmonial .thum, .testmonial a .thum { width: 80px; height: 80px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .testmonial .thum img, .blog__inner .thumb a img, .project__item .thum img, .project__item .content, .project__item:after, .service__inner .thumb::after, .natureplant__gardingmake .item .thumb::after, .feature__inner .icon::after, .header__nav .mainactive > ul li > ul li a, .pluse_1, .pluse_2, .preloader, input, textarea, select, .blog__inner .content .text h6 a, .blog__inner .content .text h6 { width: 100%; } .header--headerpage2 { width: 100% !important; } .feedback::after, .project__item:hover:after, .project__item:after, .service--servicepage3::before, .service--servicepage3::after, .service__inner .thumb::after, .natureplant__gardingmake .item .thumb::after, .feature__inner .icon::after, .pluse_1, .pluse_2, .preloader { height: 100%; } .swiper-button-next:after, .swiper-button-prev:after { font-weight: 900; } .service__inner .text a, .natureplant__gardingmake .item .text span, .custom-btn, .header__nav .mainactive > ul li a, .nav-pills .nav-link, .section__header span, h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6 { font-weight: 600; } .header__topcontent .left ul li .text p { font-weight: 500; } .service__inner .text p { font-weight: 400; } .blog__inner .content .text ul li a, .blog__inner .content .text ul li i, .blog__inner .content .text h6 a, .service__inner .text a, .footer__link ul li a, .custom-btn, .header__nav .mainactive > ul li a { text-decoration: none; } .header__nav .mainactive > ul, .header__topcontent, .nav-pills { justify-content: center; } .blog__inner .content .text ul, .natureplant__gardingmake .item, .header__nav .mainactive > ul, .header__bottom .right, .header__topcontent .right ul, .header__topcontent .left ul li, .header__topcontent .left ul, .header__topcontent { align-items: center; } .blog__inner .content .text h6 a, .blog__inner .content .text h6 { display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .header__bottom.header-fixed .ellepsis { display: none; } .header__nav .mainactive > ul li > ul li a, .header__nav .mainactive > ul li a { display: block; } .project__btn a, .service__inner .text a, .natureplant__content a, .custom-btn, .header__nav .mainactive > ul li > ul li::after, .header__topcontent .right ul li a { display: inline-block; } .header__nav .mainactive > ul li > ul li:last-child, .header__topcontent--topcontentpage2 .left ul li:nth-child(2) { border: none; } .custom-btn, .header__nav .mainactive > ul li, .nav-pills .nav-link, .section__header h3, .section__header span, input::placeholder, textarea::placeholder, select::placeholder, h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6 { text-transform: capitalize; } .feedback::after, .project, .service--servicepage3::after, .footer { background-size: cover !important; } .feedback::after, .project, .service, .natureplant, .footer, .preloader { background-repeat: no-repeat !important; } .testmonial .thum, .custom-btn, .banner__content--contentpage3 p, .banner__content--contentpage3 h3, .header__nav .mainactive > ul li > ul li:hover > a, .header__nav .mainactive > ul li > ul li::after, .header__topcontent .right ul li a i, .swiper-button-next:after, .swiper-button-prev:after { color: #fff; } .header__topcontent--topcontentpage2 .left ul li .text p, .header__topcontent--topcontentpage2 .left ul li .icon i { color: #fff !important; } .testmonial .thum, body, button, input, select, optgroup, textarea { background: #fff; } .header__nav .mainactive > ul li a { color: #000000; } .testmonial .thum, body, button, input, select, optgroup, textarea { background-color: #fff; } .blog__inner .content .text ul li a, .service__inner .text a, .footer__link ul li a, .header__topcontent .left ul li .text p, .nav-pills .nav-link { color: #1E1E1E; } .blog__inner:hover .content .text h6 a, .blog__inner .content .text ul li i, .service__inner:hover .text a, .service__inner:hover .text h6 a, .natureplant__gardingmake .item .text span, .natureplant__content ul li i, .feature__inner:hover .text h6, .footer__link ul li:hover a, .footer__link ul li i, .header .menu-item-has-children.open > a::after, .header .menu-item-has-children.open > a::before, .header__nav .mainactive > ul li > ul li:hover::after, .header__bottom .right .ellepsis i, .header__bottom .right .bar i, .header__topcontent--topcontentpage2 .right ul li a i, .header__topcontent .left ul li .icon i, .section__header span { color: var(--first-color); } .swiper-pagination-bullet-active, body { background: #F8F5F0; } .custom-btn, .header .menu-item-has-children > a::before, .header .menu-item-has-children > a::after, .header__nav .mainactive > ul li > ul li:hover > a, .header__nav .mainactive > ul li > ul li a.active, .header__topcontent--topcontentpage2 .right ul li a:hover, .header__topcontent .right ul li a:hover, .nav-pills .nav-link.active { background: var(--first-color); } .header__top--toppage2 { background: var(--first-color) !important; } .project__btn, .service__inner .thumb, .natureplant__gardingmake .item .thumb, .feature__inner, .footer__bottom, .header__nav .mainactive > ul li > ul li::after, .header__topcontent .right ul li a, .partner__inner, .partner__item, .scrollToTop, .section__header--header2 { text-align: center; } .blog__inner .content .text ul li, .natureplant__content ul li, .footer__link ul li, .header__nav .mainactive > ul li, .header__topcontent .right ul li, .header__topcontent .left ul li { list-style: none; } .natureplant__gardingmake .item .text span, h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6 { margin-bottom: 0px; } .feature__inner .text h6 { margin-bottom: 10px; } .service__inner .text p { margin-top: 10px; } .footer__link ul li:hover i, .footer__link ul li a, .section__header span img { margin-left: 5px; } .footer__link ul li:hover i { margin-right: 5px; } .blog__inner .content .text ul li i, .natureplant__content ul li i, .footer__link ul li i, .header__topcontent .left ul li .icon i { margin-right: 10px; } .header--headerpage3 { margin-top: 0 !important; } .service__headerpage3 p { margin-top: 5px; } .service__inner .text a { margin-top: 15px; } .natureplant__gardingmake .item .text span, h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6 { margin-bottom: 0px; } .section__header h3, .section__header span { margin-bottom: 5px; } .natureplant__content p { margin-bottom: 30px; } .blog__inner .content .text ul { margin-top: 15px; margin-bottom: 15px; } input, textarea, select { padding: 15px; } .blog__inner .content .text ul { padding-left: 0 !important; } .header__nav .mainactive > ul>li:last-child>a { padding-right: 0; } .header__nav .mainactive > ul li > ul li::after { width: 15px; } .header__nav .mainactive > ul li > ul li::after { height: 15px; } .header__topcontent .right ul li a { width: 25px; } .header__topcontent .right ul li a { height: 25px; } .pluse_1::after, .pluse_2::after { width: 30px; } .pluse_1::after, .pluse_2::after { height: 30px; } .scrollToTop { width: 40px; } .scrollToTop { height: 40px; } .natureplant__gardingmake .item .thumb { width: 70px; } .natureplant__gardingmake .item .thumb { height: 70px; } .service__inner .thumb, .feature__inner .icon { width: 75px; } .service__inner .thumb, .feature__inner .icon { height: 75px; } .testmonial .thum { height: 80px; } .header__topcontent .right ul li a { line-height: 25px; } .scrollToTop { line-height: 40px; } .natureplant__gardingmake .item .thumb { line-height: 70px; } .service__inner .thumb, .feature__inner .icon { line-height: 75px; } .blog__inner, .project__item .thum, .nav-pills .nav-link { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } * { box-sizing: border-box; } body { margin: 0; padding: 0; } :root { scroll-behavior: auto !important; } body, button, input, select, optgroup, textarea { color: #555555; font-size: 1rem; line-height: 1.5; } h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, a h1, a h2, a h3, a h4, a h5, a h6 { clear: both; line-height: 1.3; font-family: "Poppins", sans-serif; color: #1E1E1E; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } h1 { font-size: calc(1.5rem + 3vw); } @media (min-width: 1200px) { h1 { font-size: 3.75rem; } } h2 { font-size: calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { h2 { font-size: 2.5rem; } } h3 { font-size: calc(1.35rem + 1.2vw); } @media (min-width: 1200px) { h3 { font-size: 2.25rem; } } h4 { font-size: calc(1.3125rem + 0.75vw); } @media (min-width: 1200px) { h4 { font-size: 1.875rem; } } h5 { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { h5 { font-size: 1.5rem; } } h6 { font-size: 1.25rem; } span, p { margin-bottom: 0px; font-weight: 400; font-size: var(--font-size); line-height: var(--line-height); color: #70717B; font-family: "Poppins", sans-serif; } a { color: #0066B3; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } a:visited { outline: none; } a:hover, a:focus, a:active { text-decoration: none; outline: none; } a:focus { outline: thin dotted; outline: none; } a:hover, a:active { outline: 0; } img { height: auto; max-width: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } select { border: 1px solid #D9D9D9; } ul li a.instagram { background: #e4405f !important; color: #fff !important; } input, textarea, select { outline: none; border: 1px solid rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1); } .section__header--header2 p { max-width: 585px; } .padding-block { padding-block: calc(1.875rem + 7.5vw); } @media (min-width: 1200px) { .padding-block { padding-block: 7.5rem; } } .swiper-button-next:after, .swiper-button-prev:after { font-size: calc(1.2625rem + 0.15vw); padding: 1.125rem calc(1.26875rem + 0.225vw); -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } @media (min-width: 1200px) { .swiper-button-next:after, .swiper-button-prev:after { font-size: 1.375rem; } } @media (min-width: 1200px) { .swiper-button-next:after, .swiper-button-prev:after { padding: 1.125rem 1.4375rem; } } .scrollToTop { position: fixed; bottom: -30%; right: 3%; z-index: 9; background: linear-gradient(99deg, var(--first-color) 25.27%, var(--first-color) 96.39%); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 24px; animation: lab_top_up 5s linear infinite; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 999999; } .scrollToTop i { color: #fff; z-index: 1; } @keyframes lab_top_up { 0% { transform: translateY(-15px); } 50% { transform: translateY(0px); } 100% { transform: translateY(-15px); } } .pluse_1, .pluse_2 { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: rgba(115, 182, 17, 0.1); } .pluse_1::after, .pluse_1::before, .pluse_2::after, .pluse_2::before { background: var(--first-color); border-radius: 50%; margin-left: -20px; margin-top: -20px; z-index: 0; } .pluse_1::after, .pluse_2::after { margin-left: -15px; margin-top: -15px; } .pluse_1:before, .pluse_2:before { width: 40px; height: 40px; } .pluse_1 { -webkit-animation: pluse_animate 3s infinite linear; animation: pluse_animate 3s infinite linear; } .pluse_2::before { -webkit-animation: pluse_animate 3s infinite linear; animation: pluse_animate 3s infinite linear; -webkit-animation-delay: 1s; animation-delay: 1s; margin-left: 0; margin-top: 0; } @keyframes pluse_animate { 0% { opacity: 1; -webkit-transform: translate(-50%, -50%) scale(0.3); transform: translate(-50%, -50%) scale(0.3); } 100% { opacity: 0; -webkit-transform: translate(-50%, -50%) scale(2); transform: translate(-50%, -50%) scale(2); } } @media (min-width: 1200px) { .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } } .partner__item { width: 120px; } @media (min-width: 768px) { .partner__item { width: 150px; } } @media (max-width: 767px) { .partner__inner img { width: 100%; margin-bottom: 40px; } } .nav-pills { gap: 15px; } @media (min-width: 992px) { .nav-pills { gap: 30px; } } .nav-pills .nav-link { font-size: 0.9375rem; padding: 10px 8px; border: 1px solid #F8F5F0; } @media (min-width: 992px) { .nav-pills .nav-link { font-size: 1.125rem; padding: 10px 20px; font-size: 1.125rem; padding: 15px 30px; } } .imghover { z-index: 2; } .imghover::before { right: 51%; background: rgba(255, 255, 255, 0.2); pointer-events: none; } .imghover::after { background: rgba(255, 255, 255, 0.3); pointer-events: none; } .imghover:hover::before { -webkit-transition: all 900ms linear; transition: all 900ms linear; } .imghover:hover::after { -webkit-transition: all 900ms linear; transition: all 900ms linear; } .header { max-width: 1400px; } @media (min-width: 1600px) { .header { margin-top: calc(1.4375rem + 2.25vw); } } @media (min-width: 1600px) and (min-width: 1200px) { .header { margin-top: 3.125rem; } } @media (min-width: 1200px) { .header--headerpage2 { position: absolute; left: 50%; z-index: 999; transform: translateX(-50%); width: 1400px; top: 0px; } } .header--headerpage2.propertynone { position: inherit; left: 0; width: 100% !important; transform: inherit; } .header--headerpage3 { max-width: 100% !important; } .header__top { border-bottom: 1px solid #EFEFEF; } @media (max-width: 1199px) { .header__top { display: none; } } @media (min-width: 992px) { .header__topcontent { justify-content: space-between; } } @media (max-width: 991px) { .header__topcontent { padding: 1.25rem 0 0.625rem 0; } } @media (max-width: 991px) { .header__topcontent .left ul { gap: 15px 20px; } } @media (max-width: 767px) { .header__topcontent .left ul { justify-content: center; } } @media (min-width: 992px) { .header__topcontent .left ul li:nth-child(2) { border-right: 1px solid #EFEFEF; border-left: 1px solid #EFEFEF; padding: 0.9375rem calc(1.28125rem + 0.375vw); margin: 0 calc(1.28125rem + 0.375vw); } } @media (min-width: 992px) and (min-width: 1200px) { .header__topcontent .left ul li:nth-child(2) { padding: 0.9375rem 1.5625rem; } } @media (min-width: 992px) and (min-width: 1200px) { .header__topcontent .left ul li:nth-child(2) { margin: 0 1.5625rem; } } @media (min-width: 768px) and (max-width: 991px) { .header__topcontent .right { margin-left: 1.25rem; } } @media (max-width: 991px) { .header__topcontent .right ul { justify-content: center; } } .header__topcontent .right ul li { padding: 0.875rem 0.625rem; } @media (min-width: 992px) { .header__topcontent .right ul li { padding: 0.875rem; border-right: 1px solid #EFEFEF; } } @media (min-width: 992px) { .header__topcontent .right ul li:first-child { border-left: 1px solid #EFEFEF; } } .header__topcontent .right ul li a { background: #1E1E1E; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } .header__topcontent .right ul li a i { font-size: 0.75rem; } @media (min-width: 992px) { .header__topcontent--topcontentpage2 { padding: 0; } } @media (max-width: 991px) { .header__topcontent--topcontentpage2 .left ul { display: flex; align-items: center; gap: 10px 25px; } } @media (min-width: 992px) { .header__topcontent--topcontentpage2 .left ul li:nth-child(2) { padding: 0.625rem 1.25rem; } } @media (min-width: 992px) { .header__topcontent--topcontentpage2 .left ul li:nth-child(2) { padding: 0.9375rem calc(1.28125rem + 0.375vw); border-right: 1px solid rgba(239, 239, 239, 0.3215686275); border-left: 1px solid rgba(239, 239, 239, 0.3215686275); } } @media (min-width: 992px) and (min-width: 1200px) { .header__topcontent--topcontentpage2 .left ul li:nth-child(2) { padding: 0.9375rem 1.5625rem; } } .header__topcontent--topcontentpage2 .right ul li { padding: 0.625rem; } @media (min-width: 992px) { .header__topcontent--topcontentpage2 .right ul li { padding: 0.9375rem; border-right: 1px solid rgba(239, 239, 239, 0.3215686275); } } @media (max-width: 991px) { .header__topcontent--topcontentpage2 .right ul li:first-child { padding-left: 0; } } @media (min-width: 992px) { .header__topcontent--topcontentpage2 .right ul li:first-child { border-left: 1px solid rgba(239, 239, 239, 0.3215686275); } } .header__topcontent--topcontentpage2 .right ul li a i { font-size: 0.75rem; } .header__bottom { max-width: 1400px; padding: 1.25rem 0.625rem; } .header__bottom--bottompage3 { max-width: 100%; } @media (min-width: 1200px) { .header__bottom.header-fixed { top: 0; width: 100% !important; position: fixed; max-width: inherit; z-index: 99999; box-shadow: 1px 1px 11px 3px rgba(215, 215, 215, 0.4); } } @media (min-width: 1200px) { .header__bottom { background: #F8F5F0; } } .header__bottom .right { justify-content:space-around; gap: 20px; } @media (min-width: 1200px) { .header__bottom .right { gap: 30px; } } .header__bottom .right .bar { width: 30px; } .header__bottom .right .bar i { font-size: calc(1.28125rem + 0.375vw); } @media (min-width: 1200px) { .header__bottom .right .bar i { font-size: 1.5625rem; } } .header__bottom .right .ellepsis i { font-size: 1.25rem; } @media (max-width: 1199px) { .header__nav .mobilelogo { background: var(--first-color); padding: 0.9375rem 1.25rem; border-bottom: 2px solid var(--first-color); } } @media (max-width: 1199px) { .header__nav.target { position: absolute; top: 0%; left: -100%; width: 70%; height: 100vh; z-index: 999; background: #fff; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; box-shadow: 1px 1px 11px 3px rgba(215, 215, 215, 0.4); } } .header__nav.open { left: 0%; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; } @media (max-width: 1199px) { .header__nav .mainactive.activescroll { width: 100%; } } @media (max-width: 1199px) { .header__nav .mainactive > ul { flex-direction: column; align-items: flex-start; } } .header__nav .mainactive > ul li { overflow: hidden; } @media (max-width: 1199px) { .header__nav .mainactive > ul li { width: 100%; border-bottom: 1px solid rgba(242, 246, 249, 0.53); overflow: visible; } } .header__nav .mainactive > ul li a { padding: 0.9375rem calc(1.3125rem + 0.75vw); font-size: 1rem; } @media (min-width: 1200px) { .header__nav .mainactive > ul li a { padding: 0.9375rem 1.875rem; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li a { display: inline-block; } } @media (max-width: 1199px) { .header__nav .mainactive > ul li a { width: 100%; border-bottom: 0.5px solid rgba(242, 246, 249, 0.12); } } @media (min-width: 1200px) { .header__nav .mainactive > ul li a:hover { color: #fff; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li:hover { overflow: visible; } .header__nav .mainactive > ul li:hover a { color: var(--first-color); } } .header__nav .mainactive > ul li > ul { left: 3%; top: calc(100% + 50px); z-index: 9999; width: 100%; } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul { background: var(--first-color); } } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul { left: 0; position: absolute; opacity: 0 !important; visibility: hidden; transition: all 0.5s ease; width: fit-content; } } @media (max-width: 1199px) { .header__nav .mainactive > ul li > ul { display: none; } } @media (max-width: 1199px) { .header .menu-item-has-children > a::after { position: absolute; top: 50%; transform: translateY(-50%); right: 16px; width: 12px; height: 2px; background: #1E1E1E; transition: all 0.3s ease; } .header .menu-item-has-children > a::before { position: absolute; top: 50%; transform: translateY(-50%); right: 21px; width: 2px; height: 12px; background: #1E1E1E; transition: all 0.3s ease; } .header .menu-item-has-children.open > a::before { transform: translateY(-50%) rotate(90deg); opacity: 0; } } .header__nav .mainactive > ul li > ul li { border-bottom: 1px solid rgba(242, 246, 249, 0.53); } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li::after { content: "\f054"; position: absolute; transform: translateY(-50%); left: 10px; font-family: "FontAwesome"; font-weight: 900; border-radius: 50%; font-size: 1em; line-height: 1; opacity: 0; visibility: visible; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; } } .header__nav .mainactive > ul li > ul li a { color: #1E1E1E; white-space: nowrap; padding: 0.75rem calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li a { padding: 0.75rem 2.5rem; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li a { padding: 0.75rem 1.25rem; color: #fff !important; } } .header__nav .mainactive > ul li > ul li a.active { color: #fff; } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li a.active { background: #1E1E1E; } } .header__nav .mainactive > ul li > ul li.menu-item-has-children > a::after { background: #fff; } .header__nav .mainactive > ul li > ul li.menu-item-has-children > a::before { background: #fff; } .header__nav .mainactive > ul li > ul li:hover > a { padding-left: calc(1.34375rem + 1.125vw); } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li:hover > a { padding-left: 2.1875rem; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li:hover > a { background: #1E1E1E; } } .header__nav .mainactive > ul li > ul li:hover::after { visibility: visible; } @media (max-width: 1199px) { .header__nav .mainactive > ul li > ul li ul { display: none; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li ul { position: absolute; left: 100%; top: calc(100% + 100px); } } @media (max-width: 1199px) { .header__nav .mainactive > ul li > ul li ul li a { padding: 0.9375rem 1.25rem 0.9375rem calc(1.375rem + 1.5vw); } } @media (max-width: 1199px) and (min-width: 1200px) { .header__nav .mainactive > ul li > ul li ul li a { padding: 0.9375rem 1.25rem 0.9375rem 2.5rem; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li > ul li:hover ul { top: 0; } .header__nav .mainactive > ul li > ul li:hover ul li a { padding-right: calc(1.53125rem + 3.375vw); } } @media (min-width: 1200px) and (min-width: 1200px) { .header__nav .mainactive > ul li > ul li:hover ul li a { padding-right: 4.0625rem; } } @media (min-width: 1200px) { .header__nav .mainactive > ul li:hover > ul { top: calc(100% + 0px); opacity: 1 !important; visibility: visible; } } .header .menu-item-has-children > a::after { transform: translateY(-50%); right: 25px; width: 10px; height: 2px; } .header .menu-item-has-children > a::before { top: 50%; transform: translateY(-50%); right: 29px; width: 2px; height: 10px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } @media (min-width: 1200px) { .header .menu-item-has-children > a::after { position: absolute; top: 50%; transform: translateY(-50%); right: 9px; width: 10px; height: 2px; background: #1E1E1E; } .header .menu-item-has-children > a::before { position: absolute; top: 50%; transform: translateY(-50%); right: 13px; width: 2px; height: 10px; background: #1E1E1E; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } } @media (min-width: 1200px) { .header .menu-item-has-children:hover > a:before { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; } } .header .menu-item-has-children:hover > a::after { background: var(--first-color); } @media (max-width: 1199px) { .header .menu-item-has-children.open > a:before { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; } } .banner__content { padding: calc(2.0625rem + 9.75vw) 0; } @media (min-width: 1200px){ .banner__content { padding: 17rem 0; } } .banner__content h3 { line-height: 1.1 !important; margin-bottom: 0.9375rem; -webkit-transform: translateY(-900px); -ms-transform: translateY(-900px); transform: translateY(-900px); -webkit-transition: 2.5s; -moz-transition: 2.5s; transition: 2.5s; font-size: calc(1.4375rem + 2.25vw); } @media (min-width: 1200px) { .banner__content h3 { font-size: 3.125rem; } } @media (min-width: 1200px) { .banner__content h3 { font-size: calc(1.53125rem + 3.375vw); } } @media (min-width: 1200px) and (min-width: 1200px) { .banner__content h3 { font-size: 4.0625rem; } } .banner__content p { -webkit-transform: translateY(-900px); -ms-transform: translateY(-900px); transform: translateY(-900px); -webkit-transition: 2.5s; -moz-transition: 2.5s; transition: 2.5s; } .banner .swiper-slide-active .banner__content h3 { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .banner .swiper-slide-active .banner__content p { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } .swiper-pagination-bullet { width: 15px; height: 15px; border: 1px solid #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .swiper-pagination-bullet-active { border: transparent; } .custom-btn { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; padding-inline: 2rem; line-height: 55px; z-index: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .custom-btn:before, .custom-btn:after { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: -1; } .custom-btn:before { right: calc(-60px - 5px); border-right: calc(60px + 5px) solid transparent; border-bottom: calc(60px + 5px) solid var(--second-color); transform: translateX(-100%); } .custom-btn:after { left: calc(-60px - 5px); border-left: calc(60px + 5px) solid transparent; border-top: calc(60px + 5px) solid var(--second-color); transform: translateX(100%); } .custom-btn:hover { color: #fff; border-color: var(--second-color); } .custom-btn:hover:before { transform: translateX(-49%); } .custom-btn:hover:after { transform: translateX(49%); } .footer__top { padding: calc(2.3125rem + 12.75vw) 0 calc(1.75rem + 6vw); } @media (min-width: 1200px) { .footer__top { padding: 6rem 0 6.25rem; margin-top: 5rem; } } .footer__about h6 { margin-bottom: calc(1.34375rem + 1.125vw); } @media (min-width: 1200px) { .footer__about h6 { margin-bottom: 2.1875rem; } } @media (min-width: 1200px) { .footer__link { margin: auto; max-width: 200px; } } .footer__link h6 { margin-bottom: calc(1.34375rem + 1.125vw); } @media (min-width: 1200px) { .footer__link h6 { margin-bottom: 2.1875rem; } } .footer__link ul { flex-direction: column; gap: 18px; } .footer__link ul li i { font-size: 0.9375rem; } .footer__bottom { padding: calc(1.3125rem + 0.75vw) 0; border-top: 1px solid rgba(0, 0, 0, 0.1098039216); } @media (min-width: 1200px) { .footer__bottom { padding: 1.875rem 0; } } @media (max-width: 991px) { .footer .row .col-lg-3 { margin-bottom: calc(1.3125rem + 0.75vw); } } @media (max-width: 991px) and (min-width: 1200px) { .footer .row .col-lg-3 { margin-bottom: 1.875rem; } } .feature__inner .icon { margin-bottom: calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { .feature__inner .icon { margin-bottom: 2.5rem; } } .feature__inner .icon::after { border: 1.7px solid var(--first-color); border-style: dashed; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } .feature__inner .text p { font-weight: 300; } .feature__inner:hover .icon::after { border: 1.9px solid var(--first-color); border-style: dashed; } .feature__inner:hover .icon img { transform: rotateY(180deg); } .feature__inner--innerpage3 { padding: calc(1.375rem + 1.5vw) calc(1.28125rem + 0.375vw); border: 1px solid #F8F5F0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } @media (min-width: 1200px) { .feature__inner--innerpage3 { padding: 2.5rem 1.5625rem; } } .feature__inner--innerpage3:hover { box-shadow: 0px 0px 15px 0px rgba(179, 181, 191, 0.6); } .natureplant { background-image: url("../image/bg.png"); padding: calc(1.6875rem + 5.25vw) 0rem calc(1.625rem + 4.5vw) 0rem; } @media (min-width: 1200px) { .natureplant { padding: 5.625rem 0rem 5rem 0rem; } } .natureplant__content { margin-top: 1.25rem; } .natureplant__content ul { gap: 15px 0; } @media (max-width: 767px) { .natureplant__content ul { flex-direction: column; } } @media (min-width: 768px) { .natureplant__content ul { align-items: center; } } @media (min-width: 768px) { .natureplant__content ul li { width: 40%; } } .natureplant__content a { margin-top: calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { .natureplant__content a { margin-top: 2.5rem; } } .natureplant__gardingmake { margin-top: calc(1.375rem + 1.5vw); gap: 30px; } @media (min-width: 1200px) { .natureplant__gardingmake { margin-top: 2.5rem; } } @media (min-width: 768px) { .natureplant__gardingmake { align-items: center; } } @media (max-width: 767px) { .natureplant__gardingmake { flex-direction: column; } } .natureplant__gardingmake .item { gap: 20px; } .natureplant__gardingmake .item .thumb::after { border: 1.7px solid var(--first-color); border-style: dashed; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } .natureplant__gardingmake .item .text span { font-size: calc(1.275rem + 0.3vw); } @media (min-width: 1200px) { .natureplant__gardingmake .item .text span { font-size: 1.5rem; } } .natureplant__gardingmake .item .text h6 { margin-top: 0.125rem; } .natureplant--natureplantpage2 { padding: calc(1.875rem + 7.5vw) 0; } @media (min-width: 1200px) { .natureplant--natureplantpage2 { padding: 7.5rem 0; } } .natureplant--natureplantpage3 { padding-top: 0; } @media (max-width: 1199px) { .natureplant--natureplantpage3 .row { flex-direction: column-reverse; } } .service { background-position: 93% 50%; } .service__wrapper p { margin-top: 0.9375rem; } .service__item { margin-top: calc(1.375rem + 1.5vw); } @media (min-width: 1200px) { .service__item { margin-top: 2.5rem; } } .service__inner { margin-top: 1.25rem; } .service__inner .thumb::after { border: 1.7px solid var(--first-color); border-style: dashed; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } @media (min-width: 768px) { .service__inner .text { margin-top: 1.25rem; } } @media (min-width: 1200px) { .service__inner .text p { max-width: 300px; } } .service__inner .text a i { font-size: 0.75rem; } .service__inner:hover .thumb img { transform: rotateY(180deg); } @media (min-width: 1200px) { .service--servicepage3::after { width: 30%; background-image: url("../images/index-sustainability.jpg"); background-position: center; } } @media (min-width: 1400px) { .service--servicepage3::after { width: 40%; } } .service--servicepage3::before { width: 60%; z-index: -1; } .project { background: url("../image/bg7.jpg"); background-position: center; } .project__item:after { background: rgba(0, 0, 0, 0.6); transform: scale(0); } .project__item .content { transform: translate(-50%, -50%) scale(0); } .project__item:hover:after { transform: scale(1.1); } .project__item:hover .content { transform: translate(-50%, -50%) scale(1.1); } .project__wrapper { margin-top: calc(1.53125rem + 3.375vw); } @media (min-width: 1200px) { .project__wrapper { margin-top: 4.0625rem; } } .project__btn { margin-top: calc(1.5rem + 3vw); } @media (min-width: 1200px) { .project__btn { margin-top: 3.75rem; } } .project__btn a { padding-inline: 2.5rem; } .team .section__wrapper { margin-top: calc(1.5625rem + 3.75vw); } @media (min-width: 1200px) { .team .section__wrapper { margin-top: 4.375rem; } } @media (min-width: 1200px) { .feedback::after { background-image: url("../image/bg9.jpg"); background-position: center; width: 48%; } } @media (min-width: 1366px) { .feedback::after { width: 50%; } } @media (min-width: 1200px) { .feedback .row { margin-left: calc(1.5625rem + 3.75vw); } } @media (min-width: 1200px) and (min-width: 1200px) { .feedback .row { margin-left: 4.375rem; } } @media (max-width: 1199px) { .feedback .row { flex-direction: column-reverse; } } .blog__inner .thumb { z-index: 2; } .blog__inner .thumb::before { right: 51%; background: rgba(255, 255, 255, 0.2); pointer-events: none; } .blog__inner .thumb::after { background: rgba(255, 255, 255, 0.3); pointer-events: none; } .blog__inner .content { padding: calc(1.28125rem + 0.375vw); } @media (min-width: 1200px) { .blog__inner .content { padding: 1.5625rem; } } .blog__inner .content .text ul { gap: 20px; } @media (min-width: 992px) { .blog__inner .content .text ul { gap: 40px; } } .blog__inner .content .text ul li i { font-size: 0.9375rem; } .blog__inner:hover .thumb::before { -webkit-transition: all 900ms linear; transition: all 900ms linear; } .blog__inner:hover .thumb::after { -webkit-transition: all 900ms linear; transition: all 900ms linear; } .blog__inner--innerpage3 .content { padding: calc(1.28125rem + 0.375vw) 1.25rem calc(1.34375rem + 1.125vw) 1.25rem; } @media (min-width: 1200px) { .blog__inner--innerpage3 .content { padding: 1.5625rem 1.25rem 2.1875rem 1.25rem; } } .blog__headerpage3 { margin-bottom: calc(1.5rem + 3vw); } @media (min-width: 1200px) { .blog__headerpage3 { margin-bottom: 3.75rem; } } @media (max-width: 1199px) { .question .section__wrapper { margin-top: calc(1.4375rem + 2.25vw); } } @media (max-width: 1199px) and (min-width: 1200px) { .question .section__wrapper { margin-top: 3.125rem; } } .request { padding: calc(1.75rem + 6vw) 0; } @media (min-width: 1200px) { .request { padding: 6.25rem 0; } } @media (min-width: 992px) { .request::after { background-image: url("../image/img.jpg"); position: absolute; content: ""; top: 0; left: 0; height: 100%; background-position: center; width: 40%; background-repeat: no-repeat; background-size: cover; } } .testmonial .thum { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } @media (max-width: 575px) { .testmonial .thum { margin: auto; } } @media(min-width:1200px){ .hostbanner{height: calc(100vh - 140px);} }