/*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Utility # Cards # Common # Form # Navigations # Animations # Mobile Nav # Search Popup # Page Header # Google Map # Client Carousel --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Common --------------------------------------------------------------*/ /*== Default Css ==*/ :root { --thm-font: "Barlow", sans-serif; --thm-font-2: "Roboto", sans-serif; --thm-font-3: "Yantramanav", sans-serif; --thm-font-4: "Playfair Display", serif; --thm-base: #0b67b4; --thm-base-rgb: 217, 4, 41; --thm-gray: #444444; --thm-gray-rgb: 68, 68, 68; --thm-white: #ffffff; --thm-white-rgb: 255, 255, 255; --thm-black: oklch(0.396 0.141 25.723); --thm-black-rgb: 5, 29, 62; --thm-primary: #d90429; --thm-primary-rgb: 11, 103, 180; --thm-gray-bg: #ecf0f7; --thm-gray-bg-rgb: 236, 240, 247; --thm-main-bg: #1a060b; --accent-white: #f8f9fa; --primary-red: #d62839; --primary-blue: #003049; --btn-red: #d62839; --btn-red-hover: #ec2d40; --btn-blue: #0b67b4; --btn-blue-hover: #108ff7; } .auto-container { position: static; max-width: 1200px; padding: 0px 15px; margin: 0 auto; } .row { --bs-gutter-x: 30px; } .gutter-y-30 { --bs-gutter-y: 30px; } body { font-family: var(--thm-font); color: var(--thm-gray); font-size: 18px; line-height: 28px; font-weight: 400; } body.locked { overflow: hidden; } a { color: var(--thm-gray); } a, a:hover, a:focus, a:visited { text-decoration: none; } ::-webkit-input-placeholder { color: inherit; opacity: 1; } :-ms-input-placeholder { color: inherit; opacity: 1; } ::-ms-input-placeholder { color: inherit; opacity: 1; } ::placeholder { color: inherit; opacity: 1; } h1, h2, h3, h4, h5, h6 { color: var(--thm-black); font-family: var(--thm-font-2); font-weight: 700; margin: 0; } p { margin: 0; } dl, ol, ul { margin-top: 0; margin-bottom: 0; } ::-webkit-input-placeholder { color: inherit; opacity: 1; } :-ms-input-placeholder { color: inherit; opacity: 1; } ::-ms-input-placeholder { color: inherit; opacity: 1; } ::placeholder { color: inherit; opacity: 1; } .page-wrapper { position: relative; margin: 0 auto; width: 100%; min-width: 300px; overflow: hidden; } .container { padding-left: 15px; padding-right: 15px; } @media (min-width: 1200px) { .container { max-width: 1200px; } } ::-webkit-input-placeholder { color: inherit; opacity: 1; } :-ms-input-placeholder { color: inherit; opacity: 1; } ::-ms-input-placeholder { color: inherit; opacity: 1; } ::placeholder { color: inherit; opacity: 1; } button { cursor: pointer; border: none; background: transparent; padding: 0; } ul, li { list-style: none; margin: 0; padding: 0; } ol, li { margin: 0; padding: 0; } img { max-width: 100%; height: auto; transition-delay: 0.1s; transition-timing-function: ease-in-out; transition-duration: 0.7s; transition-property: all; } /* Form validation styles */ input:focus, textarea:focus, select:focus { border-color: #43c3ea; outline: none; } #contact-form input[type="text"].error { border-color: red; } #contact-form input[type="email"].error { border-color: red; } #contact-form select.error { border-color: red; } #contact-form textarea.error { border-color: red; } #contact-form label.error { display: none !important; } /** Thm Social Link **/ .thm-social-link { position: relative; display: block; padding-top: 30px; } .thm-social-link ul { position: relative; display: block; } .thm-social-link ul li { position: relative; float: left; margin-right: 10px; } .thm-social-link ul li:last-child { margin-right: 0; } .thm-social-link ul li a { position: relative; display: flex; align-items: center; justify-content: center; height: 50px; width: 50px; background-color: rgba(var(--thm-black-rgb), 1); border-radius: 5px; color: #ffffff; font-size: 14px; text-align: center; transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .thm-social-link ul li a:before { position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background-color: rgba(var(--thm-base-rgb), 1); border-radius: 5px; content: ""; opacity: 0; transform: scale(0.5); transform-style: preserve-3d; transition: all 0.4s cubic-bezier(0.62, 0.21, 0.45, 1.52); z-index: -1; } .thm-social-link ul li:hover a:before { opacity: 1; transform: scale(1); } .thm-social-link ul li:hover a { color: #ffffff; } /** xs sidebar **/ .xs-sidebar-group .xs-overlay { position: fixed; top: 0; left: 0%; width: 100%; height: 100%; opacity: 0; visibility: hidden; cursor: url(../images/icon/cross-out.png), pointer; transition: all 200ms linear; transition-delay: 0.1s; z-index: 99999999; } .xs-sidebar-group.isActive .xs-overlay { opacity: 0.9; visibility: visible; transition-delay: 0.3s; right: 100%; background-color: #000000; } .xs-sidebar-widget { position: fixed; top: 0; right: -100%; bottom: 0; max-width: 460px; width: 100%; background-color: #ffffff; overflow: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; transition: all 700ms ease 100ms; visibility: hidden; opacity: 1; z-index: 999999999; } .xs-sidebar-group.isActive .xs-sidebar-widget { opacity: 1; visibility: visible; right: 0; transition: all 500ms ease 800ms; } .sidebar-widget-container { position: relative; top: 150px; opacity: 0; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all 300ms ease 100ms; } .xs-sidebar-group.isActive .sidebar-widget-container { top: 0px; opacity: 1; visibility: visible; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all 700ms ease 1500ms; } .xs-overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0.8; z-index: 0; background-color: #000000; } .sidebar-textwidget { padding: 50px 45px; } .xs-sidebar-group .widget-heading { position: absolute; top: 0; right: 0; padding: 25px; } .xs-sidebar-group .widget-heading a { position: relative; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--thm-black); border-radius: 50%; color: var(--thm-black); font-size: 20px; font-weight: 400; transition: all 200ms linear; transition-delay: 0.1s; } .xs-sidebar-group .widget-heading a:hover { color: var(--thm-base); border-color: var(--thn-base); } .xs-sidebar-group .content-inner .logo { position: relative; display: block; border-bottom: 1px solid #e0e0e0; padding-bottom: 30px; } .xs-sidebar-group .content-inner .logo a { position: relative; display: inline-block; } .xs-sidebar-group .content-inner h3 { color: var(--thm-black); font-size: 25px; line-height: 35px; font-weight: 700; text-transform: capitalize; margin-bottom: 22px; } .xs-sidebar-group .content-inner .content-box { position: relative; display: block; padding-top: 33px; padding-bottom: 47px; } .xs-sidebar-group .content-inner .content-box .inner-text { position: relative; display: block; } .xs-sidebar-group .content-inner .content-box p { color: var(--thm-gray); } .xs-sidebar-group .content-inner .sidebar-contact-info { position: relative; display: block; } .xs-sidebar-group .content-inner .sidebar-contact-info h3 { color: var(--thm-black); font-size: 25px; line-height: 30px; font-weight: 700; margin: 0 0 27px; } .sidebar-contact-info ul { position: relative; display: block; } .sidebar-contact-info ul li { position: relative; display: block; margin-bottom: 23px; } .sidebar-contact-info ul li:last-child { margin-bottom: 0; } .sidebar-contact-info ul li .inner { position: relative; display: block; padding-left: 45px; } .sidebar-contact-info ul li .inner .icon { position: absolute; top: 0px; left: 0; } .sidebar-contact-info ul li .inner .icon span { position: relative; display: block; color: var(--thm-base); font-size: 27px; line-height: 27px; } .sidebar-contact-info ul li .inner .icon span.map-marker { position: relative; top: 8px; font-size: 32px; } .sidebar-contact-info ul li .inner .text { position: relative; display: block; } .sidebar-contact-info ul li .inner .text p { line-height: 24px; } .sidebar-contact-info ul li .inner .text p a { color: var(--thm-gray); } .xs-sidebar-group .content-inner .side-content-newsletter-box { position: relative; display: block; padding-top: 49px; } .xs-sidebar-group .content-inner .side-content-newsletter-box h3 { color: var(--thm-black); font-size: 25px; line-height: 30px; font-weight: 700; margin: 0 0 24px; } .side-content-newsletter-box .form-group input[type="email"] { position: relative; display: block; width: 100%; height: 60px; color: #444444; font-size: 18px; font-weight: 400; background-color: rgb(248, 248, 248); border: 1px solid #e3dfdf; padding-left: 30px; padding-right: 20px; border-radius: 6px; font-family: var(--thm-font); } .side-content-newsletter-box .form-group button { margin-top: 30px; } /*== Review Css ======*/ .review-box { position: relative; display: block; overflow: hidden; line-height: 15px; } .review-box ul { display: block; overflow: hidden; } .review-box ul li { display: inline-block; float: left; margin-right: 4px; cursor: pointer; } .review-box ul li:last-child { margin-right: 0px; } .review-box ul li i { color: #febd2f; font-size: 15px; } /*== Section Title Css ======*/ .sec-title { position: relative; display: block; margin-top: -6px; padding-bottom: 49px; } .sec-title .sub-title { position: relative; display: flex; align-items: center; margin-bottom: 13px; } .sec-title .sub-title .border-left { position: relative; display: block; top: -1px; background-color: var(--thm-base); width: 20px; height: 2px; } .sec-title .sub-title .border-right { position: relative; display: block; top: -1px; background-color: var(--thm-base); width: 20px; height: 2px; } .sec-title .sub-title h5 { color: var(--thm-base); font-size: 14px; line-height: 24px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; margin-left: 10px; } .sec-title h2 { color: var(--thm-black); font-size: 45px; line-height: 1.2em; font-weight: 900; text-transform: none; } /*== Btn One Css ======*/ .btn-box { position: relative; display: inline-block; line-height: 0; } .btn-one { position: relative; display: inline-block; overflow: hidden; padding-left: 35px; padding-right: 35px; background-color: transparent; color: #ffffff; font-size: 15px; line-height: 60px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; border-radius: 5px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; font-family: var(--thm-font-2); z-index: 2; } .btn-one:before { position: absolute; top: 0px; left: 100%; right: -50px; content: ""; background: var(--thm-base); -webkit-transform: translateX(0px); transform: translateX(0px); border-radius: 0%; transition-duration: 800ms; z-index: 1; bottom: 0; } .btn-one:hover:before { left: 0; right: 0px; } .btn-one:after { content: ""; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; border-radius: 5px; opacity: 1; transform: scaleX(1); transition-duration: 800ms; background-image: -moz-linear-gradient( 0deg, rgb(11, 103, 180) 0%, rgb(11, 123, 162) 57%, rgb(11, 143, 143) 100% ); background-image: -webkit-linear-gradient( 0deg, rgb(11, 103, 180) 0%, rgb(11, 103, 180) 57%, rgb(11, 103, 180) 100% ); background-image: -ms-linear-gradient( 0deg, rgb(11, 103, 180) 0%, rgb(11, 123, 162) 57%, rgb(11, 143, 143) 100% ); z-index: -1; } .btn-one:hover:after { transform: scaleX(0); transition-duration: 1500ms; } .btn-one .txt { position: relative; z-index: 1; } .btn-one:hover, .btn-one:focus { color: #ffffff; } .btn-one i { position: relative; top: 3px; display: inline-block; padding-left: 5px; font-size: 20px; } .btn-two { position: relative; display: flex; align-items: center; color: var(--thm-base); font-size: 14px; line-height: 14px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; font-family: var(--thm-font-2); transition: all 200ms linear; transition-delay: 0.1s; } .btn-two span { position: relative; top: -1px; display: inline-block; padding-left: 10px; color: var(--thm-black); font-size: 16px; } .btn-two:hover { color: var(--thm-black); letter-spacing: 0.05em; } .btn-fix { color: white; font-size: 15px; line-height: 60px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; border-radius: 5px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; font-family: var(--thm-font-2); } .btn-fix-red { background-color: var(--btn-red); } .btn-fix-red:hover { background-color: var(--btn-red-hover); color: white; } .btn-fix-blue { background-color: var(--btn-blue); } .btn-fix-blue:hover { background-color: var(--btn-blue-hover); color: white; } .btn-fix-black { background-color: black; } .btn-fix-black:hover { background-color: rgb(36, 35, 35); color: white; } /*== Owl Dot Style One Css ======*/ .owl-carousel.owl-dot-style1 .owl-dots { position: relative; text-align: center; line-height: 0; margin-top: 50px !important; display: block; } .owl-carousel.owl-dot-style1 .owl-dots .owl-dot { position: relative; display: inline-block; width: 10px; height: 10px; background-color: #034087; border: 0px solid #a5a5a5; margin: 0px 5px; padding: 0px; border-radius: 50%; transition: all 100ms linear; transition-delay: 0.1s; } .owl-carousel.owl-dot-style1 .owl-dots .owl-dot.active { background-color: var(--thm-base); } .owl-carousel.owl-dot-style1 .owl-dots .owl-dot:before { content: ""; position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background: var(--thm-base); border-radius: 50%; transform: scale(0); transition: all 500ms ease; } .owl-carousel.owl-dot-style1 .owl-dots .owl-dot.active:before { transform: scale(1); } .owl-carousel.owl-dot-style1 .owl-dots .owl-dot span { display: none; } /*== Owl Dot Style Two Css ======*/ .owl-carousel.owl-dot-style2 .owl-dots { position: relative; text-align: center; line-height: 0; margin-top: 30px !important; display: block; } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot { position: relative; display: inline-block; width: 16px; height: 16px; background-color: transparent; border: 5px solid #ffffff; margin: 0px 5px; padding: 0px; border-radius: 50%; transition: all 100ms linear; transition-delay: 0.1s; } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot:before { content: ""; position: absolute; top: -5px; left: -5px; bottom: -5px; right: -5px; border: 1px solid var(--thm-base); border-radius: 50%; transform: scale(0); transition: all 500ms ease; } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot.active { border: 5px solid #1a1c23; background-color: var(--thm-base); } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot.active:before { transform: scale(1); } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot span { display: none; } .owl-carousel.owl-dot-style2 .owl-dots .owl-dot.active span { } /*== Owl Nav Style One Css ======*/ .owl-nav-style-one { } .owl-nav-style-one .owl-controls { } .owl-nav-style-one.owl-theme .owl-stage-outer { position: relative; display: block; padding-top: 0px; padding-bottom: 0px; } .owl-nav-style-one.owl-theme .owl-nav { position: relative; display: block; line-height: 0; margin: 0; z-index: 10; } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"] { position: relative; display: inline-block; width: 50px; height: 50px; background-color: transparent; border: 2px solid #a7afb6; border-radius: 50%; margin: 0 10px; padding: 0; z-index: 1; transition: all 700ms ease 0s; } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"]:before { content: ""; position: absolute; top: -2px; left: -2px; bottom: -2px; right: -2px; background-color: var(--thm-base); border-radius: 50%; z-index: -1; opacity: 0; -webkit-transform: perspective(400px) rotateX(0deg) scale(0); -ms-transform: perspective(400px) rotateX(0deg) scale(0); transform: perspective(400px) rotateX(0deg) scale(0); -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"]:hover::before { opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg) scale(1); -ms-transform: perspective(400px) rotateX(0deg) scale(1); transform: perspective(400px) rotateX(0deg) scale(1); } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"] span { position: relative; display: block; color: #a7afb6; font-size: 14px; line-height: 46px; transition: all 200ms linear; transition-delay: 0.1s; } .owl-nav-style-one.owl-theme .owl-nav .owl-prev { transform: rotate(0deg); } .owl-nav-style-one.owl-theme .owl-nav .owl-next { transform: rotate(0deg); } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"]:hover { } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"] span { transition: all 200ms linear; transition-delay: 0.1s; } .owl-nav-style-one.owl-theme .owl-nav [class*="owl-"]:hover span { color: #ffffff; } /*== Scrool To Top Css ======*/ .scroll-to-top { position: fixed; right: -10px; bottom: 80px; transform: rotate(90deg); z-index: 99999999999; } .scroll-to-top .visible { visibility: visible !important; opacity: 1 !important; } .scroll-to-top .scroll-top-inner { opacity: 0; visibility: hidden; } .scroll-to-top .scroll-top-inner { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 0.4s; -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 0.4s; transition: all cubic-bezier(0.4, 0, 0.2, 1) 0.4s; } .scroll-to-top .scroll-bar { width: 50px; height: 3px; margin-right: 10px; position: relative; } .scroll-to-top .scroll-bar:before { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--thm-base); opacity: 1; } .scroll-to-top .scroll-bar .bar-inner { position: absolute; top: 0; right: 0; height: 100%; background-color: oklch(0.708 0 0); } .scroll-to-top .scroll-bar-text { color: oklch(0.708 0 0); font-size: 14px; font-weight: 500; cursor: pointer; font-family: var(--thm-font-2); transition: all 500ms ease; } .scroll-to-top .scroll-bar-text:hover { transform: scale(1); } /*== Styled Pagination Css ======*/ .styled-pagination { position: relative; display: block; width: 100%; height: auto; padding-top: 20px; } .styled-pagination.pdtop0 { padding-top: 0; } .styled-pagination li { position: relative; display: inline-block; margin-right: 6px; } .styled-pagination li:last-child { margin-right: 0; } .styled-pagination li a { position: relative; display: inline-block; width: 40px; height: 50px; border-radius: 0px; background: #ffffff; border: 1px solid #f2ece7; color: var(--thm-gray); font-size: 20px; line-height: 46px; font-weight: 500; text-align: center; text-transform: uppercase; transition: all 500ms ease; font-family: var(--thm-font); z-index: 1; } .styled-pagination li a span:before { position: relative; top: 1px; } .styled-pagination li.prev a span:before { position: relative; display: inline-block; } .styled-pagination li.next a span:before { position: relative; display: inline-block; } .styled-pagination li:hover a, .styled-pagination li.active a { color: #ffffff; border-color: var(--thm-base); background: var(--thm-base); } .styled-pagination li.prev a, .styled-pagination li.next a { width: 70px; } .styled-pagination li.prev a:hover, .styled-pagination li.next a:hover { color: #ffffff; } /*== checked Css Css ======*/ .checked-box1 { position: relative; display: block; min-height: 20px; } .checked-box1 label { position: relative; display: inline-block; padding-left: 30px; margin-right: 0px; margin-bottom: 0; color: var(--thm-black); font-size: 16px; line-height: 20px; font-weight: 400; cursor: pointer; min-height: 20px; font-family: var(--thm-font); } .checked-box1 input[type="checkbox"] { display: none; } .checked-box1 input[type="checkbox"] + label span { position: absolute; top: 2px; left: 0; width: 16px; height: 16px; vertical-align: middle; background-color: transparent; border: 1px solid #f2ece7; cursor: pointer; border-radius: 0px; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .checked-box1 label span:before { font-family: "icomoon" !important; position: absolute; top: 0px; left: 0px; bottom: 0; right: 0; content: "\e918"; color: var(--thm-base); font-size: 10px; font-weight: 700; width: 16px; height: 16px; margin: 0px; opacity: 0; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; display: flex; align-items: center; justify-content: center; } .checked-box1 input[type="checkbox"]:checked + label span { border-color: #f2ece7; } .checked-box1 input[type="checkbox"]:checked + label span:before { opacity: 1; } /*== Accordion Box Css ======*/ .accordion-box { position: relative; display: block; } .accordion-box .block { position: relative; display: block; margin-bottom: 20px; transition: all 500ms ease; } .accordion-box .block:last-child { margin-bottom: 0px; } .accordion-box .block .acc-btn { position: relative; display: block; cursor: pointer; background: #ffffff; padding-top: 14px; padding-left: 55px; padding-bottom: 14px; padding-right: 20px; border: 1px solid #d4d4d4; transition: all 500ms ease; } .accordion-box .block .acc-btn.active { background: #ffffff; border-bottom: 1px solid transparent; } .accordion-box .block .acc-btn h3 { color: var(--thm-black); font-size: 18px; line-height: 30px; font-weight: 500; transition: all 500ms ease; } .accordion-box .block .acc-btn.active h3 { color: var(--thm-base); } .accordion-box .block .acc-btn .icon-outer { position: absolute; top: 50%; left: 20px; width: 20px; height: 20px; color: var(--thm-black); font-size: 18px; text-align: right; line-height: 20px; font-weight: 700; cursor: pointer; transform: translateY(-50%) rotate(0deg); transition: all 500ms ease; z-index: 1; } .accordion-box .block .acc-btn.active .icon-outer { color: var(--thm-base); transform: translateY(-50%) rotate(0deg); } .accordion-box .block .acc-btn .icon-outer i:before { font-weight: 700; } .accordion-box .block .acc-btn.active .icon-outer i:before { content: "\e973"; } .accordion-box .block .acc-content { position: relative; display: none; padding-top: 1px; padding-left: 55px; padding-bottom: 27px; padding-right: 20px; border: 1px solid #d4d4d4; border-top: 1px solid transparent; } .accordion-box .block .acc-content.current { display: block; } .accordion-box .block .acc-content p { margin: 0; } /* Accordion Box Style1 Css */ .accordion-box-style1 { position: relative; display: block; } .accordion-box-style1 .accordion { position: relative; display: block; background: #ffffff; margin-bottom: 47px; } .accordion-box-style1 .accordion.mar0 { margin: 0; } .accordion-box-style1 .accordion .accord-btn { position: relative; display: block; cursor: pointer; padding-left: 30px; transition: all 500ms ease; } .accordion-box-style1 .accordion .accord-btn h4 { color: var(--thm-black); font-size: 22px; line-height: 30px; font-weight: 700; transition: all 500ms ease; } .accordion-box-style1 .accordion .accord-btn::after { font-family: "icomoon" !important; position: absolute; content: "\e972"; top: 50%; left: 0px; margin-top: -1px; color: var(--thm-black); font-size: 20px; line-height: 20px; font-weight: 600; text-align: left; transform: translateY(-50%); transition: all 500ms ease 0s; } .accordion-box-style1 .accordion .accord-btn.active { -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } .accordion-box-style1 .accordion .accord-btn.active h4 { color: var(--thm-base); } .accordion-box-style1 .accordion .accord-btn.active:after { color: var(--thm-base); content: "\e973"; } .accordion-box-style1 .accordion .accord-content { position: relative; padding-top: 13px; padding-bottom: 1px; padding-left: 30px; padding-right: 30px; display: none; } .accordion-box-style1 .accordion .accord-content.collapsed { display: block; } .accordion-box-style1 .accordion .accord-content p { color: #444444; font-size: 18px; line-height: 28px; font-weight: 400; margin: 0; } /*== Search Popup Css ======*/ .search-popup { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999; padding-left: 20px; padding-right: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transform: translateY(-110%); transform: translateY(-110%); -webkit-transition: opacity 500ms ease, -webkit-transform 500ms ease; transition: opacity 500ms ease, -webkit-transform 500ms ease; transition: transform 500ms ease, opacity 500ms ease; transition: transform 500ms ease, opacity 500ms ease, -webkit-transform 500ms ease; } .search-popup.active { -webkit-transform: translateY(0%); transform: translateY(0%); } .search-popup__overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--thm-black); opacity: 0.9; cursor: pointer; } .search-popup__content { width: 100%; max-width: 560px; } .search-popup__content form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; background-color: #fff; border-radius: 0px; overflow: hidden; } .search-popup__content form input[type="search"], .search-popup__content form input[type="text"] { width: 100%; background-color: #fff; font-size: 16px; border: none; outline: none; height: 66px; padding-left: 30px; } .search-popup__content .thm-btn { padding: 0; width: 68px; height: 68px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; position: absolute; top: 0; right: -1px; border-radius: 0; background-color: var(--thm-base); border: 0; border-top-right-radius: 0px; border-bottom-right-radius: 0px; color: #ffffff; font-size: 25px; } .search-popup__content .thm-btn i { background-color: transparent; margin-left: 0; } .search-popup__content .thm-btn:hover { background-color: var(--thm-base); } /* Preloader */ .handle-preloader { position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: flex; display: -ms-flexbox; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; z-index: 9999999; } .handle-preloader .animation-preloader { position: absolute; z-index: 100; } .handle-preloader .animation-preloader .spinner { height: 120px; width: 120px; border-radius: 50%; margin: 0 auto; animation: spinner 1s infinite linear; } .handle-preloader .loader-section { background-color: #ffffff; height: 100%; position: fixed; top: 0; width: calc(50% + 1px); } .preloader .loaded .animation-preloader { opacity: 0; transition: 0.3s ease-out; } .handle-preloader .animation-preloader .spinner { border: 5px solid #ffffff; border-top-color: rgba(255, 255, 255, 0.1); } /* Animación del preloader */ @keyframes spinner { to { transform: rotateZ(360deg); } } @keyframes letters-loading { 0%, 75%, 100% { opacity: 0; transform: rotateY(-90deg); } 25%, 50% { opacity: 1; transform: rotateY(0deg); } } .loader-wrap .layer-one { position: absolute; left: 0%; top: 0; width: 33.3333%; height: 100%; overflow: hidden; } .loader-wrap .layer-two { position: absolute; left: 33.3333%; top: 0; width: 33.3333%; height: 100%; overflow: hidden; } .loader-wrap .layer-three { position: absolute; left: 66.6666%; top: 0; width: 33.3333%; height: 100%; overflow: hidden; } .loader-wrap .layer .overlay { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: oklch(0.444 0.177 26.899); } @media screen and (max-width: 767px) { .handle-preloader .animation-preloader .spinner { height: 8em; width: 8em; } } @media screen and (max-width: 500px) { .handle-preloader .animation-preloader .spinner { height: 7em; width: 7em; } .handle-preloader .animation-preloader .txt-loading .letters-loading { font-size: 40px; letter-spacing: 10px; } } /***** .handle-preloader .animation-preloader .txt-loading { text-align: center; user-select: none; } .handle-preloader .animation-preloader .txt-loading .letters-loading { position: relative; display: inline-block; font-family: var(--thm-font-3); font-weight: 700; letter-spacing: 15px; font-size: 70px; line-height: 70px; text-transform: uppercase; color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: rgba(255, 255, 255, 0.30); } .handle-preloader .animation-preloader .txt-loading .letters-loading:before { animation: letters-loading 4s infinite; content: attr(data-text-preloader); position: absolute; top: 0; left: 0; opacity: 0; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before { animation-delay: 0.1s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before { animation-delay: 0.2s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before { animation-delay: 0.3s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before { animation-delay: 0.4s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before { animation-delay: 0.5s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before { animation-delay: 0.6s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before { animation-delay: 0.7s; } .handle-preloader .animation-preloader .txt-loading .letters-loading:nth-child(9):before { animation-delay: 0.8s; } ***/ .footer-social-link-style1 { position: relative; display: block; } .footer-social-link-style1 ul { position: relative; display: block; } .footer-social-link-style1 ul li { position: relative; float: left; margin-right: 10px; } .footer-social-link-style1 ul li:last-child { margin-right: 0; } .footer-social-link-style1 ul li a { position: relative; display: flex; align-items: center; justify-content: center; height: 40px; width: 40px; background: #ffffff; border: 1px solid #f2ece7; border-radius: 50%; color: #a5a2a0; font-size: 14px; text-align: center; transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .footer-social-link-style1 ul li a:before { position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; background: var(--thm-base); border-radius: 50%; content: ""; opacity: 0; transform: scale(0.5); transform-style: preserve-3d; transition: all 0.4s cubic-bezier(0.62, 0.21, 0.45, 1.52); z-index: -1; } .footer-social-link-style1 ul li:hover a:before { opacity: 1; transform: scale(1); } .footer-social-link-style1 ul li:hover a { color: #ffffff; border-color: var(--thm-base); } @-webkit-keyframes pulse10 { 0% { -webkit-box-shadow: 0 0 0 0 #0b67b4; box-shadow: 0 0 0 0 #0b67b4; } 40% { -webkit-box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); } 70% { -webkit-box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(255, 194, 17, 0); box-shadow: 0 0 0 0 rgba(255, 194, 17, 0); } } @keyframes pulse10 { 0% { -webkit-box-shadow: 0 0 0 0 #0b67b4; box-shadow: 0 0 0 0 #0b67b4; } 40% { -webkit-box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); } 70% { -webkit-box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); box-shadow: 0 0 0 50px rgba(255, 194, 17, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(255, 194, 17, 0); box-shadow: 0 0 0 0 rgba(255, 194, 17, 0); } } /*** Airtronix Form Style1***/ .airtronix-form-style1 { position: relative; display: block; background-color: var(--thm-base); max-width: 400px; width: 100%; border-radius: 10px; overflow: hidden; float: right; padding: 39px 30px 40px; } .airtronix-form-style1 .top-title { position: relative; display: block; text-align: center; padding: 0 0 28px; } .airtronix-form-style1 .top-title h2 { color: #ffffff; font-size: 35px; line-height: 40px; font-weight: 900; margin: 0 0 4px; } .airtronix-form-style1 .top-title p { color: #ffffff; } .airtronix-form-style1 form { position: relative; display: block; } .airtronix-form-style1 form .row { --bs-gutter-x: 10px; } .airtronix-form-style1 form .form-group { position: relative; display: block; padding-bottom: 10px; } .airtronix-form-style1 form .input-box { position: relative; display: block; } .airtronix-form-style1 form input[type="text"], .airtronix-form-style1 form input[type="email"], .airtronix-form-style1 form textarea { position: relative; display: block; background: #ffffff; border: 1px solid #ffffff; width: 100%; height: 50px; color: #5d5d5d; font-size: 17px; font-weight: 400; font-style: normal; padding-left: 20px; padding-right: 20px; border-radius: 4px; transition: all 500ms ease; font-family: var(--thm-font); } .airtronix-form-style1 form input[type="text"]:focus, .airtronix-form-style1 forminput[type="email"]:focus, .airtronix-form-style1 form textarea:focus { border: 1px solid var(--thm-black); outline: none; } .airtronix-form-style1 form textarea { height: 115px; padding-top: 12px; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; } .airtronix-form-style1 form input[type="text"]::-webkit-input-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="text"]:-moz-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="text"]::-moz-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="text"]:-ms-input-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="email"]::-webkit-input-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="email"]:-moz-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="email"]::-moz-placeholder { color: #5d5d5d; } .airtronix-form-style1 form input[type="email"]:-ms-input-placeholder { color: #5d5d5d; } .airtronix-form-style1 form .select-box { position: relative; display: block; width: 100%; } .airtronix-form-style1 form .nice-select { position: relative; display: block; background-color: #ffffff; border-radius: 4px; border: solid 1px #ffffff; width: 100%; height: 50px; color: #5d5d5d; font-size: 17px; font-weight: 400; line-height: 48px; outline: none; padding-left: 20px; padding-right: 20px; transition: all 0.2s ease-in-out; font-family: var(--thm-font); } .airtronix-form-style1 form .nice-select:after { position: absolute; content: "\e926"; font-family: "icomoon" !important; color: #626378; font-size: 12px; top: 0px; right: 25px; bottom: 0; margin: 0px; font-weight: 400; border: none !important; transform: rotate(0deg) !important; } .airtronix-form-style1 form .nice-select .list { background-color: #ffffff; border-radius: 0px; box-shadow: 0 0 10px rgb(0 0 0 / 10%); padding: 0px 0 0px; margin-top: 10px; } .airtronix-form-style1 form .nice-select .option { padding-left: 20px; padding-right: 20px; font-size: 15px; line-height: 40px; min-height: 40px; } .airtronix-form-style1 form .button-box { position: relative; display: block; padding-top: 0px; } .airtronix-form-style1 form .button-box button { width: 100%; } .airtronix-form-style1 form .button-box button:hover { color: var(--thm-black); } .airtronix-form-style1 form .button-box button:after { background-image: none; background-color: #151735; } .airtronix-form-style1 form .button-box button:before { background-color: #ffffff; } /*------------------------------------------ cta style5 Area Css --------------------------------------------*/ .cta-style5-area { position: relative; display: block; background-color: #090d30; z-index: 11; } .cta-style5-area__inner { position: relative; margin-left: -70px; margin-right: 30px; background: #dbe5f0; } .emergency-service-box { position: absolute; bottom: 0; right: -295px; width: 296px; background: #c6d0dd; padding: 47px 40px 35px; } .emergency-service-box .arrow { position: absolute; top: 110px; right: 80px; color: var(--thm-black); font-size: 60px; } .emergency-service-box h2 { font-size: 28px; line-height: 36px; margin: 0 0 38px; } .emergency-service-box h3 { font-size: 26px; line-height: 30px; margin: 0 0 3px; } .emergency-service-box h4 { font-size: 28px; line-height: 30px; font-family: var(--thm-font); } .emergency-service-box h4 a { color: var(--thm-base); } .emergency-service-box p { color: var(--thm-black); font-size: 19px; line-height: 24px; margin: 31px 0 0; } .cta-style5-area__inner ul { position: relative; overflow: hidden; display: flex; flex-wrap: wrap; } .cta-style5-area__inner ul li { flex: 0 0 auto; width: 33.3333333333%; text-align: center; border-right: 1px solid #090d30; } .single-cta-style5-box { position: relative; display: block; padding: 20px 0 26px; } .single-cta-style5-box .icon { position: relative; display: block; padding-bottom: 15px; } .single-cta-style5-box .icon img { position: relative; display: inline-block; -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } .single-cta-style5-box:hover .icon img { transform: rotateY(180deg) scale(1); } .single-cta-style5-box .inner-title { position: relative; display: block; } .single-cta-style5-box .inner-title h3 { font-size: 21px; line-height: 24px; } .single-cta-style5-box .inner-title h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-cta-style5-box .inner-title h3 a:hover { color: var(--thm-base); } /*---------------------------------------- Cta Style3 Area ---------------------------------------*/ .cta-style3-area { position: relative; display: block; z-index: 10; } .cta-style3-area__bg-left { position: absolute; top: 0; left: 0; bottom: 0; width: 50%; background-color: var(--thm-black); z-index: -1; } .cta-style3-area__bg-right { position: absolute; top: 0; bottom: 0; right: 0; width: 50%; float: right; background-color: var(--thm-base); z-index: -1; } .cta-style3-area .row { --bs-gutter-x: 0px; } .single-cta-style3-box { position: relative; display: block; padding: 41px 0px 42px; } .single-cta-style3-box--style2 { padding-left: 80px; } .single-cta-style3-box__inner { position: relative; display: block; padding-left: 110px; } .single-cta-style3-box .icon { position: absolute; top: 7px; left: 0; } .single-cta-style3-box .icon.style2 { } .single-cta-style3-box .icon span { position: relative; display: inline-block; color: #ffffff; font-size: 80px; } .single-cta-style3-box .icon.style2 span { font-size: 75px; line-height: 75px; } .single-cta-style3-box .text { position: relative; display: block; } .single-cta-style3-box .text h3 { color: #ffffff; font-size: 24px; line-height: 34px; margin-bottom: 7px; } .single-cta-style3-box .text p { color: #ffffff; margin: 0; } /*** ============================================= Cta Style1 Area Css ============================================= ***/ .cta-style1-area { position: relative; display: block; background-color: transparent; z-index: 10; } .cta-style1-area:before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 50%; background-color: #f0f4fb; z-index: -1; } .cta-style1-area:after { content: ""; position: absolute; left: 0; bottom: 0; right: 0; height: 50%; background-color: #1f1e3b; z-index: -1; } .cta-style1-area__inner { position: relative; display: block; background-color: var(--thm-base); border-radius: 8px; padding: 55px 0px 54px; padding-left: 70px; } .cta-style1-area__inner-img-bg { position: absolute; top: 0px; right: -420px; width: calc(70% + 0px); height: calc(100% + 0px); background-size: cover; background-repeat: no-repeat; background-position: top right; clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 23% 0%); transition: all 200ms linear; transition-delay: 0.1s; } .cta-style1-area__inner-content { position: relative; display: block; z-index: 2; } .cta-style1-area__inner-content h2 { color: #fff; font-size: 42px; line-height: 50px; font-weight: 900; margin-bottom: 12px; } .cta-style1-area__inner-content h3 { color: #fff; font-size: 26px; line-height: 34px; font-weight: 600; } .cta-style1-area__inner-content h3 a { display: inline-block; color: #fff; transition: all 200ms linear; transition-delay: 0.1s; } .cta-style1-area__inner-content h3 a + a { margin-left: 50px; } .cta-style1-area__inner-content h3 a:hover { color: var(--thm-black); } .cta-style1-area--style2 { position: relative; } .cta-style1-area--style2:before { background-color: #ffffff; } .cta-style1-area--style2:after { background-color: #062648; } /*------------------------------------------ cta style4 Area Css -------------------------------------------*/ .cta-style4-area { position: relative; display: block; background-image: -moz-linear-gradient( 90deg, rgb(254, 171, 38) 0%, rgb(254, 187, 51) 100% ); background-image: -webkit-linear-gradient( 90deg, rgb(254, 171, 38) 0%, rgb(254, 187, 51) 100% ); background-image: -ms-linear-gradient( 90deg, rgb(254, 171, 38) 0%, rgb(254, 187, 51) 100% ); z-index: 10; } .cta-style4-area__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: repeat-x; background-size: contain; z-index: -1; } .single-cta-style4-box { position: relative; display: block; padding: 24px 0px 25px; padding-right: 92px; } .single-cta-style4-box__inner { position: relative; display: block; padding-left: 80px; } .single-cta-style4-box__inner .icon { position: absolute; top: 17px; left: 0; } .single-cta-style4-box__inner .icon span { position: relative; display: inline-block; color: #333230; font-size: 50px; } .single-cta-style4-box__inner .text { position: relative; display: block; } .single-cta-style4-box__inner .text h3 { color: #000000; font-size: 22px; line-height: 32px; margin: 0 0 4px; } .single-cta-style4-box__inner .text p { color: #000000; font-size: 18px; line-height: 24px; font-family: var(--thm-font); } .single-cta-style4-box__inner .text p a { position: relative; display: inline-block; color: #000000; font-weight: 600; transition: all 200ms linear; transition-delay: 0.1s; } .single-cta-style4-box__inner .text p a::before { position: absolute; content: ""; left: 0; bottom: 2px; right: 0; height: 1px; background-color: #000000; } .single-cta-style4-box__inner .text p a:hover { color: var(--thm-base); } /*------------------------------------------ welcome style1 Css --------------------------------------------*/ .welcome-style1 { position: relative; display: block; background-color: var(--thm-main-bg); padding: 120px 0 120px; z-index: 10; } .welcome-style1__content { position: relative; display: block; } .welcome-style1__content .sec-title { padding-bottom: 39px; } .welcome-style1__content .sec-title h2 { color: #ffffff; } .welcome-style1__content .text { position: relative; display: block; padding-bottom: 30px; } .welcome-style1__content .text p { color: #a9c2d0; font-size: 20px; line-height: 32px; } .welcome-style1__content--bottom { position: relative; display: flex; align-items: center; } .welcome-style1__content--bottom .signature-box { position: relative; display: block; margin-right: 120px; } .awards-img-box { position: relative; display: block; } .awards-img-box ul { position: relative; display: flex; align-items: center; } .awards-img-box ul li { position: relative; display: block; } .awards-img-box ul li + li { margin-left: 20px; } .awards-img-box ul li a { position: relative; display: inline-block; } .awards-img-box ul li a img { filter: drop-shadow(2px 0 0 var(--thm-base)) drop-shadow(-2px 0 var(--thm-base)) drop-shadow(0 2px 0 var(--thm-base)) drop-shadow(0 -2px 0 var(--thm-base)) drop-shadow(2px 2px 0 var(--thm-base)) drop-shadow(2px -2px 0 var(--thm-base)) drop-shadow(-2px 2px 0 var(--thm-base)) drop-shadow(-2px -2px 0 var(--thm-base)); -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; transition: all 0.4s ease; } .awards-img-box ul li:hover a img { filter: drop-shadow(2px 0 0 var(--thm-white)) drop-shadow(-2px 0 var(--thm-white)) drop-shadow(0 2px 0 var(--thm-white)) drop-shadow(0 -2px 0 var(--thm-white)) drop-shadow(2px 2px 0 var(--thm-white)) drop-shadow(2px -2px 0 var(--thm-white)) drop-shadow(-2px 2px 0 var(--thm-white)) drop-shadow(-2px -2px 0 var(--thm-white)); } .welcome-style1__img { position: relative; display: block; padding-top: 120px; margin-left: 60px; margin-right: -90px; max-width: 400px; } .welcome-style1__img .inner { position: relative; display: inline-block; z-index: 2; } .welcome-style1__img .inner img { width: auto; } .welcome-style1__img .inner .shape1 { position: absolute; top: -160px; left: -140px; bottom: -68px; right: -136px; z-index: -1; } .welcome-style1__img .inner .shape1 img { opacity: 0.7; } .welcome-style1__img .shape2 { position: absolute; top: 25px; left: 20px; z-index: -2; } .welcome-style1__img .shape2 img { opacity: 0.05; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; transition: all 0.4s ease; } .welcome-style1__img:hover .shape2 img { opacity: 0.1; transform: rotate(1deg); } .welcome-style1__img .shape3 { position: absolute; top: 10px; right: 0px; z-index: 2; } /*------------------------------------------ welcome style2 Css --------------------------------------------*/ .welcome-style2 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 113px; z-index: 10; } .welcome-style2 .sec-title { padding-bottom: 56px; } .welcome-style2 .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .welcome-style2 .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .welcome-style2 .sec-title p { color: #242424; font-size: 22px; line-height: 26px; font-weight: 500; margin-top: 33px; padding: 0 70px; } .single-service-style1.single-service-style1--style2 { background-color: #f0f8fa; } .welcome-style2__more-services { position: relative; display: block; padding-top: 51px; text-align: center; } .welcome-style2__more-services p { color: #242424; font-size: 20px; line-height: 30px; font-weight: 500; } .welcome-style2__more-services p a { position: relative; display: inline-block; color: var(--thm-base); } .welcome-style2__more-services p a::before { content: ""; position: absolute; left: 0; bottom: 4px; right: 0; height: 1px; background-color: var(--thm-base); } /*------------------------------------------ Welcome Style3 --------------------------------------------*/ .welcome-style3 { position: relative; display: block; background-color: #ffffff; padding: 120px 0px 120px; z-index: 10; } .welcome-style3__img { position: relative; display: block; margin-left: -70px; } .welcome-style3__img ul { position: relative; display: flex; margin-left: -5px; margin-right: -5px; align-items: flex-end; justify-content: flex-end; } .welcome-style3__img ul li { position: relative; display: block; float: left; padding: 0 5px 0; } .welcome-style3__img ul li:first-child .single-img-box { width: 310px; } .welcome-style3__img ul li:last-child .single-img-box { width: 220px; } .welcome-style3__img ul li .single-img-box { position: relative; display: block; overflow: hidden; } .welcome-style3__img ul li .single-img-box::before { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; background-color: #000000; z-index: 1; transition: all 300ms linear; transition-delay: 0.1s; } .welcome-style3__img ul li:hover .single-img-box::before { opacity: 0.3; } .welcome-style3__img ul li .single-img-box img { width: 100%; } .welcome-style3__img ul li:hover .single-img-box img { transform: scale(1.05) rotate(0deg); } .welcome-style3__content { position: relative; display: block; margin-left: 40px; } .welcome-style3__content .sec-title { padding-bottom: 30px; } .welcome-style3__content .text1 { position: relative; display: block; margin-bottom: 29px; } .welcome-style3__content .text1 p { margin: 0; } .welcome-style3__content .text2 { position: relative; display: block; } .welcome-style3__content .text2 p { margin: 0; } .welcome-style3__content ul { position: relative; display: block; margin-top: 44px; } .welcome-style3__content ul li { position: relative; display: block; padding-left: 30px; color: var(--thm-black); font-size: 18px; line-height: 28px; font-family: var(--thm-font); font-weight: 600; margin-bottom: 9px; } .welcome-style3__content ul li:last-child { margin-bottom: 0; } .welcome-style3__content ul li .icon { position: absolute; top: 6px; left: 0; line-height: 0; } .welcome-style3__content ul li .icon span { position: relative; display: inline-block; color: var(--thm-base); font-size: 18px; line-height: 18px; font-weight: 600; } /*------------------------------------------ Welcome Style4 --------------------------------------------*/ .welcome-style4 { position: relative; display: block; background-color: #ffffff; padding: 120px 0px 113px; z-index: 10; } .welcome-style4__img { position: relative; display: block; max-width: 570px; margin-left: -100px; } .welcome-style4__img-top { position: absolute; top: 0; right: 180px; z-index: 2; } .welcome-style4__img ul { position: relative; display: flex; margin-left: -10px; margin-right: -10px; } .welcome-style4__img ul li { position: relative; display: block; float: left; padding: 0 10px 0; } .welcome-style4__img ul li:first-child { padding-top: 175px; } .welcome-style4__img ul li:first-child .single-img-box { width: 305px; } .welcome-style4__img ul li:last-child .single-img-box { width: 240px; } .welcome-style4__img ul li .single-img-box { position: relative; display: block; overflow: hidden; } .welcome-style4__img ul li .single-img-box img { width: 100%; } .welcome-style4__img ul li:hover .single-img-box img { transform: scale(1.02) rotate(0deg); } .certified-service-box { position: relative; display: block; background-color: oklch(0.971 0.013 17.38); margin-top: 20px; text-align: center; padding: 39px 0 32px; } .certified-service-box h5 { color: var(--thm-primary); font-size: 14px; line-height: 24px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; } .certified-service-box h2 { color: #242424; font-size: 30px; line-height: 36px; font-weight: 900; font-family: var(--thm-font-3); margin: 8px 0 0; } .welcome-style3__content--style2 .sec-title { padding-bottom: 40px; } .welcome-style3__content--style2 ul { margin-top: 41px; } .welcome-style3__content--style2 .btn-box { position: relative; padding-top: 56px; } /*** ============================================= Welcome Style6 Css ============================================= ***/ .welcome-style6 { position: relative; display: block; padding: 120px 0 120px; z-index: 10; } .welcome-style6__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: top center; background-color: #a33030; background-blend-mode: color-burn; z-index: -1; } .welcome-style6__bg:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #a33030; opacity: 0.9; } .welcome-style6__img-box { position: relative; display: block; margin-right: -15px; } .welcome-style6__img-box .inner { position: relative; display: block; overflow: hidden; border-radius: 11px; } .welcome-style6__img-box .inner::before { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; background-color: #000000; z-index: 2; transition: all 300ms linear; transition-delay: 0.1s; } .welcome-style6__img-box:hover .inner::before { opacity: 0.3; } .welcome-style6__img-box .inner img { width: 100%; } .welcome-style6__img-box:hover .inner img { transform: scale(1.05) rotate(1deg); } .welcome-style6__content-box { position: relative; display: block; padding-left: 75px; } .welcome-style6__content-box .sec-title { padding-bottom: 20px; } .welcome-style6__content-box .sec-title h2 { color: #ffffff; } .welcome-style6__content-box .sec-title .sub-title .border-left { background-color: #ffffff; } .welcome-style6__content-box .sec-title .sub-title h5 { color: #ffffff; } .welcome-style6__content-box .text-box { position: relative; display: block; } .welcome-style6__content-box .text-box p { color: #ffffff; } .welcome-style6__content-box .list-item { position: relative; display: block; padding-top: 27px; max-width: 630px; } .welcome-style6__content-box .list-item ul { position: relative; display: block; } .welcome-style6__content-box .list-item ul li { position: relative; display: block; padding-left: 40px; color: #ffffff; font-size: 20px; line-height: 30px; font-family: var(--thm-font-3); font-weight: 500; } .welcome-style6__content-box .list-item ul li + li { margin-top: 4px; } .welcome-style6__content-box .list-item ul li .icon { position: absolute; top: 4px; left: 0; line-height: 0; } .welcome-style6__content-box .list-item ul li .icon span { position: relative; display: inline-block; color: #ffffff; font-size: 20px; line-height: 20px; } .welcome-style6__content-box .customer-info { position: relative; display: flex; align-items: center; margin-top: 30px; } .welcome-style6__content-box .customer-info .inner { position: relative; display: flex; align-items: center; } .welcome-style6__content-box .customer-info .img-box { position: relative; display: block; overflow: hidden; width: 80px; height: 80px; border-radius: 50%; } .welcome-style6__content-box .customer-info .title-box { position: relative; display: block; flex: 1; margin-left: 20px; } .welcome-style6__content-box .customer-info .title-box h3 { font-size: 20px; line-height: 28px; font-family: var(--thm-font); font-weight: 600; } .welcome-style6__content-box .customer-info .title-box h3 a { color: #ffffff; transition: all 200ms linear; transition-delay: 0.1s; } .welcome-style6__content-box .customer-info .title-box h3 a:hover { color: var(--thm-black); } .welcome-style6__content-box .customer-info .title-box h3 span { position: relative; display: inline-block; color: #ffffff; font-size: 18px; line-height: 28px; font-weight: 500; } .welcome-style6__content-box .customer-info .outer { position: relative; display: block; margin-left: 40px; } /*------------------------------------------ Service style1 --------------------------------------------*/ .service-style1 { position: relative; display: block; padding: 120px 0 120px; background: var(--thm-gray-bg); z-index: 10; } .service-style1__top { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; padding-bottom: 49px; } .service-style1__top .sec-title { padding-bottom: 0; } .service-style1__top .sec-title h2 { } .service-style1__top .text-box { position: relative; display: block; top: -4px; max-width: 500px; width: 100%; } .service-style1__top .text-box p { color: #494949; } .single-service-style1 { position: relative; display: block; text-align: center; border-radius: 8px; background-color: #ffffff; padding: 50px 35px 40px; border-bottom: 4px solid #d90429; transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .single-service-style1::before { content: ""; position: absolute; top: 0; left: 0; bottom: -4px; right: 0; border-bottom: 4px solid var(--thm-black); border-radius: 8px; background-color: var(--thm-primary); transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; transform-origin: bottom right; -webkit-transform: scale(1, 0); transform: scale(1, 0); z-index: -1; } .single-service-style1:hover::before { -webkit-transform: scale(1, 1); transform: scale(1, 1); transform-origin: top center; } .single-service-style1 .icon { position: relative; display: block; line-height: 0; } .single-service-style1 .icon span { position: relative; display: inline-block; color: #0b67b4; font-size: 64px; line-height: 64px; transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style1:hover .icon span { color: #ffffff; } .single-service-style1 .text { position: relative; display: block; margin-top: 25px; } .single-service-style1 .text h3 { font-size: 22px; line-height: 32px; margin-bottom: 7px; transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style1 .text h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style1:hover .text h3 a { color: #ffffff; } .single-service-style1 .text p { color: #494949; transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style1:hover .text p { color: #ffffff; } .single-service-style1 .text .btn-box { position: relative; display: inline-block; margin-top: 22px; transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style1:hover .text .btn-box a { color: var(--thm-black); } .service-style1-carousel.owl-nav-style-one.owl-theme .owl-nav { position: relative; display: block; width: 290px; margin: 50px auto 0; } .service-style1-carousel.owl-nav-style-one.owl-theme .owl-nav:before { content: ""; position: absolute; top: 24px; left: 0; width: 70px; height: 1px; background: #aeb2b7; } .service-style1-carousel.owl-nav-style-one.owl-theme .owl-nav:after { content: ""; position: absolute; top: 24px; right: 0; width: 70px; height: 1px; background: #aeb2b7; } /*------------------------------------------ Service style2 --------------------------------------------*/ .service-style2 { position: relative; display: block; padding: 120px 0 120px; background: oklch(0.444 0.177 26.899); z-index: 10; } .service-style2:before { content: ""; position: absolute; left: 0; bottom: 0; right: 0; height: 350px; background-color: #ffffff; z-index: -1; } .service-style2 .sec-title { padding-bottom: 56px; } .service-style2 .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .service-style2 .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .service-style2 .sec-title h2 { color: #ffffff; } .service-style2 .container { max-width: 1300px; } .single-service-style2 { position: relative; display: block; } .single-service-style2 .img-box { position: relative; display: block; overflow: hidden; background-color: #000000; border-top-left-radius: 6px; border-top-right-radius: 6px; } .single-service-style2 .img-box img { width: 100%; transform: scale(1); } .single-service-style2:hover .img-box img { transform: scale(1.05) rotate(0deg); opacity: 0.5; } .single-service-style2__overlay-bg { position: absolute; left: 0; bottom: 0; right: 0; height: 130px; background-size: cover; background-repeat: no-repeat; background-position: bottom center; opacity: 0.6; z-index: 1; } .single-service-style2 .text { position: relative; display: block; background-color: #ffffff; padding: 33px 30px 40px; text-align: center; box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.1); border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .single-service-style2 .text h3 { font-size: 24px; line-height: 34px; font-weight: 700; margin: 0 0 7px; } .single-service-style2 .text h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-service-style2 .text h3 a:hover { color: var(--thm-base); } .single-service-style2 .text p { margin-bottom: 23px; } .single-service-style2 .text .border-box { position: relative; display: block; width: 35px; height: 3px; background-color: var(--thm-base); margin: 0 auto; } .service-style2-carousel.owl-nav-style-one.owl-theme .owl-nav { position: relative; display: block; width: 290px; margin: 50px auto 0; } .service-style2-carousel.owl-carousel .owl-stage-outer { overflow: visible; } .service-style2-carousel.owl-carousel .owl-item { opacity: 0; visibility: hidden; transition: opacity 500ms ease, visibility 500ms ease; } .service-style2-carousel.owl-carousel .owl-item.active { opacity: 1; visibility: visible; } /*** ============================================= choose Style1 Css ============================================= ***/ .choose-style1 { position: relative; display: block; background-color: #08335e; z-index: 10; } .choose-style1__shape-1 { position: absolute; top: 0; right: 0; bottom: 0; display: flex; align-items: center; z-index: -1; } .choose-style1__shape-1 img { opacity: 0.05; } .choose-style1__pattern { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-repeat: no-repeat; background-size: cover; background-position: top center; background-color: #08335e; background-blend-mode: color-burn; opacity: 0.1; z-index: -2; } .choose-style1__img-bg { position: absolute; top: 0; left: 0; bottom: 0; overflow: hidden; background-color: var(--thm-base); background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: left top; width: calc((100% - -122px) / 3); z-index: 1; } .choose-style1__img-bg:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: 0.2; z-index: -1; } .happy-customers-box-style1 { position: absolute; top: 0; right: 0; width: 190px; background-color: var(--thm-base); text-align: center; padding: 36px 0 32px; z-index: 1; } .happy-customers-box-style1 .icon { position: relative; display: block; padding-bottom: 18px; } .happy-customers-box-style1 .icon span { color: #ffffff; font-size: 62px; line-height: 62px; } .happy-customers-box-style1 h3 { color: #ffffff; font-size: 22px; line-height: 30px; font-weight: 500; } .choose-style1__inner { position: relative; display: block; max-width: 1920px; width: 100%; margin: 0 auto; padding: 120px 0 116px; } .choose-style1__content { position: relative; display: block; max-width: 862px; width: 100%; float: right; padding-left: 100px; } .choose-style1__content .sec-title { padding-bottom: 30px; } .choose-style1__content .sec-title h2 { color: #ffffff; } .choose-style1__content .text { position: relative; display: block; } .choose-style1__content .text p { color: #ffffff; } .choose-style1__content-bottom { position: relative; display: block; padding-top: 38px; } .choose-style1__content-bottom ul { position: relative; display: block; } .choose-style1__content-bottom ul li { position: relative; display: block; padding-left: 40px; color: #ffffff; font-size: 20px; line-height: 30px; font-family: var(--thm-font); font-weight: 600; margin-bottom: 15px; } .choose-style1__content-bottom ul li:last-child { margin-bottom: 0; } .choose-style1__content-bottom ul li .icon { position: absolute; top: 3px; left: 1px; line-height: 0; } .choose-style1__content-bottom ul li .icon span { position: relative; display: inline-block; font-size: 22px; line-height: 24px; background: repeating-linear-gradient(to top, #00b1e6 0%, #00e8d4 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } /*** ============================================= Our Values Style1 Css ============================================= ***/ .our-values-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .our-values-style1__img { position: relative; display: block; margin-right: 35px; } .our-values-style1__img .inner { position: relative; display: block; overflow: hidden; } .our-values-style1__img .inner::after { position: absolute; content: ""; top: 0; left: 0; right: 0; bottom: 0; background-color: #000000; opacity: 0; z-index: 1; transition: all 1500ms ease; } .our-values-style1__img:hover .inner::after { opacity: 0.5; } .our-values-style1__img .inner img { width: 100%; transform: scale(1); transition: all 1500ms ease; } .our-values-style1__img:hover .inner img { transform: scale(1.05) rotate(0deg); } .our-values-style1__content { position: relative; display: block; } .our-values-style1__content .sec-title { padding-bottom: 19px; } .our-values-style1__content .text { position: relative; display: block; } .our-values-style1__content .text p { font-size: 20px; line-height: 32px; } .our-values-style1__content .text p u { position: relative; display: inline-block; text-decoration: none; } .our-values-style1__content .text p u::before { position: absolute; content: ""; left: 0; bottom: 3px; right: 0px; height: 1px; background-color: #7e7e7e; } .our-values-style1__content-features { position: relative; display: block; margin-top: 39px; } .our-values-style1__content-features ul { position: relative; display: block; } .our-values-style1__content-features ul li { position: relative; display: block; padding-left: 90px; margin-bottom: 39px; } .our-values-style1__content-features ul li:last-child { margin: 0; } .our-values-style1__content-features ul li .icon { position: absolute; top: 4px; left: 0; line-height: 0; } .our-values-style1__content-features ul li .icon span { position: relative; display: inline-block; color: var(--thm-base); font-size: 60px; line-height: 60px; } .our-values-style1__content-features ul li .text { position: relative; display: block; } .our-values-style1__content-features ul li .text h3 { font-size: 22px; line-height: 26px; padding-bottom: 4px; } .our-values-style1__content-features ul li .text p { margin: 0; } /*** ============================================= values Style3 Css ============================================= ***/ .values-style3 { position: relative; display: block; padding: 120px 0 71px; z-index: 10; } .values-style3-bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: cover; background-repeat: no-repeat; background-position: center center; z-index: -1; } .values-style3__content { position: relative; display: block; padding-right: 40px; } .values-style3__content .sec-title { padding-bottom: 20px; } .values-style3__content .sec-title h2 { color: #ffffff; } .values-style3__content .text { position: relative; display: block; margin-bottom: 26px; } .values-style3__content .text p { color: #ffffff; } .values-style3__content-list-item { position: relative; display: block; } .values-style3__content-list-item h3 { color: #ffffff; font-size: 22px; line-height: 32px; } .values-style3__content-list-item ul { position: relative; display: block; padding-top: 13px; } .values-style3__content-list-item ul li { position: relative; display: block; padding-left: 30px; color: #ffffff; font-size: 19px; line-height: 29px; font-family: var(--thm-font); font-weight: 500; } .values-style3__content-list-item ul li + li { margin-top: 5px; } .values-style3__content-list-item ul li .icon { position: absolute; top: 6px; left: 0; line-height: 0; } .values-style3__content-list-item ul li .icon span { position: relative; display: inline-block; color: #ffffff; font-size: 17px; line-height: 17px; font-weight: 100; } .airtronix-form-style1--instyle2 { position: relative; display: block; max-width: 370px; padding: 43px 30px 40px; } .airtronix-form-style1--instyle2 .top-title { padding: 0 0 31px; } .airtronix-form-style1--instyle2 .top-title h3 { color: #ffffff; font-size: 25px; line-height: 35px; font-weight: 500; } .airtronix-form-style1--instyle2 form .form-group { padding-bottom: 15px; } .airtronix-form-style1--instyle2 form textarea { height: 120px; } .airtronix-form-style1--instyle2 form .button-box { position: relative; display: block; padding-top: 0px; } .airtronix-form-style1--instyle2 form .button-box button { width: auto; padding: 0 40px; } .airtronix-form-style1--instyle3 { background-color: #480202; } .airtronix-form-style1--instyle3 .top-title { text-align: left; } .airtronix-form-style1--instyle3 form .button-box button:after { background-color: var(--thm-base); } /*** ============================================= Slogan Area Css ============================================= ***/ .slogan-area { position: relative; display: block; padding: 116px 0 120px; z-index: 10; } .slogan-area-bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: cover; background-repeat: no-repeat; background-position: top center; z-index: -1; } .slogan-area-bg-gradient { position: absolute; top: 0; left: 0; bottom: 0; width: 1120px; background-repeat: no-repeat; background-position: left top; background-size: cover; } .slogan-area-bg:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #000000; opacity: 0.4; } .slogan-content-box { position: relative; display: block; } .slogan-content-box .inner-title { position: relative; display: block; } .slogan-content-box .inner-title h5 { color: #ffffff; font-size: 14px; line-height: 20px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; } .slogan-content-box .inner-title h2 { color: #ffffff; font-size: 65px; line-height: 1.1em; font-weight: 900; margin: 22px 0 0; font-family: var(--thm-font-3); } .slogan-content-box .btns-box { position: relative; display: block; line-height: 0; padding-top: 43px; } .video-gallery-style1 { position: relative; display: flex; align-items: center; position: absolute; top: 0; right: 0; bottom: 0; } .video-gallery-style1 .icon { position: relative; display: flex; align-items: center; justify-content: center; width: 70px; height: 70px; background: #ffffff; border-radius: 50%; transition: all 200ms linear; transition-delay: 0.1s; z-index: 2; } .video-gallery-style1 .icon .border-round { position: absolute; top: -7px; left: -7px; bottom: -7px; right: -7px; border: 1px solid #ffffff; border-radius: 50%; } .video-gallery-style1 .icon:hover { background-color: var(--thm-base); } .video-gallery-style1 .icon:after, .video-gallery-style1 .icon:before { content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 50%; background: transparent; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation-delay: 0.9s; animation-delay: 0.9s; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); -webkit-animation: ripple 3s infinite; animation: ripple 3s infinite; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; z-index: -1; } .video-gallery-style1 .icon:after { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .video-gallery-style1 .icon .video-popup { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-align: center; } .video-gallery-style1 .icon .video-popup span::before { position: relative; color: var(--thm-base); font-size: 25px; transition: all 200ms linear; transition-delay: 0.1s; } .video-gallery-style1 .icon:hover .video-popup span::before { color: #ffffff; } .video-gallery-style1 .title { position: relative; display: block; margin-left: 25px; } .video-gallery-style1 .title h5 { color: #ffffff; font-size: 15px; line-height: 20px; font-weight: 400; text-transform: uppercase; font-family: var(--thm-font-3); } /*** ============================================= Slogan Style2 Area Css ============================================= ***/ .slogan-style2-area { position: relative; display: block; margin-top: -100px; margin-bottom: -100px; z-index: 11; } .slogan-style2__content { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; background-color: #ffffff; padding: 52px 60px 53px; padding-right: 0; margin-right: -100px; } .slogan-style2__content:before { content: ""; position: absolute; top: 0; right: -5000px; bottom: 0; width: 5000px; background-color: #ffffff; } .slogan-style2-title-box { position: relative; display: block; padding-left: 100px; } .slogan-style2-title-box .icon { position: absolute; top: 12px; left: 0; color: var(--thm-base); font-size: 60px; } .slogan-style2-title-box .title { position: relative; display: block; } .slogan-style2-title-box .title h2 { font-size: 40px; line-height: 50px; margin: 0 0 11px; } .slogan-style2-title-box .title p { color: var(--thm-black); font-size: 20px; } .slogan-style2-phone-number { position: relative; display: flex; align-items: center; } .slogan-style2-phone-number .icon { position: relative; display: flex; align-items: center; justify-content: center; width: 95px; height: 95px; border: 2px dashed var(--thm-base); border-radius: 50%; color: var(--thm-base); font-size: 50px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .slogan-style2-phone-number .text { position: relative; flex: 1; margin-left: 30px; } .slogan-style2-phone-number .text h2 { position: relative; top: -4px; font-size: 40px; line-height: 46px; margin: 0 0 8px; } .slogan-style2-phone-number .text h2 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .slogan-style2-phone-number .text h2 a:hover { color: var(--thm-base); } .slogan-style2-phone-number .text p { font-size: 20px; line-height: 20px; } .slogan-style2-phone-number:hover .icon { color: #ffffff; background-color: var(--thm-base); border-color: var(--thm-base); animation: pulse10 3000ms infinite; } /*------------------------------------------ Team Style1 Area --------------------------------------------*/ .team-style1-area { position: relative; display: block; background: #ffffff; padding: 100px 0 110px; z-index: 10; } .team-style1-area__top { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; padding-bottom: 49px; } .team-style1-area__top .sec-title { padding-bottom: 0; } .team-style1-area__top .text-box { position: relative; top: -4px; display: block; max-width: 600px; width: 100%; } .team-style1-area__top .text-box p { color: #494949; font-size: 18px; line-height: 28px; } .team-style1-area .container { max-width: 1220px; } .team-style1-area .row { --bs-gutter-x: 10px; } .single-team-style1 { position: relative; display: block; /* margin-bottom: 30px; */ } .single-team-style1 .img-holder { position: relative; display: block; overflow: hidden; /* padding-right: 20px; */ } .single-team-style1 .img-holder .inner { position: relative; display: block; overflow: hidden; border-radius: 5px; background-color: #000000; } .single-team-style1 .img-holder .inner img { width: 100%; transition: all 200ms linear; transition-delay: 0.1s; } .single-team-style1:hover .img-holder .inner img { opacity: 0.7; transform: scale(1.05); transition: all 0.5s cubic-bezier(0.62, 0.21, 0.45, 1.52); } .single-team-style1 .title-box { position: absolute; left: 20px; bottom: 0; right: 0; background-color: var(--thm-base); border-radius: 5px; border-bottom-left-radius: 0; padding: 16px 30px 12px; transform: perspective(0px) rotateX(0deg) translateY(0%); z-index: 2; } .single-team-style1:hover .title-box { opacity: 1; transform: perspective(0px) rotateX(0deg) translateY(70px); transition: all 0.4s ease-in-out 0.1s; } .single-team-style1 .title-box .title-box__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .single-team-style1 .title-box h3 { font-size: 21px; line-height: 24px; margin-bottom: 4px; } .single-team-style1 .title-box h3 a { color: #ffffff; transition: all 200ms linear; transition-delay: 0.1s; } .single-team-style1 .title-box h3 a:hover { color: var(--thm-black); } .single-team-style1 .title-box h5 { font-size: 14px; line-height: 24px; color: #ffffff; text-transform: uppercase; letter-spacing: 0.1em; } .single-team-style1 .title-box .right { position: relative; display: block; line-height: 0; } .single-team-style1 .title-box .right a { position: relative; display: inline-block; color: #ffffff; font-size: 28px; line-height: 28px; } .single-team-style1 .overlay-content { position: absolute; left: 20px; bottom: 0; right: 0; background-color: var(--thm-base); border-radius: 5px; border-bottom-left-radius: 0; padding: 36px 30px 40px; opacity: 1; transform: perspective(400px) rotateX(0deg) translateY(116px); z-index: 1; } .single-team-style1:hover .overlay-content { opacity: 1; transform: perspective(400px) rotateX(0deg) translateY(0%); transition: all 0.4s ease-in-out 0.1s; } .single-team-style1 .overlay-content .title-box__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .single-team-style1 .overlay-content .title-box__inner h3 { font-size: 21px; line-height: 24px; margin-bottom: 3px; } .single-team-style1 .overlay-content .title-box__inner h3 a { color: #ffffff; transition: all 200ms linear; transition-delay: 0.1s; } .single-team-style1 .overlay-content .title-box__inner h3 a:hover { color: var(--thm-black); } .single-team-style1 .overlay-content .title-box__inner h5 { font-size: 14px; line-height: 24px; color: #ffffff; text-transform: uppercase; letter-spacing: 0.1em; } .single-team-style1 .overlay-content .title-box__inner .right { position: relative; display: block; line-height: 0; } .single-team-style1 .overlay-content .title-box__inner .right a { position: relative; display: inline-block; color: #ffffff; font-size: 28px; line-height: 28px; transition: all 200ms linear; transition-delay: 0.1s; } .single-team-style1 .overlay-content .title-box__inner .right a:hover { color: var(--thm-black); } .team-social-link { position: relative; display: block; padding-top: 22px; } .team-social-link ul { position: relative; display: block; } .team-social-link ul li { position: relative; float: left; margin-right: 10px; } .team-social-link ul li:last-child { margin-right: 0; } .team-social-link ul li a { position: relative; display: flex; align-items: center; justify-content: center; height: 40px; width: 40px; border: 2px solid #ffffff; background: transparent; border-radius: 50%; color: #ffffff; font-size: 14px; text-align: center; transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .team-social-link ul li a:before { position: absolute; top: -1px; left: -1px; bottom: -1px; right: -1px; background: #ffffff; border-radius: 50%; content: ""; opacity: 0; transform: scale(0.5); transform-style: preserve-3d; transition: all 0.4s cubic-bezier(0.62, 0.21, 0.45, 1.52); z-index: -1; } .team-social-link ul li:hover a:before { opacity: 1; transform: scale(1); } .team-social-link ul li:hover a { color: var(--thm-base); border-color: #ffffff; } /*** ============================================= Project Style1 Area Css ============================================= ***/ .project-style1-area { position: relative; display: block; padding: 120px 0px 120px; background-color: #f0f4fb; z-index: 10; } .project-style1-area .auto-container { max-width: 1600px; padding: 0 15px; } .project-style1-area__top { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; padding-bottom: 49px; } .project-style1-area__top .sec-title { padding-bottom: 0; } .single-project-item { position: relative; display: block; } .single-project-item .img-holder { position: relative; display: block; overflow: hidden; border-radius: 8px; } .single-project-item .img-holder img { width: 100%; transform: scale(1); } .single-project-item:hover .img-holder img { transform: scale(1.05) rotate(1deg); } .single-project-item .img-holder-img-bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #091836; opacity: 0; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); -webkit-transform-origin: top; -ms-transform-origin: top; transform-origin: top; border-radius: 6px; z-index: 1; } .single-project-item:hover .img-holder-img-bg { opacity: 0.9; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); } .single-project-item .img-holder .overlay-button { position: absolute; top: 25px; right: 25px; display: flex; flex-direction: column; justify-content: center; align-items: center; opacity: 0; -webkit-transform: perspective(400px) rotateX(20deg) translateX(100%); -ms-transform: perspective(400px) rotateX(20deg) translateX(100%); transform: perspective(400px) rotateX(20deg) translateX(100%); -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; transition-delay: 0.1s; transition-timing-function: ease-in-out; transition-duration: 0.5s; transition-property: all; z-index: 2; } .single-project-item:hover .img-holder .overlay-button { opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg) translateX(0%); -ms-transform: perspective(400px) rotateX(0deg) translateX(0%); transform: perspective(400px) rotateX(0deg) translateX(-0%); transition-delay: 0.3s; transition-timing-function: ease-in-out; transition-duration: 0.5s; transition-property: all; } .single-project-item .img-holder .overlay-button a { position: relative; display: block; background-color: #ffffff; width: 60px; height: 60px; border-radius: 5px; color: #000000; font-size: 25px; line-height: 60px; text-align: center; transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .single-project-item .img-holder .overlay-button a + a { margin-top: 10px; } .single-project-item .img-holder .overlay-button a::before { position: absolute; top: 0; left: 0; bottom: 0; right: 0; content: ""; border-radius: 5px; transform: scale(0); transform-origin: center; transform-style: preserve-3d; transition: all 0.4s cubic-bezier(0.62, 0.21, 0.45, 1.52); background-color: rgba(var(--thm-base-rgb), 0.99); z-index: -1; } .single-project-item .img-holder .overlay-button a:hover::before { transform: scaleX(1); } .single-project-item .img-holder .overlay-button a:hover { color: #ffffff; } .single-project-item .img-holder .overlay-title { position: absolute; left: 0; bottom: 0; right: 0; padding: 0 50px 42px; padding-right: 20px; transform: scaleY(0); transition: all 300ms ease 100ms; z-index: 2; } .single-project-item:hover .img-holder .overlay-title { transform: scaleY(1); transition: all 200ms linear; transition-delay: 0.1s; } .single-project-item .img-holder .overlay-title p { color: var(--thm-base); font-size: 20px; line-height: 20px; font-weight: 500; } .single-project-item .img-holder .overlay-title h4 { font-size: 22px; line-height: 30px; margin: 6px 0 0; } .single-project-item .img-holder .overlay-title h4 a { color: #ffffff; transition: all 200ms linear; transition-delay: 0.1s; } .project-style1-carousel.owl-nav-style-one.owl-theme .owl-nav { position: absolute; top: -110px; left: 0; right: 0; max-width: 1200px; margin: 0 auto; padding: 0 15px; text-align: right; } /*** ============================================= Additional Services Style1 Area Css ============================================= ***/ .additional-services-style1 { position: relative; display: block; background-color: #f4f5fa; padding: 120px 0 120px; z-index: 10; } .additional-services-style1.pdb { padding-bottom: 220px; } .additional-services-style1__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-repeat: no-repeat; background-size: cover; background-position: center; opacity: 0.25; z-index: -1; } .additional-services-style1__content { position: relative; display: block; } .additional-services-style1__content .sec-title { padding-bottom: 20px; } .additional-services-style1__content .text-top { position: relative; display: block; margin-bottom: 29px; } .additional-services-style1__content .text-top p { margin: 0; } .additional-services-style1__content .text-bottom { position: relative; display: block; } .additional-services-style1__content .text-bottom p { margin: 0; } .additional-services-style1__content-bottom { position: relative; display: block; margin-top: 32px; } .additional-services-style1__content-bottom ul { position: relative; display: block; } .additional-services-style1__content-bottom ul li { position: relative; display: block; color: var(--thm-black); font-size: 19px; line-height: 36px; font-family: var(--thm-font); font-weight: 500; padding-left: 30px; } .additional-services-style1__content-bottom ul li .icon { position: absolute; top: 10px; left: 0; line-height: 0; } .additional-services-style1__content-bottom ul li .icon span { position: relative; display: inline-block; color: var(--thm-base); font-size: 16px; line-height: 16px; } .additional-services-style1__img { position: relative; display: block; max-width: 370px; width: 100%; } .additional-services-style1__img .inner { position: relative; display: block; overflow: hidden; border-radius: 8px; } .additional-services-style1__img .inner img { width: 100%; } .additional-services-style1__img .inner .round-box1 { position: absolute; bottom: -128px; right: -203px; width: 350px; height: 350px; border: 2px solid #ffffff; border-radius: 50%; } .additional-services-style1__img .inner .round-box2 { position: absolute; bottom: -92px; right: -79px; width: 222px; height: 222px; border-radius: 50%; background-color: var(--thm-base); } /*------------------------------------------ Additional Services Style2 --------------------------------------------*/ .additional-services-style2 { position: relative; display: block; background-color: #eceef2; padding: 120px 0 80px; z-index: 10; } .additional-services-style2 .sec-title { padding-bottom: 53px; } .additional-services-style2 .sec-title h2 { margin-bottom: 20px; } .single-additional-services-style2 { position: relative; display: block; margin-bottom: 40px; } .single-additional-services-style2 .img-box { position: relative; display: block; overflow: hidden; } .single-additional-services-style2 .img-box img { width: 100%; transform: scale(1); } .single-additional-services-style2:hover .img-box img { transform: scale(1.1) rotate(0deg); } .single-additional-services-style2 .img-box::before { position: absolute; content: ""; width: 100%; height: 0%; left: 0px; top: 0px; background-color: var(--thm-base); opacity: 0.5; transition: all 500ms ease; z-index: 1; } .single-additional-services-style2:hover .img-box::before { height: 100%; opacity: 0.5; } .single-additional-services-style2 .content-box { position: relative; display: block; background-color: #ffffff; padding: 22px 0px 18px; } .single-additional-services-style2 .content-box h3 { font-size: 20px; line-height: 30px; margin-bottom: 1px; } .single-additional-services-style2 .content-box h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-additional-services-style2 .content-box h3 a:hover { color: var(--thm-base); } .single-additional-services-style2 .content-box h2 { font-size: 35px; line-height: 45px; font-family: var(--thm-font); font-weight: 600; } .single-additional-services-style2 .content-box h2 span { position: relative; display: inline-block; font-size: 28px; font-weight: 600; } /*------------------------------------------ Additional Services Style3 --------------------------------------------*/ .additional-services-style3 { position: relative; display: block; background-color: #f0f0f0; padding: 120px 0 80px; overflow: hidden; z-index: 10; } .additional-services-style3:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #f0f0f0; opacity: 0.85; z-index: -1; } .additional-services-style3__img { position: absolute; right: 0; bottom: -30px; z-index: -2; } .additional-services-style3 .sec-title { padding-bottom: 63px; } .additional-services-style3 .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .additional-services-style3 .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .additional-services-style3 .sec-title p { margin-top: 15px; } .single-additional-services-3 { position: relative; display: block; margin-bottom: 40px; } .single-additional-services-3 .img-box { position: relative; display: block; overflow: hidden; border-radius: 6px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-color: #000000; } .single-additional-services-3 .img-box img { width: 100%; transform: scale(1); } .single-additional-services-3:hover .img-box img { transform: scale(1.05) rotate(0deg); opacity: 0.7; } .single-additional-services-3 .content-box { position: relative; display: block; background-color: #ffffff; padding: 25px 29px 27px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .single-additional-services-3 .content-box h3 { font-size: 22px; line-height: 28px; font-weight: 600; margin-bottom: 10px; } .single-additional-services-3 .content-box h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-additional-services-3 .content-box h3 a:hover { color: var(--thm-base); } .single-additional-services-3 .content-box h4 { color: #8c8c8c; font-size: 17px; line-height: 27px; } .single-additional-services-3 .content-box h4 span { color: var(--thm-base); padding-left: 5px; } /*** ============================================= Contact Style1 Area ============================================= ***/ .contact-style1-area { position: relative; display: block; overflow: hidden; background-color: #eff2f5; padding: 120px 0 93px; z-index: 10; } .contact-style1__content-box { position: relative; display: block; max-width: 500px; } .contact-style1__content-box .round-box { position: absolute; top: -54px; left: -60px; width: 180px; height: 180px; border: 40px solid #dfe8f1; border-radius: 50%; } .contact-style1__content-box .sec-title { padding-bottom: 15px; } .contact-style1__content-box .sec-title h2 { color: #0e2a4e; } .contact-style1__content-box--inner { position: relative; display: block; } .contact-style1__content-box--inner p { color: #444444; } .contact-style1__content-box--inner .phone-number { position: relative; display: flex; align-items: center; margin-top: 28px; margin-bottom: 25px; } .contact-style1__content-box--inner .phone-number .img-box { position: relative; display: block; width: 70px; } .contact-style1__content-box--inner .phone-number .img-box img { border-radius: 50%; } .contact-style1__content-box--inner .phone-number .text { position: relative; flex: 1; padding-left: 30px; } .contact-style1__content-box--inner .phone-number .text h4 { color: #444444; font-size: 18px; line-height: 28px; font-weight: 600; font-family: var(--thm-font); } .contact-style1__content-box--inner .phone-number .text h3 { font-size: 22px; line-height: 30px; font-weight: 600; font-family: var(--thm-font); margin: 0px 0 0; } .contact-style1__content-box--inner .phone-number .text h3 a { color: #0b1970; transition: all 200ms linear; transition-delay: 0.1s; } .contact-style1__content-box--inner .phone-number .text h3 a:hover { color: var(--thm-base); } .contact-style1__content-box--inner .text-box2 { position: relative; display: block; padding-bottom: 18px; } .contact-style1__content-box--inner .text-box2 p { font-family: var(--thm-font); } .contact-style1__content-box--inner .text-box2 p span { font-weight: 600; } .contact-style1__content-box--inner .text-box-3 p { font-family: var(--thm-font); } .contact-style1__content-box--inner .text-box-3 p span { font-weight: 600; } .thm-form-box-1 { position: relative; display: block; } .thm-form-box-1 .row { --bs-gutter-x: 15px; } .thm-form-box-1 form { position: relative; display: block; } .thm-form-box-1 form .form-group { position: relative; display: block; padding-bottom: 20px; } .thm-form-box-1 form .input-box { position: relative; display: block; } .thm-form-box-1 form input[type="text"], .thm-form-box-1 form input[type="email"], .thm-form-box-1 form textarea { position: relative; display: block; background: #ffffff; border: 1px solid #dbdcdd; width: 100%; height: 62px; color: #444444; font-size: 18px; font-weight: 400; font-style: normal; padding-left: 25px; padding-right: 25px; border-radius: 8px; transition: all 500ms ease; font-family: var(--thm-font); } .thm-form-box-1 form input[type="text"]:focus, .thm-form-box-1 form input[type="email"]:focus, .thm-form-box-1 form textarea:focus { border: 1px solid var(--thm-base); outline: none; } .thm-form-box-1 form textarea { height: 230px; padding-top: 12px; padding-left: 25px; padding-right: 25px; padding-bottom: 10px; } .thm-form-box-1 form input[type="text"]::-webkit-input-placeholder { color: #444444; } .thm-form-box-1 form input[type="text"]:-moz-placeholder { color: #444444; } .thm-form-box-1 form input[type="text"]::-moz-placeholder { color: #444444; } .thm-form-box-1 form input[type="text"]:-ms-input-placeholder { color: #444444; } .thm-form-box-1 form input[type="email"]::-webkit-input-placeholder { color: #444444; } .thm-form-box-1 form input[type="email"]:-moz-placeholder { color: #444444; } .thm-form-box-1 form input[type="email"]::-moz-placeholder { color: #444444; } .thm-form-box-1 form input[type="email"]:-ms-input-placeholder { color: #444444; } .thm-form-box-1 form textarea::-webkit-input-placeholder { color: #444444; } .thm-form-box-1 form textarea:-moz-placeholder { color: #444444; } .thm-form-box-1 form textarea::-moz-placeholder { color: #444444; } .thm-form-box-1 form textarea:-ms-input-placeholder { color: #444444; } .thm-form-box-1 form .form-group .select-box { position: relative; display: block; width: 100%; } .thm-form-box-1 form .form-group .nice-select { position: relative; display: block; background-color: #fff; border-radius: 8px; border: solid 1px #dbdcdd; width: 100%; height: 60px; color: #444444; font-size: 18px; font-weight: 400; line-height: 58px; outline: none; padding-left: 25px; padding-right: 25px; transition: all 0.2s ease-in-out; font-family: var(--thm-font); } .thm-form-box-1 form .form-group .nice-select:after { position: absolute; content: "\e926"; font-family: "icomoon" !important; color: #7f7873; font-size: 12px; top: 0px; right: 30px; bottom: 0; margin: 0px; font-weight: 400; border: none !important; transform: rotate(0deg) !important; } .thm-form-box-1 form .form-group .nice-select .list { background-color: #ffffff; border-radius: 0px; box-shadow: 0 0 10px rgb(0 0 0 / 10%); padding: 0px 0 0px; margin-top: 10px; } .thm-form-box-1 form .form-group .nice-select .option { padding-left: 20px; padding-right: 20px; font-size: 15px; line-height: 40px; min-height: 40px; } .thm-form-box-1 form .button-box { position: relative; display: block; padding-top: 10px; } .thm-form-box-1 form .button-box button { width: 100%; } /*** ============================================= Contact-Style2 Area Css ============================================= ***/ .contact-style2-area { position: relative; display: block; background-color: transparent; margin-top: -30px; z-index: 10; } .contact-style2-area__inner { position: relative; display: flex; z-index: 1; } .contact-style2-area__inner:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: -100000px; background-color: #f9fbfd; border-bottom: 1px solid #e8ecef; border-top-left-radius: 10px; border-bottom-left-radius: 10px; z-index: -1; } .video-gallery-style2 { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; width: 375px; height: 200px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .video-gallery-style2-bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: cover; background-repeat: no-repeat; background-position: top center; background-color: var(--thm-base); background-blend-mode: multiply; } .video-gallery-style2 .icon { position: relative; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; background: #ffffff; border-radius: 50%; transition: all 200ms linear; transition-delay: 0.1s; z-index: 2; } .video-gallery-style2 .icon:after, .video-gallery-style2 .icon:before { content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 50%; background: transparent; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation-delay: 0.9s; animation-delay: 0.9s; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); -webkit-animation: ripple 3s infinite; animation: ripple 3s infinite; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; z-index: -1; } .video-gallery-style2 .icon:after { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .video-gallery-style2 .icon .video-popup { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-align: center; z-index: 1; } .video-gallery-style2 .icon .video-popup:before { content: ""; position: absolute; top: -10px; left: -10px; bottom: -10px; right: -10px; background-color: #ffffff; border-radius: 50%; opacity: 0.5; z-index: -1; } .video-gallery-style2 .icon .video-popup span::before { position: relative; color: var(--thm-black); font-size: 20px; transition: all 200ms linear; transition-delay: 0.1s; } .video-gallery-style2 .icon:hover .video-popup span::before { color: var(--thm-base); } .contact-style2-content { position: relative; margin-right: -345px; flex: 1; } .contact-style2-content ul { position: relative; display: flex; } .contact-style2-content ul li { position: relative; display: block; width: 380px; } .contact-style2-content ul li:nth-child(2) .contact-style2-single-box { background-color: #ffffff; } .contact-style2-single-box { position: relative; display: block; background-color: #f9fbfd; border-bottom: 1px solid #e8ecef; padding: 31px 40px 25px; } .contact-style2-single-box .icon { position: relative; display: block; line-height: 0; } .contact-style2-single-box .icon span { color: #1263ea; font-size: 64px; line-height: 64px; } .contact-style2-single-box .title { position: relative; display: block; padding-top: 23px; } .contact-style2-single-box .title h3 { font-size: 20px; line-height: 28px; } .contact-style2-single-box .title p { color: var(--thm-gray); } .contact-style2-single-box .title p a { color: var(--thm-gray); transition: all 200ms linear; transition-delay: 0.1s; } .contact-style2-single-box .title p a:hover { color: var(--thm-base); } /*------------------------------------------ Service Areas Style1 --------------------------------------------*/ .service-areas-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0px 120px; border-top: 1px solid #d2d7dc; z-index: 10; } .service-areas-style1__bg-img { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-repeat: no-repeat; background-attachment: scroll; background-position: top right; opacity: 0.06; } .service-areas-style1__title { position: relative; display: block; } .service-areas-style1__title .sec-title { padding-bottom: 0; } .service-areas-style1__content { position: relative; display: block; margin-top: -9px; } .single-service-areas-style1 { position: relative; display: block; } .single-service-areas-style1 ul { position: relative; display: block; } .single-service-areas-style1 ul li { position: relative; display: block; font-size: 18px; line-height: 28px; font-family: var(--thm-font); font-weight: 500; } .single-service-areas-style1 ul li + li { margin-top: 9px; } .single-service-areas-style1 ul li a { position: relative; display: inline-block; color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-service-areas-style1 ul li a:hover { color: var(--thm-base); padding-left: 3px; } /*------------------------------------------ flixible price Style1 Css --------------------------------------------*/ .flixible-price-style1 { position: relative; display: block; background-color: #f7eeee; padding: 120px 0 120px; z-index: 10; } .flixible-price-style1 .row { --bs-gutter-x: 100px; } .flixible-price-style1 .sec-title { padding-bottom: 41px; } .flixible-price-style1 .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .flixible-price-style1 .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .single-flixible-price-style1-box { position: relative; display: block; } .single-flixible-price-style1-box ul { position: relative; display: block; } .single-flixible-price-style1-box ul li { position: relative; display: block; color: oklch(0.444 0.177 26.899); font-size: 20px; line-height: 30px; font-weight: 500; font-family: var(--thm-font); z-index: 1; } .single-flixible-price-style1-box ul li + li { margin-top: 24px; } .single-flixible-price-style1-box ul li::before { content: ""; position: absolute; left: 0; bottom: 7px; right: 0; height: 2px; border-bottom: 2px dotted var(--thm-black); z-index: -1; } .single-flixible-price-style1-box ul li span { position: relative; display: inline-block; background-color: #f7eeee; padding-right: 10px; } .single-flixible-price-style1-box ul li b { position: relative; display: inline-block; float: right; background-color: #f7eeee; padding-left: 10px; font-weight: 500; } .flixible-price-style1 .btns-box { position: relative; display: block; line-height: 0; padding-top: 53px; } .flixible-price-style1__btn { position: relative; display: block; line-height: 0; padding-top: 53px; } /*---------------------------------------- Featured Services Style1 ---------------------------------------*/ .featured-service-style1 { position: relative; display: block; background-color: #f7f8fb; padding: 120px 0 120px; z-index: 10; } .featured-service-style1 .sec-title { padding-bottom: 49px; } .featured-service-style1 .sec-title .sub-title { align-items: center; justify-content: center; text-align: center; } .single-featured-service-style1 { position: relative; display: block; } .single-featured-service-style1 .img-box { position: relative; display: block; overflow: hidden; border-radius: 5px; } .single-featured-service-style1__overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; z-index: 2; } .single-featured-service-style1 .img-box img { width: 100%; transform: scale(1); } .single-featured-service-style1:hover .img-box img { transform: scale(1.05) rotate(0deg); } .single-featured-service-style1 .title-box { position: relative; display: block; margin-right: 25px; margin-top: -50px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #ffffff; padding-left: 130px; z-index: 3; } .single-featured-service-style1 .title-box .icon { position: absolute; top: 0; left: 0; border-bottom-left-radius: 5px; background-color: var(--thm-primary); width: 100px; height: 90px; display: flex; align-items: center; justify-content: center; } .single-featured-service-style1 .title-box .icon span { position: relative; display: inline-block; color: #ffffff; font-size: 50px; } .single-featured-service-style1 .title-box .inner-title { position: relative; display: block; padding: 17px 0px 17px; } .single-featured-service-style1 .title-box .inner-title h3 { font-size: 23px; line-height: 28px; } .single-featured-service-style1 .title-box .inner-title h3 a { color: var(--thm-black); transition: all 200ms linear; transition-delay: 0.1s; } .single-featured-service-style1 .title-box .inner-title h3 a:hover { color: var(--thm-base); } /*------------------------------------------ Features Facts Css --------------------------------------------*/ .features-facts { position: relative; display: block; background-color: #ffffff; padding: 0px 0 120px; z-index: 10; } .features-facts.pdtop { padding-top: 120px; } .features__content { position: relative; display: block; padding-right: 60px; } .features__content .sec-title { padding-bottom: 20px; } .features__content .text { position: relative; display: block; } .features__content .text p + p { margin-top: 24px; } .features__content-list-item { position: relative; display: block; padding-top: 34px; } .features__content-list-item ul { position: relative; display: block; } .features__content-list-item ul li { position: relative; display: block; padding-left: 30px; color: var(--thm-black); font-weight: 500; } .features__content-list-item ul li + li { margin-top: 4px; } .features__content-list-item ul li .icon { position: absolute; top: 4px; left: 0; color: var(--thm-primary); font-size: 20px; line-height: 20px; } .facts-content-box-style2 { position: relative; display: block; padding-left: 80px; } .facts-content-box-style2:before { content: ""; position: absolute; top: 0px; left: 0; bottom: 0; width: 1px; background-color: #c2c3c6; } .facts-content-box-style2 ul { position: relative; } .facts-content-box-style2 .single-fact-counter { position: relative; display: flex; align-items: center; max-width: 100%; width: 100%; margin-bottom: 74px; } .facts-content-box-style2 .single-fact-counter:last-child { margin-bottom: 0; } .facts-content-box-style2 .single-fact-counter .icon { width: 90px; top: 3px; } .facts-content-box-style2 .single-fact-counter .count-box { position: relative; display: flex; align-items: center; color: var(--thm-black); font-size: 50px; line-height: 50px; font-weight: 900; font-family: var(--thm-font); } .facts-content-box-style2 .single-fact-counter .title { padding-top: 10px; } .facts-content-box-style2 .single-fact-counter .title h6 { color: var(--thm-primary); font-size: 18px; font-weight: 600; font-family: var(--thm-font); } /*------------------------------------------ Service Style6 Css --------------------------------------------*/ .service-style6 { position: relative; display: block; background-color: #f4f4f4; padding: 120px 0 120px; } .service-style6__top { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; padding-bottom: 59px; } .service-style6__top .sec-title { padding-bottom: 0; } .service-style6__top .text-box { position: relative; top: -4px; display: block; max-width: 600px; width: 100%; } .service-style6__top .text-box p { color: #494949; font-size: 18px; line-height: 28px; } .single-service-style6 { position: relative; display: block; border-right: 1px solid #bdbdbd; } .single-service-style6 .icon { position: relative; display: block; } .single-service-style6 .icon span { color: var(--thm-base); font-size: 60px; line-height: 60px; } .single-service-style6 h3 { font-size: 28px; line-height: 35px; font-weight: 700; margin-top: 29px; font-family: var(--thm-font); } .single-service-style6 h3 a { color: var(--thm-black); } .single-service-style6 h3 span { font-weight: 400; } .single-service-style6 .btn-box { position: relative; display: inline-block; margin-top: 44px; } .single-service-style6 .btn-box a { color: var(--thm-base); font-size: 14px; line-height: 24px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; font-family: var(--thm-font-2); } .single-service-style6 .btn-box a span { position: relative; display: inline-block; color: #090909; font-size: 20px; line-height: 20px; font-weight: 700; padding-left: 15px; top: 4px; } .service-style6__carousel { position: relative; } .service-style6__carousel:before { content: ""; position: absolute; top: 0; right: -3px; bottom: 0; width: 5px; background-color: #f4f4f4; z-index: 10; } .service-style6__carousel.owl-carousel.owl-dot-style1 .owl-dots { margin-top: 60px !important; } /*** ============================================= Fact Counetr Video Area ============================================= ***/ .fact-counetr-video-area { position: relative; display: block; overflow: hidden; padding: 120px 0 67px; z-index: 10; } .fact-counetr-video-area__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: top center; z-index: -1; } .fact-counetr-video-area__bg:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #000000; opacity: 0.7; z-index: -1; } .fact-counetr-video__content { position: relative; display: block; } .fact-counetr-video__content .title-box { position: relative; display: block; margin-top: -9px; padding-bottom: 48px; border-bottom: 1px solid rgba(119, 120, 120, 0.4); } .fact-counetr-video__content .title-box h2 { color: #ffffff; font-size: 47px; line-height: 56px; } .fact-counetr-video__content .title-box h2 span { font-weight: 400; } .fact-counter-box-3 { position: relative; display: block; padding-top: 56px; } .fact-counter-box-3 .single-fact-counter { max-width: 100%; width: 100%; align-items: flex-start; margin-bottom: 46px; } .fact-counter-box-3 .single-fact-counter .icon { top: 4px; } .fact-counter-box-3 .single-fact-counter .outer-box { flex: 1; } .fact-counter-box-3 .single-fact-counter .count-box { color: #ffffff; font-size: 35px; line-height: 35px; font-weight: 700; font-family: var(--thm-font-2); } .fact-counter-box-3 .single-fact-counter .count-box span { line-height: 35px; } .fact-counter-box-3 .single-fact-counter .count-box i { top: -1px; padding-left: 5px; font-size: 25px; } .fact-counter-box-3 .single-fact-counter .title { padding-top: 5px; } .fact-counter-box-3 .single-fact-counter .title h6 { color: #ffffff; font-size: 18px; line-height: 28px; font-weight: 500; } .video-gallery-style3-outer { position: relative; display: block; width: 225px; float: right; } .video-gallery-style3-outer .video-gallery-style2 { width: 225px; height: 230px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 0px; } .video-gallery-style3-outer .video-gallery-style2-bg { background-color: #000000; background-blend-mode: normal; } .video-gallery-style3-outer .video-gallery-style2-bg:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #000000; opacity: 0.4; } .video-gallery-style3-outer .video-gallery-style2 .icon { width: 70px; height: 70px; } .video-gallery-style3-outer .video-gallery-style2 .icon .video-popup span::before { font-size: 25px; } .video-gallery-style3-outer .title-box { position: relative; display: block; background-color: #ffffff; padding: 30px 0 33px; text-align: center; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .video-gallery-style3-outer .title-box h3 { font-size: 24px; line-height: 30px; font-family: var(--thm-font); } .video-gallery-style3-outer .title-box h3 a { color: #000000; } /*** ============================================= Benefits Style1 Css ============================================= ***/ .benefits-style1 { position: relative; display: block; overflow: hidden; background-color: #ffffff; padding: 120px 0 72px; z-index: 10; } .benefits-style1 .shape-1 { position: absolute; top: 0; left: 0; opacity: 0.15; } .benefits-style-1__content { position: relative; display: block; margin-right: -30px; } .benefits-style-1__content .sec-title { padding-bottom: 30px; } .benefits-style-1__content .text { position: relative; display: block; } .benefits-style-1__content .text p { margin: 0; } .benefits-style-1__content ul { position: relative; display: block; margin-top: 46px; } .benefits-style-1__content ul li { position: relative; display: block; width: 50%; float: left; padding-left: 80px; padding-right: 40px; margin-bottom: 41px; } .benefits-style-1__content ul li:before { content: ""; position: absolute; top: 7px; right: 30px; bottom: 7px; width: 1px; background-color: #eeeeee; } .benefits-style-1__content ul li:nth-child(2):before { display: none; } .benefits-style-1__content ul li:nth-child(4):before { display: none; } .benefits-style-1__content ul li:nth-child(6):before { display: none; } .benefits-style-1__content ul li .icon { position: absolute; top: 7px; left: 0; width: 65px; } .benefits-style-1__content ul li:nth-child(4) .icon { left: -8px; top: 7px; } .benefits-style-1__content ul li .icon img { position: relative; display: inline-block; transition: all 200ms linear; transition-delay: 0.1s; } .benefits-style-1__content ul li:hover .icon img { transform: rotateY(180deg); } .benefits-style-1__content ul li h3 { color: #242424; font-size: 20px; line-height: 28px; font-family: var(--thm-font); font-weight: 600; margin-bottom: 5px; } .benefits-style-1__content ul li p { margin: 0; } .benefits-style-1__img-box { position: relative; display: block; margin-right: -80px; margin-left: 30px; max-width: 520px; } .benefits-style-1__img-box ul { position: relative; display: block; overflow: hidden; } .benefits-style-1__img-box ul li { position: relative; display: block; width: 50%; height: 285px; float: left; } .benefits-style-1__img-box ul li:nth-child(2) { background-color: #a91717; margin-top: 40px; } .benefits-style-1__img-box ul li:nth-child(3) { background-color: #3b3c41; } .benefits-style-1__img-box ul li .single-box { position: relative; display: block; overflow: hidden; width: 100%; height: 100%; } .benefits-style-1__img-box ul li .single-box .icon { position: absolute; top: 5px; right: 0px; opacity: 0.1; } .benefits-style-1__img-box ul li:nth-child(3) .single-box .icon { top: 15px; right: -35px; } .benefits-style-1__img-box ul li .single-box__inner { position: relative; display: block; padding: 58px 40px 0; } .benefits-style-1__img-box ul li .single-box__inner .btn-box { position: relative; display: block; } .benefits-style-1__img-box ul li .single-box__inner .btn-box a { color: #0c0c0c; letter-spacing: normal; } .benefits-style-1__img-box ul li:nth-child(3) .single-box__inner .btn-box a { color: var(--thm-base); } .benefits-style-1__img-box ul li .single-box__inner .btn-box a span { color: #0c0c0c; padding-left: 5px; } .benefits-style-1__img-box ul li:nth-child(3) .single-box__inner .btn-box a span { color: var(--thm-base); } .benefits-style-1__img-box ul li .single-box__inner h2 { font-size: 28px; line-height: 36px; margin: 88px 0 0; } .benefits-style-1__img-box ul li .single-box__inner h2 a { color: #ffffff; } /*** ============================================= Heating System Style1 Css ============================================= ***/ .heating-system-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; border-top: 1px solid #bdbdbd; z-index: 10; } .heating-system-style1__img-box { position: relative; display: block; max-width: 665px; } .heating-system-style1__img-box .inner { position: relative; display: block; } .heating-system-style1__img-box .inner img { width: 100%; } .heating-system-style1__img-box .single-item { position: absolute; display: flex; align-items: center; cursor: pointer; } .heating-system-style1__img-box .single-item.single-item--style2 { flex-direction: row-reverse; } .heating-system-style1__img-box .single-item.single-item--style2 .round-box { margin-right: 0px; margin-left: 25px; } .heating-system-style1__img-box .single-item.single-item--style2 p:before { left: auto; right: -12px; border-left: 12px solid #f2f2f2; border-right: none; } .heating-system-style1__img-box .single-item.one { top: 10px; right: 120px; } .heating-system-style1__img-box .single-item.two { top: 43%; right: 15px; transform: translateY(-50%); } .heating-system-style1__img-box .single-item.three { right: 30px; bottom: 35px; } .heating-system-style1__img-box .single-item.four { top: 150px; left: 210px; } .heating-system-style1__img-box .single-item .round-box { position: relative; display: block; width: 25px; height: 25px; background-color: var(--thm-base); border: 8px solid #ffffff; border-radius: 50%; margin-right: 25px; z-index: 2; } .heating-system-style1__img-box .single-item .round-box:before, .heating-system-style1__img-box .single-item .round-box:after { content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 50%; background: transparent; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation-delay: 0.9s; animation-delay: 0.9s; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9); -webkit-animation: ripple 5s infinite; animation: ripple 5s infinite; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; z-index: -1; } .heating-system-style1__img-box .single-item .round-box:after { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .heating-system-style1__img-box .single-item p { position: relative; display: inline-block; background-color: #f2f2f2; padding: 0 15px; color: #444444; font-size: 17px; line-height: 35px; font-weight: 500; transition: all 500ms ease; } .heating-system-style1__img-box .single-item p:before { content: ""; position: absolute; width: 12px; height: 14px; top: 10px; left: -12px; border-right: 12px solid #f2f2f2; border-top: 7px solid transparent; border-bottom: 7px solid transparent; } .heating-system-style1__content { position: relative; display: block; padding-left: 70px; } .heating-system-style1__content .inner-title { position: relative; display: block; padding-left: 40px; margin-bottom: 13px; } .heating-system-style1__content .inner-title .border-left { position: absolute; top: 10px; left: 0; bottom: 0; width: 30px; height: 2px; background-color: var(--thm-base); } .heating-system-style1__content .inner-title p { color: var(--thm-base); text-transform: uppercase; letter-spacing: 0.1em; font-size: 14px; line-height: 24px; font-family: var(--thm-font-2); font-weight: 700; } .heating-system-style1__content .text { position: relative; display: block; } .heating-system-style1__content .text p { margin: 0; } .heating-system-style1__content ul { position: relative; display: block; margin-top: 28px; } .heating-system-style1__content ul li { position: relative; display: block; padding-left: 35px; color: #444444; font-size: 18px; line-height: 28px; font-family: var(--thm-font); font-weight: 600; } .heating-system-style1__content ul li + li { margin-top: 9px; } .heating-system-style1__content ul li .icon { position: absolute; top: 5px; left: 0; line-height: 0; } .heating-system-style1__content ul li .icon span { position: relative; display: inline-block; color: #080808; font-size: 20px; line-height: 20px; } /*------------------------------------------ Mission Content Css --------------------------------------------*/ .mission-content-box { position: relative; display: flex; align-items: center; flex-wrap: wrap; border-top: 1px solid #d5d5d5; margin-top: 100px; padding-top: 100px; } .mission-content-box .img-box { position: relative; display: block; width: 370px; overflow: hidden; border-radius: 8px; } .mission-content-box .img-box img { width: 100%; } .mission-content-box .text-box { position: relative; flex: 1; margin-left: 50px; margin-right: 50px; } .mission-content-box .text-box p { color: #0e2a4e; font-size: 20px; line-height: 30px; font-weight: 700; } /*------------------------------------------ Start about our service --------------------------------------------*/ .about-our-service { position: relative; display: block; background-color: #ffffff; padding: 120px 0px 113px; z-index: 10; } .about-our-service__content { position: relative; display: block; padding-right: 80px; } .about-our-service__content .sec-title { padding-bottom: 30px; } .about-our-service__content .text-top { position: relative; display: block; margin-bottom: 29px; } .about-our-service__content .text-top p { margin: 0; } .about-our-service__content .text-bottom { position: relative; display: block; } .about-our-service__content .text-bottom p { margin: 0; } .about-our-service__list-item { position: relative; display: block; margin-top: 118px; margin-left: -30px; } .about-our-service__list-item::before { position: absolute; content: ""; top: 6px; left: -65px; bottom: -65px; right: 0; width: 1px; background-color: #dddddd; margin-left: 12px; } .about-our-service__list-item ul { position: relative; display: block; } .about-our-service__list-item ul li { position: relative; display: block; padding-left: 45px; color: var(--thm-black); font-size: 20px; line-height: 30px; font-family: var(--thm-font); font-weight: 500; } .about-our-service__list-item ul li + li { margin-top: 14px; } .about-our-service__list-item ul li .icon { position: absolute; left: 0; top: -2px; } .about-our-service__list-item ul li .icon span { position: relative; display: inline-block; top: 3px; color: var(--thm-base); font-size: 20px; line-height: 30px; margin-right: 20px; } /*------------------------------------------ Sercvice Estimate Style1 Css --------------------------------------------*/ .sercvice-estimate-style1 { position: relative; display: block; padding: 120px 0 120px; z-index: 11; } .sercvice-estimate-style1__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: left top; z-index: -2; } .sercvice-estimate-style1__bg:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #0e3e73; opacity: 0.75; } .sercvice-estimate-style1__img-outer { position: absolute; top: 0; left: 0; bottom: 0; right: 0; max-width: 1920px; width: 100%; margin: 0 auto; z-index: -1; } .sercvice-estimate-style1__img-outer .img-bg { position: absolute; top: 0; right: 0; bottom: 0; width: 645px; background-size: cover; background-repeat: no-repeat; background-position: top right; } .sercvice-estimate-style1__content { position: relative; display: block; } .sercvice-estimate-style1__content .sec-title { padding-bottom: 33px; } .sercvice-estimate-style1__content .sec-title .sub-title .border-left { background-color: #ffffff; } .sercvice-estimate-style1__content .sec-title .sub-title h5 { color: #ffffff; } .sercvice-estimate-style1__content .sec-title h2 { color: #ffffff; } .sercvice-estimate-style1__content .sec-title p { color: #ffffff; margin: 10px 0 0; } .sercvice-estimate-style1__content .sec-title p a { color: #ffffff; text-decoration: underline; } .sercvice-estimate-style1__content .sec-title p a:hover { color: #000000; } .sercvice-estimate-form { position: relative; display: block; } .sercvice-estimate-form .form-group { position: relative; display: block; margin-bottom: 20px; } .sercvice-estimate-form .form-group h6 { color: #ffffff; font-size: 14px; line-height: 31px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 9px; } .sercvice-estimate-form form .select-box { position: relative; display: block; width: 100%; } .sercvice-estimate-form form .nice-select { position: relative; display: block; background-color: #ffffff; border-radius: 4px; border: solid 1px #ece6e6; width: 100%; height: 60px; color: #444444; font-size: 18px; font-weight: 400; line-height: 58px; outline: none; padding-left: 25px; padding-right: 25px; transition: all 0.2s ease-in-out; font-family: var(--thm-font); } .sercvice-estimate-form form .nice-select:after { position: absolute; content: "\e926"; font-family: "icomoon" !important; color: #626378; font-size: 12px; top: 0px; right: 30px; bottom: 0; margin: 0px; font-weight: 400; border: none !important; transform: rotate(0deg) !important; } .sercvice-estimate-form form .nice-select .list { background-color: #ffffff; border-radius: 0px; box-shadow: 0 0 10px rgb(0 0 0 / 10%); padding: 0px 0 0px; margin-top: 10px; -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; -webkit-transform: scale(1) translateY(-30px); -ms-transform: scale(1) translateY(-30px); transform: scale(1) translateY(-30px); -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; height: 0; } .sercvice-estimate-form form .nice-select.open .list { opacity: 1; pointer-events: auto; -webkit-transform: scale(1) translateY(0); -ms-transform: scale(1) translateY(0); transform: scale(1) translateY(0); height: auto; } .sercvice-estimate-form form .nice-select .option { padding-left: 20px; padding-right: 20px; font-size: 15px; line-height: 40px; min-height: 40px; } .home-size { position: relative; display: block; margin-bottom: 45px; } .home-size .inner { position: relative; display: block; overflow: hidden; } .home-size .inner .left { position: relative; display: block; float: left; } .home-size .inner .left label.control-label { color: #ffffff; font-size: 14px; line-height: 20px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; font-family: var(--thm-font-2); margin: 0; } .home-size .inner .right { position: relative; display: block; float: right; top: 3px; } .home-size .inner .right input#amount { position: relative; display: block; width: 160px; height: auto; padding: 0; color: #ffffff; font-size: 14px; line-height: 28px; font-weight: 700; text-transform: uppercase; background-color: transparent; border: none; text-align: right; box-shadow: none; font-family: var(--thm-font-2); letter-spacing: 0.1em; } .home-size .ui-widget-content { position: relative; background: #ffffff; border: none; height: 8px; border-radius: 4px !important; margin: 23px 0 0; border-radius: 0; text-align: left; } .home-size .ui-slider-handle { position: absolute; background: #ffffff; border: 4px solid var(--thm-base); border-radius: 50%; height: 30px; width: 30px !important; margin-left: -15px !important; outline: medium none; cursor: pointer; z-index: 2; } .home-size .ui-slider-horizontal .ui-slider-handle { top: -12px; } .home-size .ui-slider .ui-slider-range { background: var(--thm-base); border-radius: 4px; } .sercvice-estimate-form form .total-amount { position: relative; display: block; margin-top: -14px; } .sercvice-estimate-form form .total-amount h6 { color: #ffffff; font-size: 14px; line-height: 20px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 3px; } .sercvice-estimate-form form .total-amount h2 { color: #ffffff; font-size: 45px; line-height: 50px; font-weight: 700; font-family: var(--thm-font); } .sercvice-estimate-style1__right-box { position: relative; display: block; padding-top: 55px; margin-left: 55px; } .sercvice-estimate-style1__right-box ul { position: relative; display: block; } .sercvice-estimate-style1__right-box ul li { position: relative; display: flex; flex-direction: column; justify-content: center; width: 270px; height: 235px; background-color: var(--thm-primary); padding: 30px 30px 30px; padding-right: 30px; } .sercvice-estimate-style1__right-box ul li:first-child { padding-top: 40px; } .sercvice-estimate-style1__right-box ul li:last-child { background-color: var(--thm-base); } .sercvice-estimate-style1__right-box ul li h2 { color: #ffffff; font-size: 35px; line-height: 40px; font-weight: 800; margin: 0 0 17px; font-family: var(--thm-font); } .sercvice-estimate-style1__right-box ul li p { color: #ffffff; font-size: 25px; line-height: 30px; font-weight: 500; } .sercvice-estimate-style1__right-box ul li .btn-box { position: relative; display: block; padding-top: 20px; } .sercvice-estimate-style1__right-box ul li .btn-box a { color: var(--thm-black); padding: 0; line-height: 50px; width: 100%; text-align: center; } .sercvice-estimate-style1__right-box ul li .btn-box a:hover { color: #ffffff; } .sercvice-estimate-style1__right-box ul li .btn-box a:after { background-image: none; background-color: #ffffff; } .sercvice-estimate-style1__right-box ul li .btn-box a:before { background-color: var(--thm-black); } /*------------------------------------------ Sercvice Estimate Style2 Css --------------------------------------------*/ .sercvice-estimate-style2 { position: relative; display: block; padding: 120px 0 120px; z-index: 11; } .sercvice-estimate-style2__bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: top right; z-index: -1; } .sercvice-estimate-style2 .sercvice-estimate-form { max-width: 670px; } .sercvice-estimate-style2__right-box { position: relative; display: block; } .sercvice-estimate-style2__right-box ul { position: relative; display: block; } .sercvice-estimate-style2__right-box ul li { position: relative; display: flex; flex-direction: column; justify-content: center; width: 270px; height: 235px; background-color: var(--thm-base); padding: 30px 30px 30px; text-align: center; } .sercvice-estimate-style2__right-box ul li:last-child { background-color: var(--thm-base); } .sercvice-estimate-style2__right-box ul li:last-child::before { content: ""; position: absolute; top: 0; left: 40px; right: 40px; height: 1px; background-color: #ffffff; opacity: 0.4; } .sercvice-estimate-style2__right-box ul li h2 { color: #ffffff; font-size: 35px; line-height: 40px; font-weight: 700; margin: 0 0 17px; font-family: var(--thm-font); } .sercvice-estimate-style2__right-box ul li p { color: #ffffff; font-size: 25px; line-height: 30px; font-weight: 500; } /*** ============================================= Appointment Area Css ============================================= ***/ .appointment-area { position: relative; display: block; background: #ffffff; padding: 120px 0 120px; z-index: 10; } .appointment-title { position: relative; display: block; margin-top: -9px; padding-bottom: 52px; } .appointment-title h2 { color: #0e2a4e; font-size: 45px; line-height: 53px; font-weight: 900; margin: 0 0 20px; } .appointment-title p { margin: 0; } .appointment-form-box { position: relative; display: block; max-width: 790px; width: 100%; } .appointment-form .single-box .inner-title { position: relative; display: block; padding-bottom: 16px; } .appointment-form .single-box .inner-title h3 { color: #0e2a4e; font-size: 18px; line-height: 20px; font-weight: 600; font-family: var(--thm-font); } .appointment-form { position: relative; display: block; } .appointment-form .single-box { position: relative; display: block; overflow: hidden; margin-bottom: 30px; } .appointment-form .single-box.selectbox { overflow: inherit; } .appointment-form .single-box .jobsite-address input { margin-bottom: 20px; } .appointment-checkbox { position: relative; display: block; } .appointment-checkbox .single-checkbox { position: relative; display: inline-block; float: left; margin-right: 30px; } .appointment-checkbox label { position: relative; display: inline-block; padding-left: 30px; margin-right: 0px; margin-bottom: 0; color: #444444; font-size: 18px; line-height: 30px; font-weight: 400; cursor: pointer; font-family: var(--thm-font); } .appointment-checkbox input[type="checkbox"] { display: none; } .appointment-checkbox input[type="checkbox"] + label span { position: absolute; display: block; top: 8px; left: 0; width: 15px; height: 15px; vertical-align: middle; background-color: #aeb3b9; border: 1px solid #8e8f8f; cursor: pointer; border-radius: 0; transition: all 300ms ease; } .appointment-checkbox label span:before { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; font-family: "icomoon" !important; content: "\e947"; color: #000000; font-size: 13px; line-height: 13px; text-align: center; border-radius: 50%; opacity: 0; background-color: transparent; transition: all 300ms ease; } .appointment-checkbox input[type="checkbox"]:checked + label span { border-color: #16232a; } .appointment-checkbox input[type="checkbox"]:checked + label span:before { opacity: 1; } .appointment-form input[type="text"], .appointment-form input[type="email"], .appointment-form textarea { position: relative; display: block; background: #ffffff; border: 1px solid #dddddd; width: 100%; height: 40px; color: #444444; font-size: 18px; font-weight: 400; padding-left: 20px; padding-right: 20px; border-radius: 0px; transition: all 500ms ease; font-family: var(--thm-font); } .appointment-form textarea { height: 180px; } .appointment-form .date-box { position: relative; display: block; width: 270px; } .appointment-form .date-box .icon { position: absolute; top: 50%; transform: translateY(-50%); right: 20px; color: #898989; font-size: 16px; } .appointment-form .date-box .icon span:before { position: relative; top: 2px; } .appointment-form .time-box { position: relative; display: block; width: 270px; } .appointment-form .time-box .icon { position: absolute; top: 50%; transform: translateY(-50%); right: 20px; color: #898989; font-size: 16px; } .appointment-form .time-box .icon span:before { position: relative; top: 2px; } .newsletter-checkbox { position: relative; display: block; } .newsletter-checkbox label { position: relative; display: inline-block; padding-left: 30px; margin-right: 0px; margin-bottom: 0; color: #444444; font-size: 18px; line-height: 26px; font-weight: 400; cursor: pointer; font-family: var(--thm-font); } .newsletter-checkbox input[type="checkbox"] { display: none; } .newsletter-checkbox input[type="checkbox"] + label span { position: absolute; display: block; top: 8px; left: 0; width: 15px; height: 15px; vertical-align: middle; background-color: #cbcfd5; border: 1px solid #8e8f8f; cursor: pointer; border-radius: 0; transition: all 300ms ease; } .newsletter-checkbox label span:before { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; font-family: "icomoon" !important; content: "\e947"; color: #000000; font-size: 12px; line-height: 13px; font-weight: 500; text-align: center; border-radius: 0%; opacity: 0; background-color: transparent; transition: all 300ms ease; } .newsletter-checkbox input[type="checkbox"]:checked + label span { border-color: #16232a; } .newsletter-checkbox input[type="checkbox"]:checked + label span:before { opacity: 1; } .appointment-form .select-box { position: relative; display: block; width: 100%; } .appointment-form .nice-select { position: relative; display: block; background-color: #ffffff; border-radius: 0px; border: solid 1px #dddddd; width: 100%; height: 40px; color: #444444; font-size: 18px; font-weight: 400; line-height: 38px; outline: none; padding-left: 20px; padding-right: 20px; transition: all 0.2s ease-in-out; font-family: var(--thm-font); } .appointment-form .nice-select:after { position: absolute; content: "\e926"; font-family: "icomoon" !important; color: #aeaeae; font-size: 12px; top: 0px; right: 25px; bottom: 0; margin: 0px; font-weight: 400; border: none !important; transform: rotate(0deg) !important; } .appointment-form .nice-select .list { background-color: #ffffff; border-radius: 0px; box-shadow: 0 0 10px rgb(0 0 0 / 10%); padding: 0px 0 0px; margin-top: 10px; } .appointment-form .nice-select .option { padding-left: 20px; padding-right: 20px; font-size: 15px; line-height: 40px; min-height: 40px; } .appointment-form-button { position: relative; display: block; } /*------------------------------------------ Special Offers Style1 Css --------------------------------------------*/ .special-offers-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .special-offers-style1 .sec-title { padding-bottom: 53px; } .special-offers-style1 .sec-title p { margin: 20px 0 0; } .special-offers-style1__content { position: relative; display: block; max-width: 970px; width: 100%; } .single-offers-box { position: relative; display: block; overflow: hidden; border: 2px dashed #7d7d7d; padding: 35px 60px 36px; padding-right: 270px; } .single-offers-box .text-box { position: relative; display: block; } .single-offers-box .text-box h2 { color: var(--thm-base); font-size: 33px; line-height: 40px; font-weight: 900; margin: 0 0 7px; } .single-offers-box .text-box p { color: var(--thm-black); font-size: 18px; line-height: 28px; font-family: var(--thm-font); font-weight: 600; margin: 0 0 9px; } .single-offers-box .text-box span { color: #797979; font-size: 18px; font-family: var(--thm-font); } .single-offers-box .img-box { position: absolute; bottom: 0px; right: 30px; width: 220px; display: flex; align-items: center; justify-content: center; z-index: 2; } .single-offers-box .img-box:before { content: ""; position: absolute; top: 25px; left: 0px; bottom: 0; right: 0; width: 220px; height: 220px; background-color: #feb831; border-radius: 50%; z-index: -1; } /*------------------------------------------ Pricing plan Css --------------------------------------------*/ .pricing-plan { position: relative; display: block; background-color: #ffffff; padding-top: 120px; z-index: 10; } .pricing-plan__img { position: relative; display: block; min-height: 737px; } .pricing-plan__img .inner { position: absolute; left: -100px; bottom: 0; } .pricing-plan__content { position: relative; display: block; padding-bottom: 80px; } .single-price-box { position: relative; display: block; border-radius: 6px; background-color: #f0f1f9; padding: 0px 40px 30px; padding-right: 30px; margin-bottom: 40px; z-index: 1; } .single-price-box::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: var(--thm-base); border-radius: 6px; transform: perspective(400px) scaleX(0); transform-origin: center; transition: all 500ms ease; z-index: -1; } .single-price-box:hover:before { opacity: 1; transform: perspective(400px) scaleX(1); } .single-price-box .table-header { position: relative; display: block; } .single-price-box .table-header .price-box { position: relative; display: block; width: 225px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; background-color: var(--thm-base); padding: 10px 0px 12px; transition: all 200ms linear; transition-delay: 0.1s; } .single-price-box:hover .table-header .price-box { background-color: #ffffff; } .single-price-box .table-header .price-box h2 { color: #ffffff; font-size: 32px; line-height: 40px; font-family: var(--thm-font); transition: all 200ms linear; transition-delay: 0.1s; } .single-price-box:hover .table-header .price-box h2 { color: var(--thm-base); } .single-price-box .table-header .price-box h2 span { font-size: 20px; line-height: 30px; } .single-price-box .inner-title { position: relative; display: block; margin-top: 32px; } .single-price-box .inner-title h3 { font-size: 26px; line-height: 36px; transition: all 200ms linear; transition-delay: 0.1s; } .single-price-box:hover .inner-title h3 { color: #ffffff; } .single-price-box .price-list { position: relative; display: block; margin-top: 22px; } .single-price-box .price-list ul { position: relative; display: block; } .single-price-box .price-list ul li { position: relative; display: block; padding-left: 25px; color: var(--thm-black); font-size: 18px; line-height: 28px; font-family: var(--thm-font); font-weight: 500; margin-bottom: 14px; transition: all 200ms linear; transition-delay: 0.1s; } .single-price-box:hover .price-list ul li { color: #ffffff; } .single-price-box .price-list ul li:last-child { margin-bottom: 0; } .single-price-box .price-list ul li .icon { position: absolute; top: -1px; left: 0; } .single-price-box .price-list ul li .icon img { width: auto; transition: all 500ms ease; } .single-price-box:hover .price-list ul li .icon img { filter: invert(1); } .single-price-box .table-footer { position: relative; display: block; padding-top: 23px; } .single-price-box .table-footer a { position: relative; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0 auto; z-index: 1; } .single-price-box .table-footer a:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #6caaf7; border-radius: 50%; transition: all 500ms ease; z-index: -1; } .single-price-box:hover .table-footer a:before { background-color: #000000; } .single-price-box .table-footer a span { position: relative; display: inline-block; color: #000000; font-size: 40px; right: 13px; transition: all 500ms ease; } .single-price-box:hover .table-footer a span { color: #ffffff; } /*------------------------------------------ Finance Style1 Css --------------------------------------------*/ .finance-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0px 120px; z-index: 10; } .finance-style1__content-box { position: relative; display: block; } .finance-style1__content-box .sec-title { padding-bottom: 30px; } .finance-style1__content-box .taxt-box-top { position: relative; display: block; } .finance-style1__content-box .taxt-box-maddle { position: relative; display: block; padding: 24px 0 26px; } .finance-style1__content-box .taxt-box-bottom { position: relative; display: block; } .finance-style1__content-box .taxt-box-bottom p { color: #090d30; font-size: 20px; line-height: 28px; font-weight: 600; } .finance-style1__content-box .taxt-box-bottom p + p { margin-top: 27px; } .finance-style1__logo-box { position: relative; display: block; padding-top: 60px; } .finance-style1__logo-box ul { position: relative; display: flex; align-items: center; } .finance-style1__logo-box ul li { position: relative; display: block; float: left; } .finance-style1__logo-box ul li + li { margin-left: 30px; } /*** ============================================= Project details style1 Css ============================================= ***/ .project-details-style1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .project-details-style1__content { position: relative; display: block; } .project-details-style1__content .sec-title { padding-bottom: 30px; } .project-details-style1__content-text1 { position: relative; display: block; } .project-details-style1__content-text2 { position: relative; display: block; padding: 46px 0 51px; } .project-details-style1__content-text2 h3 { color: var(--thm-black); font-size: 32px; line-height: 40px; margin: 0 0 12px; } .project-details-style1__content-text2 p + p { margin-top: 14px; } .project-details-style1__content-text3 { position: relative; display: block; padding-left: 25px; margin: 0px 0 49px; } .project-details-style1__content-text3 .quote-icon { color: var(--thm-base); font-size: 40px; margin: 0 0 18px; } .project-details-style1__content-text3 h5 { font-size: 18px; line-height: 20px; font-weight: 500; margin: 21px 0 0; } .project-details-style1__content-text4 { position: relative; display: block; } .project-details-style1__content-text4 h3 { font-size: 32px; line-height: 40px; margin: 0 0 12px; } .project-details-style1__img-box { position: relative; display: block; } .single-project-details-style1 { position: relative; display: block; overflow: hidden; background-color: #000000; margin-bottom: 30px; } .single-project-details-style1 img { width: 100%; transition: all 200ms linear; transition-delay: 0.1s; } .single-project-details-style1:hover img { transform: scale(1.02); transition: all 0.5s cubic-bezier(0.62, 0.21, 0.45, 1.52); } /*** ============================================= Offers Coupons Area Css ============================================= ***/ .offers-coupons-area { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .offers-coupons__content { position: relative; display: block; } .offers-coupons__content .sec-title { padding-bottom: 30px; } .offers-coupons__content-inner { position: relative; display: block; } .offers-coupons__content-inner ul { position: relative; display: block; overflow: hidden; padding-top: 15px; } .offers-coupons__content-inner ul li { position: relative; display: block; padding-left: 30px; color: #04225d; font-size: 20px; font-weight: 500; } .offers-coupons__content-inner ul li + li { margin-top: 11px; } .offers-coupons__content-inner ul li .icon { position: absolute; top: 2px; left: 0; color: var(--thm-base); font-size: 18px; } .free-estimates-content-box { position: relative; display: block; max-width: 970px; width: 100%; padding-top: 70px; } .free-estimates-content-box .inner-title { position: relative; display: block; padding-bottom: 39px; } .free-estimates-content-box .inner-title h2 { font-size: 30px; line-height: 32px; font-weight: 700; margin: 0 0 12px; } .free-estimates-content-box .inner-title p { color: #444444; font-size: 20px; line-height: 38px; font-weight: 600; } .free-estimates-content-box ul { position: relative; display: block; overflow: hidden; } .free-estimates-content-box ul li { position: relative; display: block; margin-bottom: 50px; } .free-estimates-content-box ul li:last-child { margin-bottom: 0; } .single-offers-box--style2 { padding-right: 40px; padding-left: 280px; background-color: #f7fbfe; } .single-offers-box--style2 .img-box { bottom: 0px; left: 30px; right: auto; } /*** ============================================= Tips Tricks Area Css ============================================= ***/ .tips-tricks-area { position: relative; display: block; background-color: #ffffff; padding: 120px 0 88px; z-index: 10; } .tips-tricks__content { position: relative; display: block; } .tips-tricks__content .inner-title { position: relative; display: block; padding-bottom: 49px; margin-top: -10px; } .tips-tricks__content .inner-title h2 { font-size: 45px; line-height: 56px; font-weight: 900; margin: 0 0 9px; } .tips-tricks__content-inner { position: relative; display: block; } .tips-tricks__content-inner .single-box { position: relative; display: block; padding-bottom: 49px; } .tips-tricks__content-inner .single-box h2 { font-size: 30px; line-height: 34px; font-weight: 900; margin: 0 0 15px; } .tips-tricks__content-inner .single-box ul { position: relative; display: block; overflow: hidden; } .tips-tricks__content-inner .single-box ul li { position: relative; display: block; padding-left: 20px; color: #444444; font-size: 20px; line-height: 30px; font-weight: 600; } .tips-tricks__content-inner .single-box ul li + li { margin-top: 10px; } .tips-tricks__content-inner .single-box ul li .dashed { position: absolute; top: 16px; left: 0; width: 8px; height: 2px; background-color: #444444; } .tips-tricks__content .bottom-text { position: relative; display: block; padding-top: 24px; padding-right: 50px; } .tips-tricks__content .bottom-text h2 { color: #090d30; font-size: 32px; line-height: 46px; font-weight: 600; } /*** ============================================= Project Page One Css ============================================= ***/ .project-page-one { position: relative; display: block; background-color: #ffffff; padding: 120px 0 90px; z-index: 10; } .project-menu-box { position: relative; display: block; overflow: hidden; padding-bottom: 51px; } .project-filter { position: relative; display: block; overflow: hidden; z-index: 1; } .project-filter li { position: relative; display: inline-block; float: none; margin: 0 18px 10px; } .project-filter li .filter-text { position: relative; display: block; color: #242424; font-size: 18px; font-weight: 600; line-height: 20px; text-transform: capitalize; cursor: pointer; transition: all 0.4s ease; z-index: 1; font-family: var(--thm-font); } .project-filter li .filter-text:before { position: absolute; left: -1px; bottom: -1px; right: -1px; height: 1px; content: ""; background: var(--thm-base); transform: scaleX(0); transform-origin: center; transform-style: preserve-3d; transition: all 0.4s cubic-bezier(0.62, 0.21, 0.45, 1.52); z-index: -1; } .project-filter li:hover .filter-text:before, .project-filter li.active .filter-text:before { transform: scaleX(1); } .project-filter li:hover .filter-text, .project-filter li.active .filter-text { color: var(--thm-base); } .project-filter li .count { display: none; } .project-page-one .sec-title { padding-bottom: 54px; } .project-page-one .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .project-page-one .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .project-page-one .sec-title p { color: #444444; font-size: 18px; line-height: 26px; font-weight: 400; margin-top: 11px; } .single-project-item--style2 { position: relative; margin-bottom: 30px; } .single-project-item--style2.marginbtm { margin-bottom: 47px; } .single-project-item--style2 .img-holder-img-bg { background-color: #0296e9; opacity: 0; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); -webkit-transform-origin: top; -ms-transform-origin: top; transform-origin: top; border-radius: 6px; z-index: 1; } .single-project-item--style2:hover .img-holder-img-bg { opacity: 0.9; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); } .single-project-item--style2 .img-holder .overlay-button a { width: 55px; height: 55px; border-radius: 50%; color: var(--thm-base); font-size: 25px; line-height: 56px; } .single-project-item--style2 .img-holder .overlay-button a::before { border-radius: 50%; } .single-project-item--style2 .img-holder .overlay-title { padding: 0 30px 28px; padding-right: 20px; } .single-project-item--style2 .img-holder .overlay-title h4 { font-size: 20px; line-height: 30px; font-weight: 600; font-family: var(--thm-font); margin: 0 0 0px; } .single-project-item--style2 .img-holder .overlay-title p { color: #ffffff; font-size: 20px; line-height: 20px; font-weight: 400; } .single-project-item--style2 .title-holder { position: relative; display: block; padding-top: 25px; } .single-project-item--style2 .title-holder h4 { font-size: 20px; line-height: 24px; font-weight: 600; font-family: var(--thm-font); margin: 0 0 1px; } .single-project-item--style2 .title-holder h4 a { color: #242424; } .single-project-item--style2 .title-holder p { color: #242424; line-height: 20px; } /*** ============================================= Project Page Two Css ============================================= ***/ .project-page-two { position: relative; display: block; background-color: #ffffff; padding: 120px 0 70px; z-index: 10; } .project-page-two .sec-title { padding-bottom: 54px; } .project-page-two .sec-title .sub-title { align-items: center; justify-content: center; margin-bottom: 13px; } .project-page-two .sec-title .sub-title h5 { margin-left: 10px; margin-right: 10px; } .project-page-two .sec-title p { color: #444444; font-size: 18px; line-height: 26px; font-weight: 400; margin-top: 11px; } /*** ============================================= Service Page Css ============================================= ***/ .service-page { position: relative; display: block; background-color: #ecf0f7; padding: 120px 0 113px; z-index: 10; } .service-page .sec-title { padding-bottom: 53px; } .service-page .sec-title p { margin: 20px 0 0; } .service-page .single-service-style1 { margin-bottom: 30px; } .service-page__bottom { position: relative; display: block; margin-top: 80px; } .service-page__bottom h2 { font-size: 45px; line-height: 56px; font-weight: 900; margin-bottom: 31px; } .service-page__bottom .text-top { margin: 0; } .service-page__bottom .text-top p { color: #242424; font-size: 20px; } .service-page__bottom .bottom-text { position: relative; display: block; padding-top: 37px; } .service-page__bottom .bottom-text p { color: #242424; font-size: 24px; line-height: 32px; font-weight: 500; } /*** ============================================= Service Details Page1 Css ============================================= ***/ .service-details-page1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .service-details-page1__content { position: relative; display: block; padding-right: 30px; } .service-details-page1__content .img-box { position: relative; display: block; overflow: hidden; } .service-details-page1__content .img-box img { width: 100%; } .service-details-page1__content .text-box { position: relative; display: block; padding-top: 45px; } .service-details-page1__content .text-box h2 { font-size: 34px; line-height: 40px; font-weight: 900; margin: 0 0 12px; } .service-details-page1__content .text-box p + p { margin-top: 24px; } .service-details-page1__text2 { position: relative; display: block; padding: 53px 0 60px; } .service-details-page1__text2 .image { position: relative; display: block; margin-right: -2.5px; } .service-details-page1__text2 .image img { width: 100%; } .service-details-page1__text2 .text { position: relative; display: block; padding-left: 12.5px; } .service-details-page1__text2 .text h3 { font-size: 30px; line-height: 36px; font-weight: 900; margin: 0 0 13px; } .service-details-page1__text2 .text p { margin: 0 0 18px; } .service-details-page1__text2 .text ul { position: relative; display: block; overflow: hidden; } .service-details-page1__text2 .text ul li { position: relative; display: block; padding-left: 20px; color: #051d3e; font-size: 18px; line-height: 30px; font-weight: 600; } .service-details-page1__text2 .text ul li + li { margin-top: 7px; } .service-details-page1__text2 .text ul li .dashed { position: absolute; top: 16px; left: 0; width: 8px; height: 2px; background-color: #051d3e; } .service-details-page1__text3 { position: relative; display: block; } .service-details-page1__text3 .row { --bs-gutter-x: 0px; } .service-details-page1__text3 .row li { position: relative; display: block; overflow: hidden; border: 1px solid #e9e9e9; padding: 24px 25px 27px; z-index: 1; } .service-details-page1__text3 .row li:before { content: ""; position: absolute; top: 0; left: 0; bottom: 0px; right: 0; border-radius: 0px; background-color: #fafafa; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; transform-origin: top center; -webkit-transform: scale(1, 0); transform: scale(1, 0); z-index: -1; } .service-details-page1__text3 .row li:hover::before { -webkit-transform: scale(1, 1); transform: scale(1, 1); transform-origin: bottom center; } .service-details-page1__text3 .row li:last-child { border-left: none; } .service-details-page1__text3 .single-box { position: relative; display: block; padding-left: 80px; } .service-details-page1__text3 .single-box .icon { position: absolute; top: 6px; left: 0; line-height: 0; } .service-details-page1__text3 .single-box .icon span { position: relative; display: inline-block; color: var(--thm-primary); font-size: 60px; line-height: 60px; transition: all 200ms linear; transition-delay: 0.1s; } .service-details-page1__text3 .single-box:hover .icon span { transform: scale(0.9); } .service-details-page1__text3 .single-box .text { position: relative; display: block; } .service-details-page1__text3 .single-box .text h3 { color: #000000; font-size: 20px; line-height: 28px; margin-bottom: 4px; } .service-details-choose-box { position: relative; display: block; padding-top: 53px; } .service-details-choose-box .inner-title { position: relative; display: block; padding-bottom: 31px; } .service-details-choose-box .inner-title h2 { font-size: 32px; line-height: 40px; font-weight: 900; } .service-details-choose-box .accordion-box { position: relative; display: block; } .service-details-sidebar-box { position: relative; display: block; } .service-details-page-links { position: relative; display: block; margin-bottom: 50px; } .service-details-page-links ul { position: relative; display: block; } .service-details-page-links ul li { position: relative; display: block; } .service-details-page-links ul li a { position: relative; display: block; background-color: #f1f1f1; border-bottom: 3px solid #ffffff; padding: 12px 30px 12px; color: var(--thm-black); font-size: 18px; line-height: 28px; font-weight: 700; font-family: var(--thm-font-2); transition: all 200ms linear; transition-delay: 0.1s; z-index: 1; } .service-details-page-links ul li:last-child a { border-bottom: none; } .service-details-page-links ul li.current a, .service-details-page-links ul li:hover a { color: #ffffff; padding-left: 55px; } .service-details-page-links ul li a:before { content: ""; position: absolute; top: 25px; left: 30px; width: 0px; height: 1px; background-color: #ffffff; transition: all 200ms linear; transition-delay: 0.1s; } .service-details-page-links ul li.current a:before, .service-details-page-links ul li:hover a:before { width: 15px; } .service-details-page-links ul li a::after { content: ""; position: absolute; top: 0; left: 0; bottom: 0px; right: 0; background-color: #005cb4; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; transform-origin: left right; -webkit-transform: scale(1, 0); transform: scale(0, 1); z-index: -1; } .service-details-page-links ul li.current a::after, .service-details-page-links ul li:hover a::after { -webkit-transform: scale(1, 1); transform: scale(1, 1); transform-origin: right center; } .sidebar-download-box { position: relative; display: block; margin-top: -4px; padding-top: 50px; } .sidebar-download-box .inner-title { position: relative; display: block; padding-bottom: 25px; } .sidebar-download-box .inner-title h2 { color: #242424; font-size: 28px; line-height: 30px; font-weight: 900; } .sidebar-download-box .dwn-btn { position: relative; display: block; } .sidebar-download-box .dwn-btn a { color: #ffffff; font-size: 20px; font-weight: 600; text-transform: none; letter-spacing: normal; font-family: var(--thm-font); line-height: 60px; width: 100%; display: flex; align-items: center; justify-content: center; padding-left: 0px; padding-right: 0px; } .sidebar-download-box .dwn-btn a i { top: 2px; padding-left: 5px; font-size: 25px; } .sidebar-download-box .dwn-btn a:after { background-image: none; background-color: #051d3e; } .service-details-contact-info-box { position: relative; display: block; } .service-details-contact-info-box .img-box { position: relative; display: block; overflow: hidden; z-index: 1; } .service-details-contact-info-box .img-box img { width: 100%; transform: scale(1); } .service-details-contact-info-box:hover .img-box img { transform: scale(1.03) rotate(0deg); } .service-details-contact-info-box .img-box::before { position: absolute; content: ""; left: 0; right: 0; bottom: 0; height: 85px; background-color: var(--thm-base); clip-path: polygon(100% 0%, 0% 100%, 100% 100%); z-index: 2; } .service-details-contact-info-box .img-box::after { position: absolute; content: ""; left: 0; right: 0; bottom: -1px; height: 65px; background-color: #001b3b; clip-path: polygon(100% 0%, 0% 100%, 100% 100%); z-index: 2; } .service-details-contact-info-box .title-box { position: relative; display: block; background-color: #001b3b; padding: 17px 30px 40px; } .service-details-contact-info-box .title-box h3 { color: #ffffff; font-size: 30px; line-height: 30px; margin-bottom: 6px; } .service-details-contact-info-box .title-box h3 span { font-size: 24px; line-height: 30px; font-family: var(--thm-font); font-weight: 500; } .service-details-contact-info-box .title-box h2 { color: #ffffff; font-size: 32px; line-height: 40px; margin-bottom: 21px; } .service-details-contact-info-box .title-box .btn-box { position: relative; display: block; } .service-details-contact-info-box .title-box .btn-box a { line-height: 50px; padding-left: 30px; padding-right: 30px; } /*--------------------------------------- Service Details Page2 Sec1 Css -----------------------------------------*/ .service-details-page2-sec1 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .service-details-page2-sec1__image { position: relative; display: block; padding-right: 20px; } .service-details-page2-sec1__image .inner { position: relative; display: block; overflow: hidden; } .service-details-page2-sec1__image .inner::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; z-index: 1; transition: all 500ms ease; /* background-image: linear-gradient(0deg, var(--thm-black) 0%, rgba(255, 255, 255, 0) 60%); */ } .service-details-page2-sec1__image:hover .inner::before { opacity: 0; } .service-details-page2-sec1__image .inner img { width: 100%; transform: scale(1.01); -webkit-transition-delay: 0.1s; transition-delay: 0.1s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; -webkit-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-property: all; transition-property: all; } .service-details-page2-sec1__image .inner:hover img { transform: scale(1.1) rotate(0.5deg); } .service-details-page2-sec1__content { position: relative; display: block; padding-left: 50px; } .service-details-page2-sec1__content .sec-title { padding-bottom: 30px; } .service-details-page2-sec1__content .text { position: relative; display: block; } .service-details-page2-sec1__content ul { position: relative; display: block; padding-top: 28px; margin-bottom: 34px; } .service-details-page2-sec1__content ul li { position: relative; display: block; padding-left: 35px; color: #242424; font-size: 18px; line-height: 28px; font-weight: 500; font-family: var(--thm-font); margin-bottom: 4px; } .service-details-page2-sec1__content ul li:last-child { margin-bottom: 0; } .service-details-page2-sec1__content ul li .icon { position: absolute; top: 2px; left: 0px; } .service-details-page2-sec1__content ul li .icon span { color: var(--thm-base); font-size: 20px; line-height: 20px; } .service-details-page2-sec1__content .bottom-text { position: relative; display: block; } /*--------------------------------------- Service Details Page2 Sec2 Css -----------------------------------------*/ .service-details-page2-sec2 { position: relative; display: block; background-color: #08335e; padding: 0px 0 0px; z-index: 10; } .service-details-page2-sec2__image { position: relative; display: block; padding-top: 120px; padding-right: 50px; z-index: 1; } .service-details-page2-sec2__image-bg { position: absolute; top: 0; left: -10000px; bottom: 0; right: 220px; background: #04407d; z-index: -1; } .service-details-page2-sec2__image .inner { position: relative; display: block; overflow: hidden; } .service-details-page2-sec2__image .inner img { width: 100%; transition: all 1500ms ease; } .service-details-page2-sec2__image:hover .inner img { transform: scale(1.1) rotate(0.5deg); } .service-details-page2-sec2__image .inner::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; z-index: 1; transition: all 500ms ease; background-image: linear-gradient( 0deg, var(--thm-black) 0%, rgba(255, 255, 255, 0.1) 10% ); } .service-details-page2-sec2__image:hover .inner::before { opacity: 0; } .service-details-page2-sec2__content { position: relative; display: block; padding-top: 120px; padding-left: 20px; } .service-details-page2-sec2__content .sec-title { padding-bottom: 35px; } .service-details-page2-sec2__content .sec-title h2 { color: #ffffff; } .service-details-page2-sec2__content .sec-title p { color: #ffffff; font-size: 20px; line-height: 28px; margin: 21px 0 0; } .service-details-page2-sec2__content .text { position: relative; display: block; } .service-details-page2-sec2__content .text p { color: #ffffff; } .service-details-page2-sec2__content ul { position: relative; display: block; padding-top: 38px; } .service-details-page2-sec2__content ul li { position: relative; display: block; padding-left: 35px; color: #ffffff; font-size: 20px; line-height: 28px; font-weight: 500; font-family: var(--thm-font); margin-bottom: 10px; } .service-details-page2-sec2__content ul li:last-child { margin-bottom: 0; } .service-details-page2-sec2__content ul li .icon { position: absolute; top: 2px; left: 0px; } .service-details-page2-sec2__content ul li .icon span { color: var(--thm-base); font-size: 20px; line-height: 20px; } /*** ============================================= Service Details Style3 Css ============================================= ***/ .service-details-style3 { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .service-details-style3__content { position: relative; display: block; padding-right: 30px; } .service-details-style3__content .inner-title { position: relative; display: block; margin-top: -10px; padding-bottom: 43px; } .service-details-style3__content .inner-title h2 { font-size: 45px; line-height: 55px; font-weight: 900; margin-bottom: 19px; } .service-details-style3-img-box { position: relative; display: block; } .service-details-style3-img-box .single-img-box { position: relative; display: block; overflow: hidden; } .service-details-style3-img-box .single-img-box::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; z-index: 1; transition: all 500ms ease; /* background-image: linear-gradient(0deg, var(--thm-black) 0%, rgba(255, 255, 255, 0) 50%); */ } .service-details-style3-img-box .single-img-box:hover::before { opacity: 0; } .service-details-style3-img-box .single-img-box img { width: 100%; transform: scale(1); } .service-details-style3-img-box .single-img-box:hover img { transform: scale(1.05) rotate(1deg); } .service-details-style3-img-box .single-img-box .video-gallery-style2 { position: absolute; bottom: 30px; right: 30px; width: auto; height: auto; overflow: initial; } .service-details-style3-img-box .single-img-box .video-gallery-style2 .video-gallery-style2-bg { display: none; } .service-details-style3-bottom-text { position: relative; display: block; margin-top: 70px; } .service-details-style3-bottom-text h2 { font-size: 45px; line-height: 55px; font-weight: 900; margin-bottom: 21px; } .service-details-style3-bottom-text .list-items { position: relative; display: block; margin-top: 36px; } .service-details-style3-bottom-text .list-items ul { position: relative; display: block; } .service-details-style3-bottom-text .list-items ul li { position: relative; display: block; padding-left: 30px; color: #242424; font-size: 18px; line-height: 30px; font-weight: 700; font-family: var(--thm-font-2); margin-bottom: 7px; } .service-details-style3-bottom-text .list-items ul li:last-child { margin-bottom: 0; } .service-details-style3-bottom-text .list-items ul li .icon { position: absolute; top: 1px; left: 0; } .service-details-style3-bottom-text .list-items ul li .icon span { color: var(--thm-primary); font-size: 15px; line-height: 15px; font-weight: 700; } .service-details-sidebar-box-style2 { position: relative; display: block; } .service-details-sidebar-box-style2 .sidebar-download-box { padding-top: 55px; } /*--------------------------------------- Faq Page One Css -----------------------------------------*/ .faq-page-one { position: relative; display: block; background-color: #ffffff; padding: 120px 0 120px; z-index: 10; } .faq-page-one .sec-title { padding-bottom: 43px; } .faq-page-one .sec-title .text { position: relative; display: block; padding-top: 10px; } .faq-page-one .sec-title .text p { color: #444444; } .faq-search-box { position: relative; display: block; max-width: 100%; width: 100%; margin-bottom: 60px; } .faq-search-box__inner { position: relative; display: block; } .faq-search-box form.search-form { position: relative; display: block; width: 100%; } .faq-search-box .search-form input[type="text"] { position: relative; display: block; width: 100%; height: 60px; background-color: #ffffff; border: 1px solid #e0e0e0; color: #444444; font-size: 18px; font-weight: 400; padding-left: 30px; padding-right: 60px; border-radius: 7px; font-family: var(--thm-font); transition: all 500ms ease 0s; } .faq-search-box .search-form button { position: absolute; top: 0px; right: 0px; bottom: 0px; width: 50px; height: 60px; font-size: 16px; line-height: 60px; display: block; text-align: center; border-radius: 0%; border: 0px solid #e7e7e8; transition: all 500ms ease 0s; } .faq-search-box .search-form button i { position: relative; top: 4px; color: var(--thm-black); font-size: 25px; } .faq-search-box .search-form input[type="text"]:focus { color: #000; } .faq-content-box { position: relative; display: block; } /*** ============================================= Faq Form Area Style ============================================= ***/ .faq-form-area { position: relative; display: block; background-color: #edf1f4; padding: 120px 0 120px; overflow: hidden; z-index: 10; } .faq-form-area-bg { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: top right; z-index: -1; } .faq-form-box { position: relative; display: block; } .faq-form-box .top-title { position: relative; display: block; margin-top: -9px; padding-bottom: 24px; } .faq-form-box .top-title h2 { font-size: 45px; line-height: 55px; font-weight: 900; } .faq-form-box form { position: relative; display: block; max-width: 950px; } .faq-form-box form .input-box { position: relative; display: block; margin-bottom: 25px; } .faq-form-box form input[type="text"], .faq-form-box form input[type="email"], .faq-form-box form textarea { position: relative; display: block; background: transparent; width: 100%; height: 60px; border: 0px solid #e3e3e3; border-bottom: 2px solid #e3e3e3; color: #444444; font-size: 18px; font-weight: 400; font-style: normal; padding-left: 0px; padding-right: 0px; border-radius: 0px; transition: all 500ms ease; font-family: var(--thm-font); } .faq-form-box form textarea { height: 170px; } .faq-form-box form input[type="text"]:focus { color: #000000; border-color: var(--thm-base); } .faq-form-box form input[type="email"]:focus { color: #000000; border-color: var(--thm-base); } .faq-form-box form textarea:focus { color: #000000; border-color: var(--thm-base); } .faq-form-box form input[type="text"]::-webkit-input-placeholder { color: #444444; } .faq-form-box form input[type="text"]:-moz-placeholder { color: #444444; } .faq-form-box form input[type="text"]::-moz-placeholder { color: #444444; } .faq-form-box form input[type="text"]:-ms-input-placeholder { color: #444444; } .faq-form-box form input[type="email"]::-webkit-input-placeholder { color: #444444; } .faq-form-box form input[type="email"]:-moz-placeholder { color: #444444; } .faq-form-box form input[type="email"]::-moz-placeholder { color: #444444; } .faq-form-box form input[type="email"]:-ms-input-placeholder { color: #444444; } .faq-form-box form textarea::-webkit-input-placeholder { color: #444444; } .faq-form-box form textarea:-moz-placeholder { color: #444444; } .faq-form-box form textarea::-moz-placeholder { color: #444444; } .faq-form-box form textarea:-ms-input-placeholder { color: #444444; } .faq-form-box form .button-box { position: relative; display: block; padding-top: 5px; } .faq-form-box form .button-box button { } /*** ============================================= Error Page Area Style ============================================= ***/ .error-page-area { position: relative; display: block; padding: 112px 0 120px; background: #ffffff; z-index: 10; } .error-content { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; } .error-content .big-title { position: relative; display: block; z-index: 1; } .error-content .big-title h2 { color: var(--thm-base); font-size: 72px; line-height: 70px; font-weight: 800; text-transform: uppercase; } .error-content .title { position: relative; display: block; padding-top: 23px; padding-bottom: 28px; } .error-content .title h2 { font-size: 48px; line-height: 60px; font-weight: 700; } .error-content .text { position: relative; display: block; padding-bottom: 29px; } .error-content .text p { margin: 0; } .error-page-search-box { position: relative; display: block; max-width: 570px; width: 100%; margin: 0 auto; } .error-page-search-box form.search-form { position: relative; display: block; width: 100%; } .error-page-search-box .search-form input[type="text"] { position: relative; display: block; width: 100%; height: 60px; border-radius: 0px; background: #ffffff; border: 1px solid #f7f1eb; color: var(--thm-gray); font-size: 16px; font-weight: 400; letter-spacing: 0.1em; padding-left: 30px; padding-right: 60px; transition: all 500ms ease 0s; font-family: var(--thm-font); } .error-page-search-box .search-form button { position: absolute; top: 10px; right: 10px; bottom: 10px; width: 40px; height: 40px; background: var(--thm-base); color: #ffffff; font-size: 16px; line-height: 10px; display: block; text-align: center; border: 0px solid #e1e1e1; transition: all 500ms ease 0s; } .error-page-search-box .search-form button i { font-size: 16px; } .error-page-search-box .search-form input[type="text"]:focus { color: var(--thm-primary); border-color: var(--thm-base); } .error-page-search-box .search-form input[type="text"]:focus + button, .error-page-search-box .search-form button:hover { color: #fff; } .error-page-search-box .search-form input::-webkit-input-placeholder { color: #757575; } .error-page-search-box .search-form input:-moz-placeholder { color: #757575; } .error-page-search-box .search-form input::-moz-placeholder { color: #757575; } .error-page-search-box .search-form input:-ms-input-placeholder { color: #757575; } .error-content .btns-box { line-height: 0; padding-top: 20px; } .error-content .btns-box a { padding-left: 40px; padding-right: 40px; } .error-content .btns-box a:after { } .elements-sec1 { margin-top: 0px; } /* Hidden Bar */ .hidden-sidebar { position: fixed; top: 0; left: -100%; width: 100%; max-width: 400px; height: 100%; overflow: auto; display: -webkit-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; direction: rtl; z-index: 99999; } .hidden-sidebar .wrapper-box { height: 100%; } .hidden-sidebar .content-wrapper { position: relative; display: block; direction: ltr; padding: 80px 40px; background-color: #0a1222; } .hidden-sidebar-close { position: absolute; top: 0; right: 0; background-color: rgba(255, 255, 255, 0.1); width: 70px; height: 70px; color: #fff; font-size: 30px; line-height: 70px; text-align: center; cursor: pointer; transition: all 200ms linear; transition-delay: 0.1s; } .hidden-sidebar-close:hover { color: var(--thm-base); background-color: #ffffff; } .hidden-sidebar .logo { margin-bottom: 35px; } .hidden-sidebar .logo a { position: relative; display: inline-block; } .hidden-sidebar .text-widget .text { color: #909398; font-size: 18px; margin-bottom: 0; } .hidden-sidebar .sidebar-widget { margin-bottom: 40px; } .pdf-widget { position: relative; } .pdf-widget .row { margin: 0 -7.5px; } .pdf-widget .column { padding: 0 7.5px; } .pdf-widget .content { position: relative; display: block; background-color: #fff; text-align: center; padding: 30px 10px; margin-bottom: 20px; } .pdf-widget .content .icon { position: relative; display: block; margin-bottom: 15px; } .pdf-widget .content .icon i { color: var(--thm-base); font-size: 40px; line-height: 40px; } .pdf-widget .content h4 { font-size: 16px; font-weight: 700; text-transform: uppercase; } .contact-widget { position: relative; } .contact-widget .icon-box { position: relative; display: flex; flex-wrap: wrap; margin-bottom: 20px; } .contact-widget .icon { position: relative; display: block; width: 40px; color: var(--thm-base); font-size: 20px; margin-top: 5px; } .contact-widget .icon.margintop { margin-top: 9px; } .contact-widget .text { color: #909398; line-height: 28px; } .contact-widget .text a { color: #909398; transition: all 200ms linear; transition-delay: 0.1s; } .contact-widget .text a:hover { color: #ffffff; } .contact-widget .text strong { position: relative; display: block; color: #fff; font-weight: 700; font-family: var(--thm-font-2); } .hidden-sidebar .link-btn { position: relative; display: block; line-height: 0; margin-top: 30px; } /* Cursor Style */ .nav-overlay { position: fixed; top: 0; left: 0; bottom: 0; width: 100%; display: none; background-color: rgba(var(--thm-base-rgb), 0.8); overflow: hidden; cursor: none; z-index: 999; } .cursor { position: absolute; background-color: #fff; width: 6px; height: 6px; border-radius: 100%; z-index: 1; -webkit-transition: 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; transition: 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; -o-transition: 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity; transition: 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity; transition: 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.3s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; z-index: 10000; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); visibility: hidden; } .cursor { visibility: visible; } .cursor.active { opacity: 0.7; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .cursor.hovered { opacity: 0.08; } .cursor-follower { position: absolute; background-color: rgba(0, 0, 0, 0.9); width: 50px; height: 50px; border-radius: 100%; z-index: 1; -webkit-transition: 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; transition: 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; -o-transition: 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity; transition: 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity; transition: 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform, 0.2s cubic-bezier(0.75, -0.27, 0.3, 1.33) opacity, 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) -webkit-transform; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; z-index: 10000; visibility: hidden; } .cursor-follower { visibility: visible; } .cursor-follower.active { opacity: 0.7; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .cursor-follower.hovered { opacity: 0.08; } .cursor-follower.close-cursor:before { position: absolute; content: ""; height: 25px; width: 2px; background: #fff; left: 48%; top: 12px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); display: inline-block; } .cursor-follower.close-cursor:after { position: absolute; content: ""; height: 25px; width: 2px; background: #fff; right: 48%; top: 12px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } #ui-datepicker-div.ui-widget-content { border: 1px solid #c5c5c5; background: #fff none repeat scroll 0 0; border: 1px solid #777; color: #252525; font-family: "Poppins", sans-serif; font-size: 14px; border-radius: 0px; width: 270px; padding: 5px; z-index: 999 !important; } #ui-datepicker-div.ui-datepicker .ui-datepicker-header { background: #151515 none repeat scroll 0 0; border: 2px solid #252525; border-radius: 0; color: #fff; font-weight: 700; padding: 5px 0; position: relative; } .ui-datepicker td a { color: #000000 !important; text-align: center; background-image: none !important; background: #f5f5f5 !important; border: 1px solid #f9f9f9 !important; } .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #333333 !important; background: #333333 !important; color: #ffffff !important; } .ui-datepicker .ui-datepicker-prev { left: 5px; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { border-radius: 30%; height: 20px; position: absolute; top: 7px; width: 20px; transition: all 500ms ease; cursor: pointer; } .ui-datepicker .ui-datepicker-next { right: 5px; } .ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover { top: 7px; background: #fff; border: none; } .ui-datepicker table { border-collapse: collapse; font-size: 13px; margin: 0 0 0.4em; width: 100%; } .ui-datepicker th { border: medium none; font-weight: 600; padding: 2px 3px; text-align: center; } .ui-datepicker-calendar .ui-state-default:hover, .ui-datepicker-calendar .ui-state-default:active { background: #43c3ea; color: #fff; border-color: #43c3ea; } .text-blue { color: #0b67b4 !important; } .service-list-body { display: flex !important; flex-wrap: wrap; list-style: none; padding: 0; } .service-item { width: 33.33%; box-sizing: border-box; padding: 10px; display: flex; align-items: center; } .service-item .icon { margin-right: 10px; } .service-item b { font-weight: bold; font-size: 14px; } @media screen and (max-width: 768px) { .service-item { width: 50%; /* 2 items per row for medium-sized screens */ } } @media screen and (max-width: 480px) { .service-item { width: 100%; /* 1 item per row for mobile screens */ } } .membership-benefits { margin-top: 30px; } .membership-benefits h3 { font-size: 18px; font-weight: bold; margin-bottom: 15px; } .benefit-list { list-style: none; padding: 0; border-top: 2px solid #e0e0e0; } .benefit-item { display: flex; align-items: center; margin-bottom: 10px; } .benefit-item .icon { margin-right: 10px; } .benefit-item b { font-weight: bold; font-size: 14px; } .benefit-item .value { color: #2b6d98; } .benefit-item .members-only { font-style: italic; color: #2b6d98; } @media screen and (max-width: 768px) { .membership-benefits { margin-top: 20px; } } @media screen and (max-width: 480px) { .membership-benefits h3 { font-size: 16px; } } .quote-button { display: inline-block; padding: 12px 30px; background-color: #e74c3c; color: white; text-transform: uppercase; font-weight: bold; text-decoration: none; border-radius: 5px; margin-top: 20px; font-size: 16px; transition: background-color 0.3s ease; } .quote-button:hover { background-color: #c0392b; } .service-item-water { width: 100%; box-sizing: border-box; padding: 10px; display: flex; align-items: center; } .comparison-table { width: 100%; border-collapse: collapse; margin-bottom: 30px; } .comparison-table th, .comparison-table td { padding: 12px 15px; text-align: left; border: 1px solid #ddd; } .comparison-table th { background-color: #005b7f; color: white; font-weight: bold; } .comparison-table td { background-color: #fafafa; } /* Text Styling for Custom Classes */ .custom-text { font-size: 16px; line-height: 1.6; color: #555; margin-top: 20px; } /* Responsive Design */ @media screen and (max-width: 768px) { .custom-service-details { padding: 20px; } } /*-------------------------------------------------------------- # End Css --------------------------------------------------------------*/ .video-background::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.3); pointer-events: none; z-index: 1; }