/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global Settings
4. Main Header / TWO / Three / Four / Five
5. Sticky Header
6. Mobile Menu
7. Section Title
8. Page Title
9. Main Slider
10. Banner Section / Two / Three / Four
11. Features Section / Two / Three / Four / Five / Six
12. About Section / Two / Three / Four / Five / Six
13. Services Section / Two / Three / Four / Five
14. Map Section
15. Call To Action / Two / Three / Four / Five
16. Locations Section / Two
17. Offer Section / Two / Three / Four
18. FAQ's Sectiom / Two
19. Work Section
20. Fun Fact Section / Two
21. Project Section / Two / Three
22. Testimonial Section / Two / Three / Four
23. Why Choose Us / Two / Three
24. Industries Section
25. Pricing Section
26. team Section / Two
27. Contact Sectiom / Two / Three / Four
28. News Section / Two
29. Clients Section
30. Main Footer
**********************************************/
@import url("animate.css");
@import url("swiper.min.css");
@import url("fontawesome.css");
:root {
--theme-color-white: #ffffff;
--theme-color-white-rgb: 255, 255, 255;
--theme-color-light: #f8f5f0;
--theme-color-gray: #f6f6f6;
--theme-color-gray2: #797979;
--theme-color-black: #000000;
--theme-color-black-rgb: 0, 0, 0;
--theme-color1: #f58a20;
--theme-color1-rgb: 34, 36, 41;
--theme-color2: #144443;
--theme-color2-rgb: 20, 68, 67;
--theme-color3: #f4f5f8;
--theme-color4: #0f0f0f;
--theme-color5: #13132E;
--theme-color6: #DADADA;
--theme-color7: #f06723;
--theme-color8: #163838;
--theme-color-silver: #C4C4C4;
--bg-theme-color1: var(--theme-color1);
--bg-theme-color2: var(--theme-color2);
--bg-theme-color3: var(--theme-color3);
--border-theme-color1: var(--theme-color1);
--border-theme-color2: var(--theme-color2);
--border-theme-color3: var(--theme-color3);
--theme-color1-text-color: #fff;
--theme-color2-text-color: #0f0f0f;
--theme-color3-text-color: #fff;
--gradient-1: linear-gradient(99deg, #f58a20 0%, #f06723 93.92%);
--gradient-2: linear-gradient(to left, rgba(var(--theme-color2-rgb), 1) 0%, rgba(var(--theme-color2-rgb), 0.7) 100%);
--gradient-3: linear-gradient(-135deg, rgba(23, 23, 23, 0) 50%, var(--theme-color2) 100%);
--body-color: #fff;
--text-color: #646464;
--headings-color: #0B3130;
--link-color: #0B3130;
--link-hover-color: #C8F169;
--body-font-family: "Poppins", sans-serif;
--heading-font-family: "DM Sans", sans-serif;
--style-font: "Manrope", sans-serif;
--body-font-size: 16px;
--body-line-height: 1.9;
--body-font-weight: 400;
--line-height-heading-h1: 1em;
--line-height-heading: 1.2em;
--line-height-heading-small: 1.4em;
--h1-font-size: 80px;
--h2-font-size: 56px;
--h3-font-size: 24px;
--h4-font-size: 20px;
--h5-font-size: 18px;
--h6-font-size: 14px;
--h1-font-weight: 600;
--h2-font-weight: 600;
--h3-font-weight: 600;
--h4-font-weight: 600;
--h5-font-weight: 600;
--h6-font-weight: 700;
--sec-title-subtitle-color: #9F9F9F;
--sec-title-subtitle-font-size: 16px;
--sec-title-subtitle-font-family: var(--heading-font-family);
--sec-title-subtitle-font-weight: 600;
--sec-title-subtitle-line-height: 1;
--sec-title-color: var(--headings-color);
--sec-title-font-size: 56px;
--sec-title-font-family: var(--heading-font-family);
--sec-title-font-weight: var(--h2-font-weight);
--theme-light-background: #f8f6f1;
--theme-light-background-text-color: var(--headings-color);
--theme-black: #222429;
--container-width: 1320px;
--small-container-width: 1000px;
--large-container-width: 1550px;
--container-pt: 120px;
--container-pb: 120px;
}
/*
* typography.scss
* -----------------------------------------------
*/
/* --------------------------------------------
Template Default Fonts & Fonts Styles
---------------------------------------------- */
::-moz-selection {
background: var(--theme-color1);
color: #fff;
text-shadow: none;
}
::selection {
background: var(--theme-color1);
color: #fff;
text-shadow: none;
}
::-moz-selection {
background: var(--theme-color1); /* Firefox */
color: #fff;
text-shadow: none;
}
::-webkit-selection {
background: var(--theme-color1); /* Safari */
color: #fff;
text-shadow: none;
}
:active,
:focus {
outline: none !important;
}
::-webkit-input-placeholder {
color: #7c858c;
}
::-moz-input-placeholder {
color: #7c858c;
}
::-ms-input-placeholder {
color: #7c858c;
}
body {
background-color: var(--body-color);
background-attachment: fixed;
-ms-word-wrap: break-word;
word-wrap: break-word;
counter-reset: my-sec-counter;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
color: var(--text-color);
font-size: var(--body-font-size);
font-family: var(--body-font-family);
font-weight: var(--body-font-weight);
line-height: var(--body-line-height);
}
p, .text {
color: var(--text-color);
font-size: var(--body-font-size);
font-family: var(--body-font-family);
font-weight: var(--body-font-weight);
line-height: var(--body-line-height);
}
/* -------- Headings ---------- */
h1, h2, h3, h4, h5, h6 {
color: var(--headings-color);
font-family: var(--heading-font-family);
position: relative;
}
h1 small,
h1 .small, h2 small,
h2 .small, h3 small,
h3 .small, h4 small,
h4 .small, h5 small,
h5 .small, h6 small,
h6 .small {
font-weight: normal;
line-height: 1;
color: var(--headings-color);
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
color: inherit;
font-weight: inherit;
}
h1 {
font-size: var(--h1-font-size);
font-weight: var(--h1-font-weight);
line-height: var(--line-height-heading-h1);
}
h2 {
font-size: var(--h2-font-size);
font-weight: var(--h2-font-weight);
line-height: var(--line-height-heading);
}
h3 {
font-size: var(--h3-font-size);
font-weight: var(--h3-font-weight);
line-height: var(--line-height-heading);
}
h4 {
font-size: var(--h4-font-size);
font-weight: var(--h4-font-weight);
line-height: var(--line-height-heading-small);
}
h5 {
font-size: var(--h5-font-size);
font-weight: var(--h5-font-weight);
line-height: var(--line-height-heading-small);
}
h6 {
font-size: var(--h6-font-size);
font-weight: var(--h6-font-weight);
line-height: var(--line-height-heading-small);
}
/* -------- Body Text ---------- */
table p {
margin-bottom: 0;
}
p {
padding: 0;
margin: 0;
}
p a:not(.button):not(.btn):hover, p a:not(.button):not(.btn):focus {
text-decoration: underline;
}
/* -------- other ---------- */
a {
color: var(--link-color);
text-decoration: none;
font-weight: var(--body-font-weight);
cursor: pointer;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a:hover, a:focus {
color: inherit;
text-decoration: none;
outline: none;
}
a b, a strong {
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a img {
border: none;
}
pre,
ul,
ol,
dl,
dd,
blockquote,
address,
table,
fieldset {
margin-bottom: 10px;
}
ol, ul {
list-style-position: inside;
margin: 0;
padding: 0;
list-style: none;
}
iframe {
border: none !important;
}
/*
* container.scss
* -----------------------------------------------
*/
.container .container {
width: 100%;
}
.container .container,
.container .container-fluid,
.container-fluid .container,
.container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
section > .container,
section > .container-fluid {
padding-top: var(--container-pt);
padding-bottom: var(--container-pt);
}
@media (max-width: 1199px) {
section > .container,
section > .container-fluid {
padding: 100px 0;
}
}
@media (max-width: 991px) {
section > .container,
section > .container-fluid {
padding: 80px 0;
}
}
@media (min-width: 1400px) {
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
max-width: var(--container-width);
}
}
.auto-container {
position: static;
max-width: var(--container-width);
padding: 0px 15px;
margin: 0 auto;
width: 100%;
}
/*=== Default Form ===*/
.form-control, .input-text {
height: calc(2.25rem + 27px);
padding: 14px 30px;
outline: 0;
background-color: #f4f5f8;
border: 1px solid #f4f5f8;
color: #686a6f;
font-size: 0.9rem;
width: 100%;
}
.form-control::-webkit-input-placeholder, .input-text::-webkit-input-placeholder {
color: #686a6f;
opacity: 1;
}
.form-control::-moz-placeholder, .input-text::-moz-placeholder {
color: #686a6f;
opacity: 1;
}
.form-control:-ms-input-placeholder, .input-text:-ms-input-placeholder {
color: #686a6f;
opacity: 1;
}
.form-control::-ms-input-placeholder, .input-text::-ms-input-placeholder {
color: #686a6f;
opacity: 1;
}
.form-control::placeholder, .input-text::placeholder {
color: #686a6f;
opacity: 1;
}
.form-control:-ms-input-placeholder, .input-text:-ms-input-placeholder {
color: #686a6f;
}
.form-control::-ms-input-placeholder, .input-text::-ms-input-placeholder {
color: #686a6f;
}
textarea.form-control {
height: auto;
padding-top: 15px;
padding-bottom: 15px;
}
/*
* boxed-layout.scss
* -----------------------------------------------
*/
.tm-boxed-layout {
background-color: #444;
padding-top: 40px;
padding-bottom: 40px;
padding-left: 15px;
padding-right: 15px;
}
.tm-boxed-layout.layer-overlay:before {
z-index: -1;
}
.tm-boxed-layout .page-wrapper {
margin: 0 auto;
overflow: hidden;
}
@media (min-width: 1200px) {
.tm-boxed-layout .page-wrapper {
width: 1170px;
}
}
.tm-boxed-layout .container .container {
width: 100%;
}
@media (min-width: 1200px) {
.tm-boxed-layout .container {
width: 1140px;
}
}
@media (min-width: 1000px) {
.tm-boxed-layout.tm-container-970px .page-wrapper {
width: 970px;
}
}
.tm-boxed-layout.tm-container-970px .container,
.tm-boxed-layout.tm-container-970px .container-fluid {
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-970px .container .container,
.tm-boxed-layout.tm-container-970px .container .container-fluid,
.tm-boxed-layout.tm-container-970px .container-fluid .container,
.tm-boxed-layout.tm-container-970px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1300px) {
.tm-boxed-layout.tm-container-1230px .page-wrapper {
width: 1230px;
}
}
.tm-boxed-layout.tm-container-1230px .container,
.tm-boxed-layout.tm-container-1230px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1230px .container .container,
.tm-boxed-layout.tm-container-1230px .container .container-fluid,
.tm-boxed-layout.tm-container-1230px .container-fluid .container,
.tm-boxed-layout.tm-container-1230px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1400px) {
.tm-boxed-layout.tm-container-1300px .page-wrapper {
width: 1300px;
}
}
.tm-boxed-layout.tm-container-1300px .container,
.tm-boxed-layout.tm-container-1300px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1300px .container .container,
.tm-boxed-layout.tm-container-1300px .container .container-fluid,
.tm-boxed-layout.tm-container-1300px .container-fluid .container,
.tm-boxed-layout.tm-container-1300px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1400px) {
.tm-boxed-layout.tm-container-1340px .page-wrapper {
width: 1340px;
}
}
.tm-boxed-layout.tm-container-1340px .container,
.tm-boxed-layout.tm-container-1340px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1340px .container .container,
.tm-boxed-layout.tm-container-1340px .container .container-fluid,
.tm-boxed-layout.tm-container-1340px .container-fluid .container,
.tm-boxed-layout.tm-container-1340px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1400px) {
.tm-boxed-layout.tm-container-1440px .page-wrapper {
width: 1440px;
}
}
.tm-boxed-layout.tm-container-1440px .container,
.tm-boxed-layout.tm-container-1440px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1440px .container .container,
.tm-boxed-layout.tm-container-1440px .container .container-fluid,
.tm-boxed-layout.tm-container-1440px .container-fluid .container,
.tm-boxed-layout.tm-container-1440px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1560px) {
.tm-boxed-layout.tm-container-1500px .page-wrapper {
width: 1500px;
}
}
.tm-boxed-layout.tm-container-1500px .container,
.tm-boxed-layout.tm-container-1500px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1500px .container .container,
.tm-boxed-layout.tm-container-1500px .container .container-fluid,
.tm-boxed-layout.tm-container-1500px .container-fluid .container,
.tm-boxed-layout.tm-container-1500px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
@media (min-width: 1660px) {
.tm-boxed-layout.tm-container-1600px .page-wrapper {
width: 1600px;
}
}
.tm-boxed-layout.tm-container-1600px .container,
.tm-boxed-layout.tm-container-1600px .container-fluid {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.tm-boxed-layout.tm-container-1600px .container .container,
.tm-boxed-layout.tm-container-1600px .container .container-fluid,
.tm-boxed-layout.tm-container-1600px .container-fluid .container,
.tm-boxed-layout.tm-container-1600px .container-fluid .container-fluid {
padding-left: 0;
padding-right: 0;
}
.tm-boxed-layout.tm-container-100pr .page-wrapper {
width: 95%;
}
.tm-boxed-layout.tm-container-100pr .page-wrapper .container,
.tm-boxed-layout.tm-container-100pr .page-wrapper .container-fluid {
width: 100%;
}
.tm-boxed-layout.container-shadow .page-wrapper {
-webkit-box-shadow: 0 0 25px 0 #777;
box-shadow: 0 0 25px 0 #777;
}
.tm-boxed-layout .header,
.tm-boxed-layout section,
.tm-boxed-layout .footer {
background-color: #fff;
}
.tm-boxed-layout .header .navbar-default {
background-color: #fff;
border-color: #fff;
padding: 0;
}
.tm-boxed-layout .header .navbar-default .navbar-nav > li > a {
padding: 30px 5px;
}
.tm-boxed-layout .header .navbar-default .navbar-collapse {
background-color: #fff;
border-color: #fff;
margin-right: 30px;
}
.tm-boxed-layout .header #header-logo {
margin: 0;
padding-top: 27px;
}
.tm-boxed-layout .banner-section .slide-item {
min-height: 540px;
}
.tm-boxed-layout .banner-section .slide-item .content-box {
padding: 150px 0 220px;
}
.tm-boxed-layout .banner-section-two .content-box {
padding: 250px 0 150px;
}
.tm-boxed-layout .banner-section-three .content-box {
padding: 250px 0 150px;
}
.tm-boxed-layout .banner-section-four .content-box {
padding: 130px 0;
}
@media (max-width: 1200px) {
.tm-boxed-layout {
padding-top: 15px;
}
.tm-boxed-layout .header .navbar-default .navbar-nav > li > a {
padding: 10px;
}
.tm-boxed-layout .header .navbar-default .navbar-collapse {
margin-right: 15px;
}
.tm-boxed-layout .navbar-header {
padding: 15px 0;
}
.tm-boxed-layout .navbar-collapse .navbar-nav li a .caret {
margin-right: 0;
}
}
/***
====================================================================
Reset
====================================================================
***/
* {
margin: 0px;
padding: 0px;
border: none;
outline: none;
font-size: 100%;
}
/***
====================================================================
Global Settings
====================================================================
***/
textarea {
overflow: hidden;
resize: none;
}
button {
outline: none !important;
cursor: pointer;
}
img {
display: inline-block;
max-width: 100%;
height: auto;
}
ul,
li {
list-style: none;
padding: 0px;
margin: 0px;
}
.title a {
color: inherit;
}
.color1 {
color: var(--theme-color1);
}
.color2 {
color: var(--theme-color2);
}
.color3 {
color: var(--theme-color3);
}
.bg-color3 {
background-color: var(--theme-color3) !important;
}
.page-wrapper {
position: relative;
margin: 0 auto;
width: 100%;
min-width: 300px;
z-index: 99;
background-color: var(--body-color);
}
.large-container {
position: static;
max-width: var(--large-container-width);
padding: 0px 15px;
margin: 0 auto;
width: 100%;
}
.auto-container {
position: static;
max-width: var(--container-width);
padding: 0px 15px;
margin: 0 auto;
width: 100%;
}
.small-container {
position: static;
max-width: var(--small-container-width);
padding: 0px 15px;
margin: 0 auto;
width: 100%;
}
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.dropdown-toggle::after {
display: none;
}
.lineClamp5 {display: -webkit-box !important;-webkit-line-clamp: 5;-webkit-box-orient: vertical;overflow: hidden;}
.lineClamp4 {display: -webkit-box !important;-webkit-line-clamp: 4;-webkit-box-orient: vertical;overflow: hidden;}
.lineClamp3 {display: -webkit-box !important;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.lineClamp2 {display: -webkit-box !important;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.lineClamp1 {display: -webkit-box !important;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}
/*=======================
Preloader
=======================*/
.preloader {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: default;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 100%;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 9999999;
}
.preloader .animation-preloader {
z-index: 1000;
}
.preloader .animation-preloader .spinner {
-webkit-animation: spinner 1s infinite linear;
animation: spinner 1s infinite linear;
border-radius: 50%;
border: 3px solid rgba(0, 0, 0, 0.2);
border-top-color: var(--headings-color);
height: 9em;
margin: 0 auto 3.5em auto;
width: 9em;
}
@media (max-width: 767px) {
.preloader .animation-preloader .spinner {
width: 7.5em;
height: 7.5em;
margin: 0 auto 1.5em auto;
}
}
.preloader .animation-preloader .txt-loading {
font: bold 5em var(--heading-font-family), var(--body-font-family);
text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
@media (max-width: 767px) {
.preloader .animation-preloader .txt-loading {
font-size: 2.5em;
}
}
.preloader .animation-preloader .txt-loading .letters-loading {
color: var(--theme-color1);
position: relative;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
-webkit-animation-delay: 0.4s;
animation-delay: 0.4s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
-webkit-animation-delay: 0.8s;
animation-delay: 0.8s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
-webkit-animation-delay: 1.2s;
animation-delay: 1.2s;
}
.preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
-webkit-animation-delay: 1.4s;
animation-delay: 1.4s;
}
.preloader .animation-preloader .txt-loading .letters-loading::before {
-webkit-animation: letters-loading 4s infinite;
animation: letters-loading 4s infinite;
color: var(--headings-color);
content: attr(data-text-preloader);
left: 0;
opacity: 0;
font-family: var(--heading-font-family);
position: absolute;
top: -3px;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
.preloader p {
font-size: 15px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 8px;
color: var(--headings-color);
}
.preloader .loader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-size: 0;
z-index: 1;
pointer-events: none;
}
.preloader .loader .row {
height: 100%;
}
.preloader .loader .loader-section {
padding: 0px;
}
.preloader .loader .loader-section .bg {
background-color: #f5f5f5;
height: 100%;
left: 0;
width: 100%;
-webkit-transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1);
transition: all 800ms cubic-bezier(0.77, 0, 0.175, 1);
}
.preloader.loaded .animation-preloader {
opacity: 0;
-webkit-transition: 0.3s ease-out;
transition: 0.3s ease-out;
}
.preloader.loaded .loader-section .bg {
width: 0;
-webkit-transition: 0.7s 0.3s allcubic-bezier(0.1, 0.1, 0.1, 1);
transition: 0.7s 0.3s allcubic-bezier(0.1, 0.1, 0.1, 1);
}
/*=======================
Scroll To Top style
=======================*/
.scroll-to-top {
position: fixed;
right: 20px;
bottom: 20px;
width: 40px;
font-size: 16px;
line-height: 40px;
color: #ffffff;
text-align: center;
cursor: pointer;
background-color: #f06723;
z-index: 100;
display: none;
border-radius: 50%;
margin: 0 auto;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.scroll-to-top:hover {
background: var(--theme-color1);
color: #000;
}
.tabs-box {
position: relative;
}
.tabs-box .tab {
display: none;
}
.tabs-box .tab.active-tab {
display: block;
}
.theme-btn {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
white-space: nowrap;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
z-index: 0;
}
.theme-btn .btn-title {
position: relative;
}
/*Btn Style One*/
.btn-style-one {
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
border-radius: 100px;
color: #fff;
font-weight: 700;
line-height: 1;
overflow: hidden;
padding: 20px 42px;
position: relative;
}
.btn-style-one:before {
position: absolute;
left: 0;
top: 0%;
height: 100%;
width: 100%;
content: "";
background-color: var(--bg-theme-color1);
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
z-index: -1;
}
.btn-style-one:hover:before {
-webkit-transform-origin: top right;
transform-origin: top right;
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.btn-style-one:hover {
color: var(--headings-color);
}
[data-tm-layout=dark] .btn-style-one:hover .icon {
color: var(--headings-color);
}
/*Btn Style*/
.ks-btn-black {
font-weight: 700;
font-size: 14px;
line-height: 1;
border-radius: 60px;
text-transform: uppercase;
padding: 21px 30px;
text-align: center;
-webkit-transition: 0.4s;
transition: 0.4s;
position: relative;
background-color: var(--theme-color6);
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media (max-width: 1199.98px) {
.ks-btn-black {
font-size: 12px;
padding: 16px 25px;
}
}
.ks-btn-black span {
position: relative;
z-index: 1;
overflow: hidden;
display: inline-block;
color: var(--theme-color-white);
}
.ks-btn-black span span.text-1 {
position: relative;
display: block;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.ks-btn-black span span.text-2 {
position: absolute;
top: 100%;
display: block;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.ks-btn-black:hover {
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
.ks-btn-black:hover span span.text-1 {
-webkit-transform: translateY(-150%);
transform: translateY(-150%);
}
.ks-btn-black:hover span span.text-2 {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.btn-style-two {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
font-family: var(--heading-font-family);
font-size: 18px;
font-weight: 700;
line-height: 20px;
overflow: hidden;
padding: 20px 28px;
padding-right: 80px;
position: relative;
}
.btn-style-two:hover {
background-position: 100% 0;
color: var(--theme-color-white);
}
.btn-style-two:hover .icon {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
background-color: var(--headings-color);
color: var(--theme-color-white);
}
.btn-style-two .icon {
background-color: var(--theme-color-white);
border-radius: 50%;
bottom: 5px;
color: var(--theme-color-black);
font-size: 50px;
height: 50px;
line-height: 50px;
position: absolute;
right: 5px;
top: 5px;
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
width: 50px;
}
.btn-style-three {
position: relative;
padding: 26px 60px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-right: 100px;
height: 70px;
overflow: hidden;
border-radius: 100px;
color: var(--theme-color1);
background-color: rgba(255, 255, 255, 0.1);
}
.btn-style-three:before {
position: absolute;
left: 0;
top: 0%;
height: 100%;
width: 100%;
content: "";
background-color: var(--bg-theme-color1);
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
z-index: -1;
}
.btn-style-three:hover {
color: var(--headings-color);
}
.btn-style-three:hover:before {
-webkit-transform-origin: top right;
transform-origin: top right;
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.btn-style-three:hover .icon {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
background-color: var(--headings-color);
color: var(--headings-color);
}
.btn-style-three .icon {
background-color: var(--theme-color1);
border-radius: 50%;
bottom: 4px;
color: var(--theme-color-black);
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
width: 62px;
}
/***
====================================================================
Anim Icons
====================================================================
***/
.bounce-y {
-webkit-animation: bounce-y 10s infinite linear;
animation: bounce-y 10s infinite linear;
}
.bounce-x {
-webkit-animation: bounce-x 10s infinite linear;
animation: bounce-x 10s infinite linear;
}
.zoom-one {
-webkit-animation: zoom-one 10s infinite linear;
animation: zoom-one 10s infinite linear;
}
@-webkit-keyframes float {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes float {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes bounce-y {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes bounce-y {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
50% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes bounce-x {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
50% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes bounce-x {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
50% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes zoom-one {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
50% {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
100% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
}
@keyframes zoom-one {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
50% {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
100% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
}
.overlay-anim {
position: relative;
}
.overlay-anim:after {
background: rgba(255, 255, 255, 0.3);
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 0;
opacity: 1;
z-index: 9;
pointer-events: none;
}
.overlay-anim:hover:after {
height: 100%;
opacity: 0;
-webkit-transition: all 400ms linear;
transition: all 400ms linear;
}
.float-bob-y {
-webkit-animation-name: float-bob-y;
animation-name: float-bob-y;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@-webkit-keyframes float-bob-y {
0% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
}
@keyframes float-bob-y {
0% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
}
.float-bob-x {
-webkit-animation-name: float-bob-x;
animation-name: float-bob-x;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@-webkit-keyframes float-bob-x {
0% {
-webkit-transform: translateX(0px);
transform: translateX(30px);
}
50% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
}
@keyframes float-bob-x {
0% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
50% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
}
@keyframes bounce-x {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
50% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
/*img-animation**********************/
.img-custom-anim-right {
-webkit-animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
opacity: 0;
}
@-webkit-keyframes img-anim-right {
0% {
-webkit-transform: translateX(5%);
transform: translateX(5%);
clip-path: inset(0 0 0 100%);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
@keyframes img-anim-right {
0% {
-webkit-transform: translateX(5%);
transform: translateX(5%);
clip-path: inset(0 0 0 100%);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
.img-custom-anim-left {
-webkit-animation: img-anim-left 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
animation: img-anim-left 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
opacity: 0;
}
@-webkit-keyframes img-anim-left {
0% {
-webkit-transform: translateX(-5%);
transform: translateX(-5%);
clip-path: inset(0 100% 0 0);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
@keyframes img-anim-left {
0% {
-webkit-transform: translateX(-5%);
transform: translateX(-5%);
clip-path: inset(0 100% 0 0);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
.img-custom-anim-top {
-webkit-animation: img-anim-top 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
animation: img-anim-top 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
opacity: 0;
}
@-webkit-keyframes img-anim-top {
0% {
-webkit-transform: translateY(-5%);
transform: translateY(-5%);
clip-path: inset(0 0 100% 0);
opacity: 0;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
@keyframes img-anim-top {
0% {
-webkit-transform: translateY(-5%);
transform: translateY(-5%);
clip-path: inset(0 0 100% 0);
opacity: 0;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
clip-path: inset(0 0 0 0);
opacity: 1;
}
}
.float-bob-y {
-webkit-animation-name: float-bob-y;
animation-name: float-bob-y;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@-webkit-keyframes float-bob-y {
0% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
}
@keyframes float-bob-y {
0% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
}
.float-bob-x {
-webkit-animation-name: float-bob-x;
animation-name: float-bob-x;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@-webkit-keyframes float-bob-x {
0% {
-webkit-transform: translateX(0px);
transform: translateX(30px);
}
50% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
}
@keyframes float-bob-x {
0% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
50% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
}
@-webkit-keyframes rounded {
50% {
-webkit-transform: rotate(20deg);
transform: rotate(20deg);
}
}
@keyframes rounded {
50% {
-webkit-transform: rotate(20deg);
transform: rotate(20deg);
}
}
@-webkit-keyframes cir36 {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes cir36 {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes spinner {
to {
-webkit-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
}
@keyframes spinner {
to {
-webkit-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
}
@-webkit-keyframes letters-loading {
0%, 75%, 100% {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
25%, 50% {
opacity: 1;
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
}
@keyframes letters-loading {
0%, 75%, 100% {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
25%, 50% {
opacity: 1;
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
}
@keyframes loaderspin {
0% {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
-webkit-transform: translate(-50%, -50%) rotate(360deg);
transform: translate(-50%, -50%) rotate(360deg);
}
}
@-webkit-keyframes tpswing {
0% {
-webkit-transform: rotate(20deg);
transform: rotate(20deg);
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes tpswing {
0% {
-webkit-transform: rotate(20deg);
transform: rotate(20deg);
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes width {
0% {
width: 0%;
}
100% {
width: 100%;
}
}
@-webkit-keyframes width {
0% {
width: 0%;
}
100% {
width: 100%;
}
}
@-webkit-keyframes loaderspin {
0% {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
-webkit-transform: translate(-50%, -50%) rotate(360deg);
transform: translate(-50%, -50%) rotate(360deg);
}
}
@-webkit-keyframes loaderpulse {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@keyframes loaderpulse {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@-webkit-keyframes sway_Y {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100% {
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes sway_Y {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100% {
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
.sway_Y__animation {
-webkit-animation: sway_Y 3s linear infinite alternate;
animation: sway_Y 3s linear infinite alternate;
}
@-webkit-keyframes sway_YY {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
@keyframes sway_YY {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
.sway_Y__animationY {
-webkit-animation: sway_YY 3s linear infinite alternate;
animation: sway_YY 3s linear infinite alternate;
}
@-webkit-keyframes rotate {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotate {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.animation__rotate {
-webkit-animation: rotate 30s linear infinite;
animation: rotate 30s linear infinite;
}
@-webkit-keyframes animate-positive {
0% {
width: 0;
}
}
@keyframes animate-positive {
0% {
width: 0;
}
}
@-webkit-keyframes rotateAndScale {
0% {
-webkit-transform: rotate(0deg) scale(1);
transform: rotate(0deg) scale(1);
}
50% {
-webkit-transform: rotate(180deg) scale(0.8);
transform: rotate(180deg) scale(0.8);
}
100% {
-webkit-transform: rotate(360deg) scale(1);
transform: rotate(360deg) scale(1);
}
}
@keyframes rotateAndScale {
0% {
-webkit-transform: rotate(0deg) scale(1);
transform: rotate(0deg) scale(1);
}
50% {
-webkit-transform: rotate(180deg) scale(0.8);
transform: rotate(180deg) scale(0.8);
}
100% {
-webkit-transform: rotate(360deg) scale(1);
transform: rotate(360deg) scale(1);
}
}
.animation__rotateAndScale {
-webkit-animation: rotateAndScale 20s linear infinite;
animation: rotateAndScale 20s linear infinite;
}
/***
====================================================================
Search Popup
====================================================================
***/
.search-popup {
position: fixed;
left: 0;
top: 0;
height: 100vh;
width: 100%;
z-index: 99;
opacity: 0;
visibility: hidden;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
overflow: hidden;
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
.search-popup .search-back-drop {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: var(--bg-theme-color2);
opacity: 0.95;
}
.search-popup .close-search {
position: absolute;
top: 30px;
right: 30px;
font-size: 26px;
color: var(--theme-color-light);
z-index: 3;
border-radius: 50%;
background-color: transparent;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .search-inner {
position: relative;
display: block;
top: 40%;
height: auto;
z-index: 1;
width: calc(100% - 60px);
max-width: 800px;
margin: auto;
opacity: 0;
-webkit-transform: translateY(-50px);
transform: translateY(-50px);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.search-popup .form-group {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.search-popup .form-group input[type=search],
.search-popup .form-group input[type=text] {
position: relative;
display: block;
line-height: 20px;
font-size: 16px;
width: 100%;
height: 50px;
border: 1px solid #e1e6dc;
padding: 15px 20px;
color: #707070;
background: #ffffff;
border-radius: 5px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .form-group input[type=search]:focus,
.search-popup .form-group input[type=text]:focus {
border-color: var(--border-theme-color2);
}
.search-popup .form-group button {
position: absolute;
right: 5px;
top: 5px;
height: 40px;
width: 40px;
display: block;
font-size: 18px;
color: var(--theme-color-dark);
line-height: 40px;
border-radius: 5px;
font-weight: normal;
background: #ffffff;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .form-group button:hover {
color: var(--theme-color-dark);
}
.search-popup textarea::-webkit-input-placeholder, .search-popup input::-webkit-input-placeholder {
color: inherit;
}
.search-popup textarea::-moz-placeholder, .search-popup input::-moz-placeholder {
color: inherit;
}
.search-popup textarea:-ms-input-placeholder, .search-popup input:-ms-input-placeholder {
color: inherit;
}
.search-popup textarea::-ms-input-placeholder, .search-popup input::-ms-input-placeholder {
color: inherit;
}
.search-popup textarea::placeholder,
.search-popup input::placeholder {
color: inherit;
}
.moblie-search-active .search-popup {
opacity: 1;
visibility: visible;
-webkit-transform: scale(1);
transform: scale(1);
border-radius: 0%;
}
.moblie-search-active .search-popup .search-inner {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-transition-delay: 500ms;
transition-delay: 500ms;
}
/***
====================================================================
Main Header
====================================================================
***/
.header-style-one .main-box {
padding: 0 70px;
}
@media (max-width: 1699.98px) {
.header-style-one .main-box {
padding: 0 30px;
}
}
@media only screen and (max-width: 1023px) {
.header-style-one .main-box {
padding: 14px 30px;
}
}
.header-style-one .main-box .nav-outer {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
}
.header-style-one .main-box .outer-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 60px;
}
@media (max-width: 1699.98px) {
.header-style-one .main-box .outer-box {
gap: 25px;
}
}
.header-style-one .main-box .ui-btn-outer .header-contact {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
line-height: 1;
}
@media (max-width: 1399.98px) {
.header-style-one .main-box .ui-btn-outer .header-contact {
display: none;
}
}
.header-style-one .main-box .ui-btn-outer .header-contact .social-icon {
gap: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-right: 1px solid #C0C0C0;
padding-right: 30px;
}
.header-style-one .main-box .ui-btn-outer .header-contact .social-icon a {
color: #CFCFCF;
font-size: 18px;
}
.header-style-one .main-box .ui-btn-outer .header-contact .social-icon a:hover {
color: var(--headings-color);
}
.header-style-one .main-box .ui-btn-outer .header-contact .info-btn {
font-family: var(--heading-font-family);
}
.header-style-one .main-box .ui-btn-outer .header-contact .info-btn:hover {
color: var(--headings-color);
}
.header-style-one .main-box .btn-style-one {
padding: 20px 38px;
}
@media (max-width: 991.98px) {
.header-style-one .main-box .btn-style-one {
display: none;
}
}
.header-style-one.header-1 {
position: relative;
z-index: 999;
}
.header-style-one.header-1 .main-box {
background-color: var(--theme-color-white);
border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
.header-style-one.header-2 {
position: absolute;
top: 30px;
left: 0;
width: 100%;
z-index: 99999;
}
.header-style-one.header-2 .mobile-nav-toggler {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .header-style-one.header-2 .mobile-nav-toggler {
color: var(--link-color);
}
.header-style-one.header-2 .main-box {
padding: 0 90px;
background-color: transparent;
border-bottom: none;
}
@media (max-width: 767.98px) {
.header-style-one.header-2 .main-box {
padding: 0 45px;
}
}
.header-style-one.header-2 .main-menu {
background-color: var(--theme-color-white);
padding: 0 42px;
border-radius: 100px;
}
[data-tm-layout=dark] .header-style-one.header-2 .main-menu {
background-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.header-style-one.header-2 .outer-box {
gap: 22px;
}
.header-style-one.header-2 .info-btn {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .header-style-one.header-2 .info-btn {
color: var(--link-color);
}
@media (max-width: 1199.98px) {
.header-style-one.header-2 .info-btn {
display: none;
}
}
.header-style-one.header-2 .btn-style-one {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .header-style-one.header-2 .btn-style-one {
color: #ffffff;
}
@media (max-width: 1399.98px) {
.header-style-one.header-2 .btn-style-one {
display: none;
}
}
.header-style-one.header-2 .btn-style-one:before {
display: none;
}
.header-style-one.header-2 .btn-style-one:hover {
background-position: 100% 0;
}
.header-style-one.header-3 {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
@media (max-width: 1199.98px) {
.header-style-one.header-3 {
background-color: var(--theme-color-white);
}
}
.header-style-one.header-3 .main-box {
padding-left: 30px;
}
.header-style-one.header-3 .main-box .main-menu {
position: relative;
margin-right: 50px;
}
.header-style-one.header-3 .main-box .ui-btn-outer {
margin-right: 50px;
}
.header-style-one.header-3 .btn-style-one {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
padding: 24px 35px !important;
margin-top: 10px;
}
@media (max-width: 1199.98px) {
.header-style-one.header-3 .btn-style-one {
margin-top: 0px;
}
}
.header-style-one.header-3 .btn-style-one:before {
display: none;
}
.header-style-one.header-3 .btn-style-one:hover {
background-position: 100% 0;
}
.header-style-one.header-5 {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 99999;
border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
.header-style-one.header-5 .mobile-nav-toggler {
color: var(--theme-color-white);
}
.header-style-one.header-5 .main-box {
padding: 10px 110px;
}
@media (max-width: 1699.98px) {
.header-style-one.header-5 .main-box {
padding: 0 30px;
}
}
@media (max-width: 991.98px) {
.header-style-one.header-5 .main-box {
padding: 15px 30px;
}
}
@media (max-width: 575.98px) {
.header-style-one.header-5 .main-box {
padding: 15px;
}
}
@media only screen and (max-width: 1023px) {
.header-style-one.header-5 .main-box {
padding: 15px 30px;
}
}
.header-style-one.header-5 .main-box.style-2 {
padding: 10px 80px;
}
@media (max-width: 1699.98px) {
.header-style-one.header-5 .main-box.style-2 {
padding: 0 30px;
}
}
@media only screen and (max-width: 1023px) {
.header-style-one.header-5 .main-box.style-2 {
padding: 15px 30px;
}
}
@media (max-width: 575.98px) {
.header-style-one.header-5 .main-box.style-2 {
padding: 15px;
}
}
.header-style-one.header-5 .main-menu {
padding: 0 42px;
border-radius: 100px;
}
[data-tm-layout=dark] .header-style-one.header-5 .main-menu .navigation li a {
color: var(--headings-color);
}
.header-style-one.header-5 .main-menu .navigation li.current a {
color: var(--theme-color1);
}
.header-style-one.header-5 .main-menu .navigation li.current::before {
display: none;
}
.header-style-one.header-5 .main-menu .navigation li.current ul {
padding-top: 0;
}
.header-style-one.header-5 .main-menu .navigation li.current ul li a {
color: var(--headings-color);
}
.header-style-one.header-5 .main-menu .navigation li ul {
padding-top: 0;
}
.header-style-one.header-5 .outer-box {
gap: 18px;
}
@media (max-width: 900px) {
.header-style-one.header-5 .user-btn {
display: none;
}
.header-style-one.header-5 .outer-box {
gap: 5px;
}
}
.header-style-one.header-5 .search-btn {
font-size: 20px;
color: var(--theme-color-white);
background: transparent;
}
@media (max-width: 575.98px) {
.header-style-one.header-5 .search-btn {
display: none;
}
}
[data-tm-layout=dark] .header-style-one.header-5 .search-btn {
color: #ffffff;
}
.header-style-one.header-5 .user-btn {
color: var(--theme-color-white);
}
.header-style-one.header-5 .contact-info {
position: relative;
font-size: 24px;
font-weight: 700;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
padding-right: 30px;
font-family: var(--heading-font-family);
color: var(--theme-color-white);
border-right: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
[data-tm-layout=dark] .header-style-one.header-5 .contact-info {
color: #ffffff;
}
.header-style-one.header-5 .contact-info:hover {
color: var(--theme-color1);
}
@media (max-width: 1199.98px) {
.header-style-one.header-5 .contact-info {
display: none;
}
}
.header-style-one.header-5 .btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
gap: 10px;
}
@media (max-width: 1399.98px) {
.header-style-one.header-5 .btn-style-one {
display: none;
}
}
[data-tm-layout=dark] .header-style-one.header-5 .btn-style-one {
color: #ffffff;
}
.header-style-one.header-5 .btn-style-one:before {
display: none;
}
.header-style-one.header-5 .btn-style-one:hover {
background-position: 100% 0;
}
.header-style-one.header-5 .sticky-header .main-menu .navigation li a {
color: var(--headings-color);
}
.header-style-one.header-7 .main-box {
padding: 20px 30px;
}
.header-style-one.header-7 .main-box .outer-box {
gap: 25px;
}
.header-style-one.header-7 .main-box .outer-box .search-btn {
font-size: 20px;
background: transparent;
}
[data-tm-layout=dark] .header-style-one.header-7 .main-box .outer-box .search-btn {
color: #ffffff;
}
@media (max-width: 575.98px) {
.header-style-one.header-7 .main-box .outer-box .search-btn {
display: none;
}
}
.header-style-one.header-7 .main-box .outer-box .btn-style-one {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
color: var(--theme-color-white);
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
[data-tm-layout=dark] .header-style-one.header-7 .main-box .outer-box .btn-style-one {
color: #ffffff;
}
@media (max-width: 767.98px) {
.header-style-one.header-7 .main-box .outer-box .btn-style-one {
display: none;
}
}
.main-menu {
position: relative;
}
.main-menu .navbar-header {
display: none;
}
.main-menu .navbar-collapse {
padding: 0px;
}
.main-menu .navigation {
margin: 0px;
position: relative;
}
.main-menu .navigation > li {
float: left;
margin-right: 46px;
padding: 25px 0px;
position: relative;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1899.98px) {
.main-menu .navigation > li {
margin-right: 35px;
}
}
.main-menu .navigation > li:last-child {
margin-right: 0;
}
.main-menu .navigation > li:before {
background-color: var(--headings-color);
bottom: 23px;
content: "";
height: 1px;
left: 50%;
position: absolute;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 0%;
}
.main-menu .navigation > li:hover:before, .main-menu .navigation > li.current:before {
left: 0;
width: 100%;
}
.main-menu .navigation > li > a {
color: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 16px;
line-height: 30px;
font-weight: 600;
opacity: 1;
padding: 0;
position: relative;
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1899.98px) {
.main-menu .navigation > li > a {
font-size: 15px;
}
}
.main-menu .navigation > li > a .icon {
position: relative;
font-size: 22px;
line-height: 24px;
margin-left: 10px;
}
.main-menu .navigation > li > a:hover {
color: #fff;
opacity: .4;
}
.main-menu .navigation > li.current > a {
color: var(--headings-color);
font-weight: 500;
}
.main-menu .navigation > li.dropdown:hover > ul {
margin-top: 0;
opacity: 1;
top: 100%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
visibility: visible;
}
.main-menu .navigation > li > ul {
background-color: var(--theme-color-white);
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
display: none;
left: 0px;
margin-top: 30px;
opacity: 0;
padding: 10px 0 0;
position: absolute;
top: 100%;
width: 220px;
z-index: 100;
}
.main-menu .navigation > li > ul.from-right {
left: auto;
right: 0px;
}
.main-menu .navigation > li > ul > li {
position: relative;
width: 100%;
border-bottom: 1px solid #ebf1f5;
}
[data-tm-layout=dark] .main-menu .navigation > li > ul > li {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.main-menu .navigation > li > ul > li:last-child {
border-bottom: none;
}
.main-menu .navigation > li > ul > li > a {
position: relative;
display: block;
padding: 10px 0px;
line-height: 29px;
font-weight: 500;
font-size: 16px;
color: #f06723;
text-align: left;
margin: 0 30px;
-webkit-transition: all 200ms ease;
transition: all 200ms ease;
}
.main-menu .navigation > li > ul > li:hover > a {
color: #f58a20;
}
.main-menu .navigation > li > ul > li.dropdown > a:after {
font-family: "Font Awesome 5 Free";
content: "\f105";
position: absolute;
right: 0;
top: 11px;
display: block;
line-height: 24px;
font-size: 11px;
font-weight: 900;
z-index: 5;
}
.main-menu .navigation > li > ul > li.dropdown:hover > ul {
visibility: visible;
opacity: 1;
top: 0px;
margin-top: 20px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-menu .navigation > li > ul > li > ul {
background-color: var(--theme-color-white);
-webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
display: none;
left: 100%;
margin-top: 10px;
opacity: 0;
padding: 10px 0 0;
position: absolute;
top: 0px;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
width: 220px;
z-index: 100;
}
.main-menu .navigation > li > ul > li > ul > li {
position: relative;
border-bottom: 1px solid #ebf1f5;
width: 100%;
}
.main-menu .navigation > li > ul > li > ul > li:last-child {
border-bottom: none;
}
.main-menu .navigation > li > ul > li > ul > li > a {
position: relative;
display: block;
padding: 10px 0;
line-height: 24px;
font-weight: 500;
font-size: 16px;
color: var(--headings-color);
font-family: var(--heading-font-family);
text-align: left;
margin: 0 30px;
text-transform: capitalize;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-menu .navigation > li > ul > li > ul > li > a:hover {
color: var(--headings-color);
}
.main-menu .navigation li.dropdown .dropdown-btn {
border: 1px solid var(--theme-color-white);
color: var(--theme-color-white);
cursor: pointer;
display: none;
font-size: 16px;
height: 30px;
line-height: 26px;
position: absolute;
right: 10px;
text-align: center;
top: 8px;
width: 34px;
z-index: 5;
}
.sticky-header {
background: var(--theme-color-white);
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
left: 0px;
opacity: 0;
padding: 0px 0px;
position: fixed;
top: 0px;
visibility: hidden;
width: 100%;
z-index: 99999;
}
.header-style-one.header-2.fixed-header .sticky-header .nav-outer .main-menu {
background-color: transparent;
}
.sticky-header.fixed-header {
opacity: 1;
visibility: visible;
z-index: 9999;
}
.sticky-header .logo {
padding: 10px 0;
}
.sticky-header .logo img {
max-height: 40px;
}
.sticky-header .nav-outer {
background: none;
position: relative;
}
.sticky-header .inner-container {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: relative;
}
.sticky-header .main-menu .navigation > li {
margin: 0;
margin-left: 46px;
padding: 20px 0;
}
.sticky-header .main-menu .navigation > li > a {
color: var(--headings-color);
}
.sticky-header .main-menu .navigation > li.current > a,
.sticky-header .main-menu .navigation > li:hover > a {
color: var(--headings-color);
}
.sticky-header .main-menu .navigation > li:before {
display: none;
}
.sticky-header .outer-box,
.sticky-header .navbar-header {
display: none;
}
.sticky-header .mobile-nav-toggler {
color: var(--headings-color) !important;
}
/***
====================================================================
Helping Section
====================================================================
***/
.section-padding {
padding: 120px 0;
}
@media (max-width: 1199.98px) {
.section-padding {
padding: 100px 0;
}
}
@media (max-width: 991.98px) {
.section-padding {
padding: 80px 0;
}
}
/* background */
.bg-cover {
background-repeat: no-repeat;
background-size: cover;
position: relative;
background-position: center;
}
@-webkit-keyframes draw {
to {
stroke-dashoffset: 0;
}
}
@keyframes draw {
to {
stroke-dashoffset: 0;
}
}
@-webkit-keyframes draw2 {
to {
stroke-dashoffset: 0;
}
}
@keyframes draw2 {
to {
stroke-dashoffset: 0;
}
}
@media (max-width: 767.98px) {
br {
display: none;
}
}
.fix {
overflow: hidden;
}
.array-button {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 6px;
position: absolute;
bottom: 5px;
right: 50px;
}
.array-button .array-prev, .array-button .array-next {
width: 40px;
height: 40px;
line-height: 45px;
text-align: center;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.2);
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
color: #fff;
font-size: 16px;
backdrop-filter: blur(20px);
}
[data-tm-layout=dark] .array-button .array-prev, [data-tm-layout=dark] .array-button .array-next {
border-color: rgba(255, 255, 255, 0.1);
}
.array-button .array-prev i, .array-button .array-next i {
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.array-button .array-prev svg path, .array-button .array-next svg path {
fill: #fff;
}
.array-button .array-prev:hover, .array-button .array-next:hover {
background: var(--gradient-1);
color: #fff;
}
.section-bg {
background-color: #F5F5F5;
}
[data-tm-layout=dark] .section-bg {
}
.section-bg-2 {
background-color: var(--theme-color2) !important;
}
.footer-bg {
background-color: #052221;
}
.swiper-dot {
position: relative;
z-index: 99;
line-height: 1;
}
.swiper-dot-main .dot2{position: absolute;bottom: 55px;left: 110px;}
.swiper-dot .swiper-pagination-bullet {
width: 40px;
height: 10px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
background-color: #fff;
opacity: 1;
border-radius: 8px;
}
.swiper-dot .swiper-pagination-bullet:not(:last-child) {
margin-right: 10px;
}
.swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
background-color: #ddd;
opacity: .5;
-webkit-transition: 0.6s;
transition: 0.6s;
position: relative;
}
.body-bg {
background-color: #F6F5EF;
}
.sticky-style {
position: sticky;
top: 100px;
}
/***
====================================================================
Mobile Menu
====================================================================
***/
.mobile-nav-toggler {
position: relative;
font-size: 24px;
line-height: 20px;
cursor: pointer;
color: var(--heading-color);
display: none;
top: 0px;
margin-left: 25px;
-webkit-box-ordinal-group: 9;
-ms-flex-order: 8;
order: 8;
}
.mobile-menu {
position: fixed;
right: 0;
top: 0;
width: 300px;
max-width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
z-index: 999999;
}
.mobile-menu .menu-backdrop {
position: fixed;
right: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
background: rgba(0, 0, 0, 0.7);
opacity: 0;
visibility: hidden;
}
.mobile-menu .upper-box {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
padding: 20px 20px;
}
.mobile-menu .close-btn {
position: relative;
top: -10px;
text-align: center;
font-size: 18px;
color: var(--theme-color3);
cursor: pointer;
z-index: 10;
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
-webkit-transform: translateY(-50px);
transform: translateY(-50px);
}
.mobile-menu .close-btn:hover {
opacity: 0.5;
}
.mobile-menu .nav-logo {
position: relative;
text-align: left;
width: 100%;
}
.mobile-menu .nav-logo img {
max-height: 40px;
}
.mobile-menu .menu-box {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
max-height: 100%;
overflow-y: auto;
background: var(--headings-color);
padding: 0px 0px;
z-index: 5;
opacity: 0;
visibility: hidden;
border-radius: 0px;
-webkit-transform: translateX(101%);
transform: translateX(101%);
}
[data-tm-layout=dark] .mobile-menu .menu-box {
background: var(--dark-color1);
}
.mobile-menu-visible {
overflow: hidden;
}
.mobile-menu-visible .mobile-menu {
opacity: 1;
visibility: visible;
}
.mobile-menu-visible .mobile-menu .menu-backdrop {
opacity: 1;
visibility: visible;
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.mobile-menu-visible .mobile-menu .menu-box {
opacity: 1;
visibility: visible;
-webkit-transition: all 0.4s ease 200ms;
transition: all 0.4s ease 200ms;
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
.mobile-menu-visible .mobile-menu .close-btn {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
.mobile-menu-visible .scroll-to-top {
opacity: 0;
visibility: hidden;
}
.mobile-menu .navigation {
position: relative;
display: block;
width: 100%;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-menu .navigation li {
position: relative;
display: block;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-menu .navigation li > ul > li:last-child {
border-bottom: none;
}
.mobile-menu .navigation li > ul > li:first-child {
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-menu .navigation li > a {
position: relative;
display: block;
line-height: 24px;
padding: 10px 20px;
font-size: 16px;
color: #ffffff;
font-weight: 400;
}
.mobile-menu .navigation li:hover > a, .mobile-menu .navigation li.current > a {
color: #fff;
}
.mobile-menu .navigation li.dropdown .dropdown-btn {
position: absolute;
right: 0px;
top: 0px;
width: 44px;
height: 44px;
text-align: center;
font-size: 17px;
line-height: 44px;
font-weight: 500;
font-family: var(--heading-font-family);
color: #ffffff;
cursor: pointer;
z-index: 5;
}
.mobile-menu .navigation li.dropdown .dropdown-btn:after {
content: "";
position: absolute;
left: 0px;
top: 10px;
width: 1px;
height: 24px;
border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-menu .navigation li.dropdown .dropdown-btn.active i:before {
content: "\f106";
}
.mobile-menu .navigation li > ul,
.mobile-menu .navigation li > ul > li > ul {
display: none;
}
.mobile-menu .navigation li > ul > li {
padding-left: 20px;
}
.contact-list-one {
position: relative;
padding: 30px 20px 20px;
}
.contact-list-one li {
position: relative;
margin-bottom: 20px;
}
.contact-list-one li:last-child {
margin-right: 0;
}
.contact-list-one li .contact-info-box {
position: relative;
padding-left: 54px;
font-size: 14px;
line-height: 24px;
color: #ffffff;
}
.contact-list-one li .contact-info-box a {
color: #ffffff;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-list-one li .contact-info-box .icon {
position: absolute;
left: 0;
top: 0;
font-size: 34px;
line-height: 50px;
color: #fff;
}
.contact-list-one li .contact-info-box .title {
display: block;
font-size: 12px;
color: #b2c1c0;
font-weight: 400;
text-transform: uppercase;
}
.mobile-menu .social-links {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
background: var(--bg-theme-color1);
width: 100%;
border-top: 1px solid rgba(255, 255, 255, 0.1);
margin-top: auto;
}
[data-tm-layout=dark] .mobile-menu .social-links {
background: var(--dark-color2);
}
.mobile-menu .social-links li {
position: relative;
text-align: center;
width: 100%;
border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.mobile-menu .social-links li a {
position: relative;
display: block;
line-height: 50px;
height: 50px;
font-size: 14px;
text-align: center;
color: var(--headings-color);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.mobile-menu .social-links li a:hover {
color: var(--theme-color2);
}
/***
====================================================================
Search Popup
====================================================================
***/
.search-popup {
position: fixed;
left: 0;
top: 0;
height: 100vh;
width: 100%;
z-index: 99;
opacity: 0;
visibility: hidden;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
overflow: hidden;
-webkit-transform: scale(0.95);
transform: scale(0.95);
}
.search-popup .search-back-drop {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: var(--bg-theme-color2);
opacity: 0.95;
}
.search-popup .close-search {
position: absolute;
top: 30px;
right: 30px;
font-size: 26px;
color: var(--theme-color-light);
z-index: 3;
border-radius: 50%;
background-color: transparent;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .search-inner {
position: relative;
display: block;
top: 40%;
height: auto;
z-index: 1;
width: calc(100% - 60px);
max-width: 800px;
margin: auto;
opacity: 0;
-webkit-transform: translateY(-50px);
transform: translateY(-50px);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.search-popup .form-group {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.search-popup .form-group input[type=search],
.search-popup .form-group input[type=text] {
position: relative;
display: block;
line-height: 20px;
font-size: 16px;
width: 100%;
height: 50px;
border: 1px solid #e1e6dc;
padding: 15px 20px;
color: #707070;
background: #ffffff;
border-radius: 5px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .form-group input[type=search]:focus,
.search-popup .form-group input[type=text]:focus {
border-color: var(--border-theme-color2);
}
.search-popup .form-group button {
position: absolute;
right: 5px;
top: 5px;
height: 40px;
width: 40px;
display: block;
font-size: 18px;
color: var(--theme-color-dark);
line-height: 40px;
border-radius: 5px;
font-weight: normal;
background: #ffffff;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.search-popup .form-group button:hover {
color: var(--theme-color-dark);
}
.search-popup textarea::-webkit-input-placeholder, .search-popup input::-webkit-input-placeholder {
color: inherit;
}
.search-popup textarea::-moz-placeholder, .search-popup input::-moz-placeholder {
color: inherit;
}
.search-popup textarea:-ms-input-placeholder, .search-popup input:-ms-input-placeholder {
color: inherit;
}
.search-popup textarea::-ms-input-placeholder, .search-popup input::-ms-input-placeholder {
color: inherit;
}
.search-popup textarea::placeholder,
.search-popup input::placeholder {
color: inherit;
}
.moblie-search-active .search-popup {
opacity: 1;
visibility: visible;
-webkit-transform: scale(1);
transform: scale(1);
border-radius: 0%;
}
.moblie-search-active .search-popup .search-inner {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-transition-delay: 500ms;
transition-delay: 500ms;
}
/***
====================================================================
Section Title
====================================================================
***/
.sec-title {
position: relative;
margin-bottom: 30px;
}
@media (max-width: 767.98px) {
.sec-title {
margin-bottom: 0;
}
}
.sec-title .sub-title {
position: relative;
font-size: 22px;
color: var(--headings-color);
line-height: var(--sec-title-subtitle-line-height);
font-weight: var(--sec-title-subtitle-font-weight);
text-transform: uppercase;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
padding-left: 50px;
gap: 10px;
}
.sec-title .sub-title.light {
color: var(--theme-color-light);
}
.sec-title .sub-title.light .triangle.triangle2 {
border-left-color: var(--theme-color-white);
}
.sec-title .sub-title .triangle {
position: absolute;
width: 0;
height: 0;
border-top: 9.803px solid transparent;
border-bottom: 9.803px solid transparent;
border-left: 19.606px solid;
}
.sec-title .sub-title .triangle.triangle1 {
border-left-color: var(--theme-color1);
left: 5px;
z-index: 9;
}
.sec-title .sub-title .triangle.triangle2 {
border-left-color: #f06723;
left: 20px;
-webkit-animation: move2 1s infinite alternate ease-in-out;
animation: move2 1s infinite alternate ease-in-out;
}
@-webkit-keyframes move1 {
0% {
left: 5px;
}
100% {
left: 2px;
}
}
@keyframes move1 {
0% {
left: 5px;
}
100% {
left: 2px;
}
}
@-webkit-keyframes move2 {
0% {
left: 20px;
}
100% {
left: 17px;
}
}
@keyframes move2 {
0% {
left: 20px;
}
100% {
left: 17px;
}
}
@media (max-width: 1199.98px) {
.sec-title h2 {
font-size: 50px;
}
}
@media (max-width: 767.98px) {
.sec-title h2 {
font-size: 44px;
}
}
@media (max-width: 575.98px) {
.sec-title h2 {
font-size: 38px;
}
}
@media (max-width: 469.98px) {
.sec-title h2 {
font-size: 30px;
}
}
.sec-title .title {
position: relative;
font-size: var(--sec-title-font-size);
color: var(--sec-title-color);
font-family: var(--sec-title-font-family);
font-weight: var(--sec-title-font-weight);
margin-top: -9px;
margin-bottom: 0;
}
.sec-title .title.light {
color: var(--theme-color-light);
}
@media (max-width: 1199.98px) {
.sec-title .title {
font-size: 50px;
}
}
@media (max-width: 767.98px) {
.sec-title .title {
font-size: 44px;
}
}
@media (max-width: 575.98px) {
.sec-title .title {
font-size: 38px;
}
}
@media (max-width: 469.98px) {
.sec-title .title {
font-size: 30px;
}
}
.sec-title .text {
margin-top: 35px;
}
.sec-title.center {
text-align: center;
}
.sec-title.center .sub-title {
margin: 0 auto;
margin-bottom: 10px;
}
/***
====================================================================
Main Slider
====================================================================
***/
/***
====================================================================
Banner Section
====================================================================
***/
.hero-1 {
padding: 170px 0 170px;
background: #F5F5F5;
position: relative;
overflow: hidden;
z-index: 9;
}
[data-tm-layout=dark] .hero-1 {
background-color: var(--dark-color2);
}
@media (max-width: 1199.98px) {
.hero-1 {
padding: 140px 0 100px;
}
}
@media (max-width: 767.98px) {
.hero-1 {
padding: 100px 0 100px;
}
}
.hero-1 .shape-1 {
position: absolute;
top: 0;
left: 0;
}
@media screen and (max-width: 1499px) {
.hero-1 .shape-1 {
top: -50px;
}
}
@media (max-width: 1199.98px) {
.hero-1 .shape-1 {
display: none;
}
}
.hero-1 .shape-3 {
position: absolute;
top: 0;
left: 150px;
z-index: -1;
}
@media (max-width: 1199.98px) {
.hero-1 .shape-3 {
display: none;
}
}
.hero-1 .hero-content {
margin-left: 70px;
}
@media screen and (max-width: 1499px) {
.hero-1 .hero-content {
margin-left: 50px;
}
}
@media (max-width: 1399.98px) {
.hero-1 .hero-content {
margin-left: 20px;
}
}
@media (max-width: 1199.98px) {
.hero-1 .hero-content {
margin-left: 0;
}
}
@media (max-width: 991.98px) {
.hero-1 .hero-content {
margin-left: 0;
}
}
@media (max-width: 991.98px) {
.hero-1 .hero-content h1 {
font-size: 70px;
line-height: 130%;
}
}
@media (max-width: 767.98px) {
.hero-1 .hero-content h1 {
font-size: 48px;
}
}
@media (max-width: 575.98px) {
.hero-1 .hero-content h1 {
font-size: 34px;
}
}
.hero-1 .hero-content h6 {
font-size: 16px;
font-weight: 600;
border: 1px solid;
padding: 0 35px;
border-radius: 100px;
display: inline-block;
line-height: 60px;
padding-left: 70px;
padding-bottom: 0;
height: 60px;
position: relative;
margin-bottom: 20px;
border: 1px solid #CBCBCB;
}
[data-tm-layout=dark] .hero-1 .hero-content h6 {
border: 1px solid #CBCBCB;
}
@media (max-width: 575.98px) {
.hero-1 .hero-content h6 {
font-size: 13px;
}
}
.hero-1 .hero-content h6 .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
bottom: 6px;
border-radius: 46px;
display: inline-block;
height: 46px;
left: 6px;
line-height: 46px;
margin-right: 10px;
position: absolute;
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 46px;
}
.hero-1 .hero-content h6:hover .icon {
background-position: 100% 0;
}
.hero-1 .hero-content p {
font-size: 18px;
max-width: 530px;
margin-top: 20px;
}
@media only screen and (max-width: 424px) {
.hero-1 .hero-content p {
margin-top: 10px;
}
}
@media (max-width: 991.98px) {
.hero-1 .hero-content p {
font-size: 16px;
}
}
@media (max-width: 575.98px) {
.hero-1 .hero-content p {
font-size: 15px;
}
}
.hero-1 .hero-content .hero-button {
margin-top: 45px;
}
@media (max-width: 767.98px) {
.hero-1 .hero-content .hero-button {
margin-top: 30px;
}
}
.hero-1 .hero-content .hero-button .theme-btn {
position: relative;
}
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one {
padding: 26px 60px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-right: 100px;
height: 70px;
}
@media only screen and (max-width: 767px) {
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one:hover .icon svg path {
fill: #ffffff;
}
@media (max-width: 575.98px) {
.hero-1 .hero-content .hero-button .theme-btn.btn-style-one {
height: 57px;
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
}
}
.hero-1 .hero-content .hero-button .theme-btn .icon {
width: 62px;
height: 62px;
line-height: 62px;
border-radius: 50%;
background-color: var(--theme-color1);
position: absolute;
right: 4px;
top: 4px;
bottom: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
color: var(--headings-color);
font-size: 25px;
}
.hero-1 .hero-content .hero-button .theme-btn:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.hero-1 .hero-content .hero-button .theme-btn:hover .icon svg path {
fill: #ffffff;
}
.hero-1 .hero-image {
position: absolute;
right: 0;
bottom: 0;
top: 0;
max-width: 905px;
}
@media screen and (max-width: 1499px) {
.hero-1 .hero-image {
max-width: 870px;
}
}
@media (max-width: 1399.98px) {
.hero-1 .hero-image {
max-width: 800px;
}
}
@media (max-width: 1199.98px) {
.hero-1 .hero-image {
display: none;
}
}
.hero-1 .hero-image .shape-2 {
position: absolute;
top: 23%;
left: 8%;
}
.hero-2 {
margin-top: -90px;
position: relative;
border-radius: 0px;
padding: 65px 110px 50px 110px;
z-index: 10;
margin-bottom: 0;
background-size: cover;
}
@media (max-width: 1199.98px) {
.hero-2 {
padding: 180px 30px;
margin: 0;
border-radius: 0;
}
}
@media (max-width: 767.98px) {
.hero-2 {
padding: 10px 21px 60px;
}
}
.hero-2::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 0;
background: linear-gradient(0deg, rgba(6, 41, 40, 0.9) 38.63%, rgba(11, 49, 48, 0) 96.73%);
z-index: -1;
}
@media (max-width: 1199.98px) {
.hero-2::before {
border-radius: 0;
background: #f06723;
}
}
[data-tm-layout=dark] .hero-2::before {
background: linear-gradient(103.16deg, rgba(16, 60, 59, 0.9) 38.63%, rgba(11, 49, 48, 0) 96.73%);
}
.hero-2 .hero-content h1 {
color: var(--theme-color-white);
font-size: clamp(40px, 5.62vw, 90px);
line-height: 1.11;
}
[data-tm-layout=dark] .hero-2 .hero-content h1 {
color: var(--headings-color);
}
.hero-2 .hero-content h1 span {
overflow: hidden;
position: relative;
}
.hero-2 .hero-content h1 span::before {
position: absolute;
bottom: 20px;
left: -11px;
right: 0;
width: 104%;
height: 20px;
content: "";
background: -webkit-gradient(linear, left top, right top, from(#149B93), to(#B7E96C));
background: linear-gradient(90deg, #149B93 0%, #B7E96C 100%);
z-index: -1;
}
@media (max-width: 767.98px) {
.hero-2 .hero-content h1 span::before {
width: 90%;
bottom: 10px;
left: 0;
}
}
.hero-2 .hero-content .hero-text {
font-size: 20px;
color: var(--theme-color-white);
text-transform: capitalize;
max-width: 470px;
margin-top: 30px;
}
[data-tm-layout=dark] .hero-2 .hero-content .hero-text {
color: var(--text-color);
}
.hero-2 .hero-content .hero-button {
margin-top: 45px;
}
@media (max-width: 767.98px) {
.hero-2 .hero-content .hero-button {
margin-top: 30px;
}
}
.hero-2 .hero-content .hero-button .theme-btn {
position: relative;
}
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one:before {
display: none;
}
@media only screen and (max-width: 767px) {
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.hero-2 .hero-content .hero-button .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.hero-2 .hero-content .hero-button .theme-btn .icon {
background-color: var(--theme-color1);
bottom: 4px;
border-radius: 50%;
height: 62px;
line-height: 65px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 62px;
font-size: 30px;
color: var(--headings-color);
}
.hero-2 .hero-content .hero-button .theme-btn .icon i {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
display: inline-block;
}
.hero-2 .hero-content .hero-button .theme-btn:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.hero-2 .hero-box-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
gap: 22px;
}
@media (max-width: 1199.98px) {
.hero-2 .hero-box-items {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
}
@media (max-width: 767.98px) {
.hero-2 .hero-box-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.hero-2 .hero-box-items .hero-box {
border-radius: 10px;
background: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(20px);
padding: 30px 25px;
height: 220px;
}
[data-tm-layout=dark] .hero-2 .hero-box-items .hero-box {
backdrop-filter: blur(40px);
background-color: rgb(var(--theme-color-black-rgb), 0.2);
}
.hero-2 .hero-box-items .hero-box .icon {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
font-size: 40px;
color: var(--theme-color-white);
}
.hero-2 .hero-box-items .hero-box .content {
margin-top: 20px;
}
.hero-2 .hero-box-items .hero-box .content h3 {
font-size: 28px;
font-weight: 600;
color: var(--theme-color-white);
margin-bottom: 10px;
}
[data-tm-layout=dark] .hero-2 .hero-box-items .hero-box .content h3 {
color: var(--headings-color);
}
.hero-2 .hero-box-items .hero-box .content p {
font-size: 16px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .hero-2 .hero-box-items .hero-box .content p {
color: #ffffff;
}
.hero-2 .hero-box-items .hero-box:hover .icon {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.hero-3 {
margin-left: 30px;
margin-right: 30px;
margin-top: 20px;
position: relative;
z-index: -1;
padding: 160px 90px 0px;
}
@media (max-width: 1199.98px) {
.hero-3 {
margin: 0px;
padding: 150px 30px 0px;
background-image: none !important;
background-color: var(--headings-color);
}
[data-tm-layout=dark] .hero-3 {
background-color: var(--dark-color1);
}
}
.hero-3 .paper-shape {
position: absolute;
bottom: 135px;
left: 47%;
-webkit-animation: rounded 5s linear infinite;
animation: rounded 5s linear infinite;
}
@media (max-width: 1199.98px) {
.hero-3 .paper-shape {
display: none;
}
}
.hero-3 .hero-content {
position: relative;
z-index: 9;
padding-bottom: 120px;
}
@media (max-width: 1199.98px) {
.hero-3 .hero-content {
padding: 0px 0px 50px;
}
}
.hero-3 .hero-content h1 {
font-size: 90px;
font-weight: 600;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .hero-3 .hero-content h1 {
color: var(--headings-color);
}
@media (max-width: 1199.98px) {
.hero-3 .hero-content h1 {
font-size: 56px;
}
}
@media (max-width: 991.98px) {
.hero-3 .hero-content h1 {
font-size: 70px;
line-height: 130%;
}
}
@media (max-width: 767.98px) {
.hero-3 .hero-content h1 {
font-size: 52px;
}
}
@media (max-width: 575.98px) {
.hero-3 .hero-content h1 {
font-size: 44px;
}
}
.hero-3 .hero-content h1 span {
color: var(--theme-color1);
}
.hero-3 .hero-content .text-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 25px;
margin-top: 30px;
}
@media (max-width: 1199.98px) {
.hero-3 .hero-content .text-item {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.hero-3 .hero-content .text-item p {
font-size: 18px;
color: var(--theme-color-white);
max-width: 530px;
text-transform: capitalize;
line-height: 195%;
}
[data-tm-layout=dark] .hero-3 .hero-content .text-item p {
color: var(--text-color);
}
.hero-3 .hero-content .text-item img {
border-radius: 50px;
}
.hero-3 .hero-content .hero-button {
margin-top: 50px;
}
@media (max-width: 767.98px) {
.hero-3 .hero-content .hero-button {
margin-top: 30px;
}
}
.hero-3 .hero-content .hero-button .theme-btn {
position: relative;
}
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: rgba(255, 255, 255, 0.1);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one .icon svg path {
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
@media only screen and (max-width: 767px) {
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.hero-3 .hero-content .hero-button .theme-btn.btn-style-one:hover .icon {
background-color: var(--headings-color);
color: var(--theme-color-white);
}
.hero-3 .hero-content .hero-button .theme-btn .icon {
background-color: var(--theme-color1);
color: var(--theme-color-black);
border-radius: 50%;
bottom: 4px;
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
text-align: center;
top: 4px;
width: 62px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.hero-3 .hero-image {
position: relative;
z-index: 1;
margin-left: 30px;
}
.hero-3 .hero-image .ellipse-shape {
position: absolute;
left: -42%;
top: 0;
z-index: -1;
}
.hero-3 .hero-image .text-circle {
position: absolute;
top: 30%;
right: 14%;
z-index: 9;
}
@media (max-width: 575.98px) {
.hero-3 .hero-image .text-circle {
display: none;
}
}
.hero-3 .hero-image .text-circle::before {
position: absolute;
top: 50%;
left: 50%;
content: "";
width: 190px;
height: 190px;
border-radius: 50%;
background: var(--theme-color1);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: -1;
}
.hero-3 .hero-image .text-circle .star {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.hero-4 {
position: relative;
padding-top: 100px;
}
@media (max-width: 991.98px) {
.hero-4 {
padding-top: 70px;
}
}
.hero-4 .ellipse-bg {
position: absolute;
top: -100px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: -1;
}
.hero-4 .right-shape {
position: absolute;
top: 0;
right: 90px;
}
@media (max-width: 1699.98px) {
.hero-4 .right-shape {
display: none;
}
}
.hero-4 .container-fluid {
padding: 0 90px;
}
@media (max-width: 1699.98px) {
.hero-4 .container-fluid {
padding: 0 50px;
}
}
@media (max-width: 1399.98px) {
.hero-4 .container-fluid {
padding: 0 40px;
}
}
@media (max-width: 1199.98px) {
.hero-4 .container-fluid {
padding: 0 30px;
}
}
.hero-4 .hero-content h1 {
font-size: 110px;
font-weight: 600;
}
@media (max-width: 1199.98px) {
.hero-4 .hero-content h1 {
font-size: 90px;
}
.hero-4 .hero-content h1 br {
display: none;
}
}
@media (max-width: 991.98px) {
.hero-4 .hero-content h1 {
font-size: 80px;
}
}
@media (max-width: 767.98px) {
.hero-4 .hero-content h1 {
font-size: 65px;
}
}
@media (max-width: 575.98px) {
.hero-4 .hero-content h1 {
font-size: 48px;
}
}
.hero-4 .hero-content h1 span {
font-weight: 400;
background: var(--Linear, linear-gradient(90deg, #C8F169 0%, #039397 100%));
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.hero-4 .image-box {
position: relative;
margin-top: 65px;
}
@media (max-width: 767.98px) {
.hero-4 .image-box {
margin-top: 30px;
}
}
.hero-4 .image-box .image-1 {
margin-bottom: 0;
position: relative;
max-width: 1720px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.hero-4 .image-box .image-1 img {
width: 100%;
height: 100%;
}
.hero-4 .image-box .shape-image3 {
bottom: 70px;
left: -80px;
position: absolute;
}
@media (max-width: 1599.98px) {
.hero-4 .image-box .shape-image3 {
left: 0;
}
}
@media (max-width: 991.98px) {
.hero-4 .image-box .shape-image3 {
display: none;
}
}
.hero-4 .image-box .customer-info {
background-color: var(--theme-color-white);
border-radius: 50px;
max-width: 370px;
padding: 25px 24px 25px 40px;
position: absolute;
right: 0;
top: 0px;
width: 100%;
}
@media (max-width: 1699.98px) {
.hero-4 .image-box .customer-info {
max-width: 282px;
padding: 25px 24px 25px 30px;
}
}
@media (max-width: 767.98px) {
.hero-4 .image-box .customer-info {
padding: 20px;
max-width: 325px;
}
}
@media (max-width: 575.98px) {
.hero-4 .image-box .customer-info {
position: static;
}
}
.hero-4 .image-box .customer-info .count-outer {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: var(--theme-color1);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 28px;
margin-bottom: 15px;
}
@media (max-width: 767.98px) {
.hero-4 .image-box .customer-info .count-outer {
gap: 18px;
}
}
.hero-4 .image-box .customer-info .count-outer .count-box {
color: var(--headings-color);
font-family: var(--heading-font-family);
font-size: 50px;
font-weight: 600;
line-height: var(--line-height-heading-h2);
}
@media (max-width: 1699.98px) {
.hero-4 .image-box .customer-info .count-outer .count-box {
font-size: 39px;
}
}
@media (max-width: 767.98px) {
.hero-4 .image-box .customer-info .count-outer .count-box {
font-size: 30px;
}
}
.hero-4 .image-box .customer-info .title {
font-weight: 600;
color: var(--headings-color);
font-size: 36px;
line-height: 120%;
}
@media (max-width: 1699.98px) {
.hero-4 .image-box .customer-info .title {
font-size: 25px;
}
}
@media (max-width: 767.98px) {
.hero-4 .image-box .customer-info .title {
font-size: 22px;
}
}
.hero-4 .image-box .customer-info .text {
color: var(--theme-color-gray);
font-family: var(--heading-font-family);
font-size: var(--body-font-size);
font-weight: var(--body-font-weight);
line-height: 1.8125;
}
.hero-5 {
position: relative;
z-index: 9999;
margin-bottom: 0;
}
.hero-5::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
background: linear-gradient(103deg, rgba(6, 41, 40, 0.9) 38.63%, rgba(11, 49, 48, 0) 96.73%);
z-index: -1;
}
[data-tm-layout=dark] .hero-5::before {
background: linear-gradient(99.16deg, rgba(6, 41, 40, 0.72) 4.26%, rgba(11, 49, 48, 0) 96.92%);
}
.hero-5 .banner-outer .hero-content {
position: relative;
padding: 300px 110px 90px;
}
@media (max-width: 991.98px) {
.hero-5 .banner-outer .hero-content {
padding: 200px 50px 100px;
}
}
@media (max-width: 575.98px) {
.hero-5 .banner-outer .hero-content {
padding: 190px 30px 50px;
}
.hero-5 .banner-outer .hero-content .banner-title{width: 100%}
}
.hero-5 .banner-outer .hero-content .star {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 3px;
margin-bottom: 30px;
}
@media (max-width: 575.98px) {
.hero-5 .banner-outer .hero-content .star {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.hero-5 .banner-outer .hero-content .star .icon {
color: var(--theme-color1);
}
.hero-5 .banner-outer .hero-content .star .star-title {
font-size: 14px;
line-height: 20px;
font-weight: 400;
letter-spacing: 2px;
margin-left: 20px;
font-family: var(--heading-font-family);
text-transform: uppercase;
margin-bottom: 0;
color: var(--theme-color-white);
}
@media (max-width: 575.98px) {
.hero-5 .banner-outer .hero-content .star .star-title {
margin-left: 0;
}
}
[data-tm-layout=dark] .hero-5 .banner-outer .hero-content .star .star-title {
color: var(--headings-color);
}
.hero-5 .banner-outer .hero-content .banner-title {
font-size: 90px;
line-height: 110px;
font-weight: 600;
margin-bottom: 0;
color: var(--theme-color-white);
width: 800px;
font-size: clamp(36px, 4.7vw, 90px);
line-height: 1.2;
}
.hero-5 .banner-outer .hero-content .banner-desc{ margin-top: 20px;
font-size: 18px;
line-height: 20px;
color: #fff;}
[data-tm-layout=dark] .hero-5 .banner-outer .hero-content .banner-title {
color: var(--headings-color);
}
.hero-5 .banner-outer .hero-content .hero-button {
margin-top: 30px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 25px;
}
.hero-5 .banner-outer .hero-content .hero-button .video-btn {
position: relative;
width: 70px;
height: 70px;
line-height: 70px;
font-size: 12px;
font-weight: 900;
text-align: center;
border-radius: 50%;
display: inline-block;
color: var(--theme-color-white);
border: 1px solid var(--theme-color-white);
}
[data-tm-layout=dark] .hero-5 .banner-outer .hero-content .hero-button .video-btn {
color: #ffffff;
border-color: #ffffff;
}
.hero-5 .banner-outer .hero-content .hero-button .btn-title {
color: var(--theme-color-white);
margin-bottom: 0px;
}
[data-tm-layout=dark] .hero-5 .banner-outer .hero-content .hero-button .btn-title {
color: var(--headings-color);
}
.hero-5 .banner-outer .hero-box-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
gap: 30px;
border-top: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 991.98px) {
.hero-5 .banner-outer .hero-box-items {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
gap: 0;
}
}
.hero-5 .banner-outer .hero-box-items .content-box {
max-width: 33%;
width: 100%;
padding: 30px 0;
border-right: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 991.98px) {
.hero-5 .banner-outer .hero-box-items .content-box {
max-width: 100%;
border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
}
.hero-5 .banner-outer .hero-box-items .content-box:last-child {
border-right: none;
}
@media (max-width: 991.98px) {
.hero-5 .banner-outer .hero-box-items .content-box:last-child {
max-width: 100%;
border-bottom: none;
}
}
.hero-5 .banner-outer .hero-box-items .content-box p {
font-weight: 300;
font-size: 16px;
line-height: 30px;
text-align: center;
color: var(--theme-color-white);
margin-bottom: 0;
}
[data-tm-layout=dark] .hero-5 .banner-outer .hero-box-items .content-box p {
color: var(--headings-color);
}
.hero-6 {
position: relative;
overflow: hidden;
padding: 0 50px;
padding-top: 150px;
}
@media (max-width: 991.98px) {
.hero-6 {
padding: 180px 30px 100px;
}
}
@media (max-width: 575.98px) {
.hero-6 {
padding: 150px 0px 80px;
}
}
.hero-6 .bg-layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
pointer-events: none;
background: #144443;
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 51% 100%, 42% 90%, 0 90%);
}
@media (max-width: 1199.98px) {
.hero-6 .bg-layer {
clip-path: none;
}
}
.hero-6 .bg-layer .shape-1 {
position: absolute;
top: 68%;
left: 0;
}
.hero-6 .bg-layer .shape-2 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.hero-6 .paper-shape {
position: absolute;
bottom: 48%;
right: 0px;
pointer-events: none;
-webkit-animation: rounded 5s linear infinite;
animation: rounded 5s linear infinite;
}
@media (max-width: 1399.98px) {
.hero-6 .paper-shape {
display: none;
}
}
.hero-6 .shape-image1 {
position: absolute;
bottom: 35%;
right: 54px;
pointer-events: none;
}
@media (max-width: 1199.98px) {
.hero-6 .shape-image1 {
display: none;
}
}
.hero-6 .banner-content {
position: relative;
z-index: 9;
height: 100%;
padding-top: 95px;
}
@media (max-width: 991.98px) {
.hero-6 .banner-content {
padding-top: 0;
}
}
.hero-6 .banner-content h1 {
font-size: 76px;
font-weight: 600;
line-height: 85px;
color: var(--theme-color-white);
font-size: clamp(36px, 3.95vw, 76px);
line-height: 1.2;
}
[data-tm-layout=dark] .hero-6 .banner-content h1 {
color: #ffffff;
}
.hero-6 .banner-content .text-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 25px;
margin-top: 15px;
}
@media (max-width: 1199.98px) {
.hero-6 .banner-content .text-item {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.hero-6 .banner-content .text-item p {
font-weight: 400;
font-size: 16px;
line-height: 35px;
text-transform: capitalize;
color: var(--theme-color-white);
max-width: 650px;
}
[data-tm-layout=dark] .hero-6 .banner-content .text-item p {
color: #ffffff;
}
.hero-6 .banner-content .hero-button {
margin-top: 30px;
}
@media (max-width: 767.98px) {
.hero-6 .banner-content .hero-button {
margin-top: 30px;
}
}
.hero-6 .banner-content .hero-button .btn-style-three:hover .icon {
color: var(--theme-color-white);
}
.hero-6 .banner-content .banner-user {
position: absolute;
bottom: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
padding-top: 30px;
padding-right: 20px;
-webkit-transition: all 1000ms ease;
transition: all 1000ms ease;
}
@media (max-width: 1199.98px) {
.hero-6 .banner-content .banner-user {
display: none;
}
}
.hero-6 .banner-content .banner-user ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.hero-6 .banner-content .banner-user ul li {
width: 66px;
height: 66px;
text-align: center;
border-radius: 50%;
line-height: 60px;
margin-left: -15px;
color: var(--theme-color-black);
background-color: var(--theme-color1);
border: 2px solid var(--theme-color-white);
}
.hero-6 .banner-content .banner-user ul li:first-child {
margin-left: 0;
}
.hero-6 .banner-content .banner-user .user-title {
font-size: 18px;
line-height: 22px;
font-weight: 500;
max-width: 188px;
color: var(--headings-color);
margin-bottom: 0;
}
.hero-6 .banner-content .banner-user .user-title span {
font-weight: 700;
}
.hero-6 .banner-image {
position: relative;
z-index: 1;
margin-right: -140px;
}
@media (max-width: 1199.98px) {
.hero-6 .banner-image {
margin-right: 0;
}
}
@media (max-width: 991.98px) {
.hero-6 .banner-image {
display: none;
}
}
.hero-6 .banner-image .circle-shape {
position: absolute;
top: 12%;
right: -120px;
left: -70px;
z-index: -1;
border-radius: 50%;
pointer-events: none;
}
@media (max-width: 575.98px) {
.hero-6 .banner-image .circle-shape {
display: none;
}
}
.hero-6 .banner-image .circle-shape .circle-light {
position: absolute;
left: 15%;
top: 10%;
width: 490px;
height: 490px;
}
.hero-6 .banner-image .circle-shape .circle-light:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
z-index: -2;
inset: 0;
border-radius: 50%;
background-color: rgba(200, 241, 105, 0.2);
-webkit-filter: blur(120px);
filter: blur(120px);
}
.hero-6 .banner-image .icon-box {
font-size: 50px;
}
.hero-6 .banner-image .banner-quote {
position: absolute;
bottom: 108px;
left: -30%;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
padding: 25px;
max-width: 335px;
border-radius: 10px;
background-color: var(--theme-color-white);
}
[data-tm-layout=dark] .hero-6 .banner-image .banner-quote {
background-color: var(--theme-color1);
}
@media (max-width: 1199.98px) {
.hero-6 .banner-image .banner-quote {
bottom: 170px;
left: 0;
}
}
@media (max-width: 991.98px) {
.hero-6 .banner-image .banner-quote {
display: none;
}
}
.hero-6 .banner-image .banner-quote .content-box .content-title {
font-size: 18px;
font-weight: 600;
line-height: 28px;
letter-spacing: -3%;
color: var(--headings-color);
margin-bottom: 10px;
}
[data-tm-layout=dark] .hero-6 .banner-image .banner-quote .content-box .content-title {
color: var(--theme-color-white);
}
.hero-6 .banner-image .banner-quote .content-box .content-text {
font-size: 13px;
line-height: 20px;
font-weight: 400;
color: var(--text-color);
}
[data-tm-layout=dark] .hero-6 .banner-image .banner-quote .content-box .content-text {
color: #4B535D;
}
.hero-7 {
position: relative;
overflow: hidden;
margin: 0 30px;
padding: 70px 60px;
border-radius: 30px;
}
@media (max-width: 767.98px) {
.hero-7 {
margin: 0;
padding: 70px 30px;
}
}
@media (max-width: 575.98px) {
.hero-7 {
padding: 70px 15px;
}
}
.hero-7 .container-fluid {
padding-top: 0;
padding-bottom: 0;
}
.hero-7 .bg-layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.hero-7 .banner-shape {
position: absolute;
right: 70px;
bottom: 70px;
border-radius: 10px;
overflow: hidden;
}
@media (max-width: 1199.98px) {
.hero-7 .banner-shape {
display: none;
}
}
.hero-7 .banner-content {
position: relative;
z-index: 9;
height: 100%;
border-radius: 30px;
padding: 145px 80px 145px;
max-width: 785px;
width: 100%;
overflow: hidden;
background-color: var(--theme-color-white);
}
@media (max-width: 1399.98px) {
.hero-7 .banner-content {
padding: 100px 50px;
max-width: 700px;
}
}
@media (max-width: 767.98px) {
.hero-7 .banner-content {
padding: 80px 30px;
}
}
@media (max-width: 575.98px) {
.hero-7 .banner-content {
padding: 80px 15px;
}
}
.hero-7 .banner-content .anim-icons {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
.hero-7 .banner-content .anim-icons .shape-image-1 {
position: absolute;
top: 0;
left: 0;
opacity: 0.6;
}
.hero-7 .banner-content .anim-icons .shape-image-2 {
position: absolute;
bottom: 0;
right: 0;
opacity: 0.2;
}
.hero-7 .banner-content .banner-know-box {
padding: 7px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
border-radius: 100px;
padding-right: 35px;
margin-bottom: 20px;
border: 1px solid #CBCBCB;
}
@media (max-width: 575.98px) {
.hero-7 .banner-content .banner-know-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
border: none;
padding: 0;
}
}
.hero-7 .banner-content .banner-know-box .icon {
width: 46px;
height: 46px;
line-height: 46px;
border-radius: 50%;
text-align: center;
color: var(--theme-color-white);
background: linear-gradient(138.29deg, #C8F169 5.12%, #039397 100%);
}
.hero-7 .banner-content .banner-know-box .text {
font-family: var(--heading-font-family);
font-weight: 600;
font-size: 16px;
line-height: 30px;
color: var(--headings-color);
}
.hero-7 .banner-content .title {
font-weight: 700;
font-size: 80px;
line-height: 90px;
color: var(--headings-color);
text-transform: capitalize;
margin-bottom: 25px;
font-size: clamp(36px, 4.15vw, 80px);
line-height: 1.2;
}
.hero-7 .banner-content .banner-text {
font-weight: 400;
font-size: 16px;
line-height: 35px;
text-transform: capitalize;
color: var(--text-color);
margin-bottom: 30px;
}
.hero-7 .banner-content .hero-button {
margin-top: 30px;
}
.hero-7 .banner-content .hero-button .btn-style-two {
padding: 25px 60px;
padding-right: 90px;
}
.hero-7 .banner-content .hero-button .btn-style-two:hover .icon {
background-color: var(--headings-color);
}
.hero-7 .banner-content .hero-button .btn-style-two .icon {
width: 62px;
height: 62px;
line-height: 62px;
background-color: var(--theme-color1);
}
/***
====================================================================
Features Section
====================================================================
***/
.feature-left-content-1 {
padding: 40px 60px;
height: 100%;
background-color: #E4F4F2;
position: relative;
z-index: 9;
}
[data-tm-layout=dark] .feature-left-content-1 {
background-color: var(--dark-color2);
}
.feature-left-content-1 .down-shape {
position: absolute;
top: 28px;
right: 14px;
z-index: -1;
}
.feature-left-content-1 .spiral-shape {
position: absolute;
left: 37px;
bottom: 75px;
z-index: -1;
}
@media (max-width: 1199.98px) {
.feature-left-content-1 {
padding: 40px 30px;
}
}
.feature-left-content-1 h2 {
font-size: 40px;
font-weight: 600;
}
@media (max-width: 1199.98px) {
.feature-left-content-1 h2 {
font-size: 30px;
}
}
.feature-left-content-1 .client-image {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 25px;
margin-bottom: 20px;
}
.feature-left-content-1 .client-image img {
border-radius: 50%;
border: 1px solid #fff;
}
.feature-left-content-1 .client-image .icon-2 {
margin-left: -15px;
}
.feature-left-content-1 .client-image .icon-3 {
margin-left: -15px;
}
.feature-left-content-1 .client-image .icon-4 {
margin-left: -15px;
}
.feature-left-content-1 h4 {
font-size: 20px;
line-height: 1;
}
.feature-left-content-1 .star i {
color: #FFC65E;
}
.feature-left-content-1 .star span {
font-size: 14px;
font-weight: bold;
color: #0B3130;
}
.feature-business-solution-items-1 {
background: #144443;
}
.feature-business-solution-items-1 .business-image {
position: relative;
z-index: 2;
overflow: hidden;
width: 100%;
}
.feature-business-solution-items-1 .business-image img {
width: 100%;
height: 100%;
display: block;
}
.feature-business-solution-items-1 .business-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.feature-business-solution-items-1 .business-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.feature-business-solution-items-1 .business-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper .business-layer-image {
width: 25%;
height: 100%;
-webkit-transition: 0.5s;
transition: 0.5s;
background-size: cover;
position: relative;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper .business-layer-image:nth-child(1) {
background-position: 0;
-webkit-transition-delay: 0;
transition-delay: 0;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper .business-layer-image:nth-child(2) {
background-position: 33.33%;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper .business-layer-image:nth-child(3) {
background-position: 66.66%;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.feature-business-solution-items-1 .business-image .business-layer-wrapper .business-layer-image:nth-child(4) {
background-position: 100%;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.feature-business-solution-items-1 .content {
margin-top: -40px;
padding: 40px 60px;
padding-top: 0;
position: relative;
z-index: 9;
}
@media (max-width: 1199.98px) {
.feature-business-solution-items-1 .content {
margin-top: -40px;
padding: 40px 35px;
padding-top: 0;
}
}
.feature-business-solution-items-1 .content .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
font-size: 35px;
height: 70px;
line-height: 65px;
margin-bottom: 25px;
overflow: hidden;
position: relative;
text-align: center;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
width: 70px;
z-index: 0;
}
.feature-business-solution-items-1 .content .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.feature-business-solution-items-1 .content h3 {
color: #ffffff;
}
.feature-business-solution-items-1 .content p {
font-size: 18px;
color: #ffffff;
}
.feature-business-solution-items-1:hover .business-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.feature-business-solution-items-1:hover .business-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.feature-business-solution-items-1:hover .content .icon {
background-position: 100% 0;
}
.feature-business-solution-items-1:hover .content .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
[data-tm-layout=dark] .business-solution-section {
margin-top: 10px;
background-color: var(--dark-color1);
}
.feature-business-solution-items-2 {
background: #144443;
}
.feature-business-solution-items-2 .business-image {
position: relative;
z-index: 2;
overflow: hidden;
width: 100%;
}
.feature-business-solution-items-2 .business-image img {
width: 100%;
height: 100%;
display: block;
}
.feature-business-solution-items-2 .business-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.feature-business-solution-items-2 .business-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.feature-business-solution-items-2 .business-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper .business-layer-image {
width: 25%;
height: 100%;
-webkit-transition: 0.5s;
transition: 0.5s;
background-size: cover;
position: relative;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper .business-layer-image:nth-child(1) {
background-position: 0;
-webkit-transition-delay: 0;
transition-delay: 0;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper .business-layer-image:nth-child(2) {
background-position: 33.33%;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper .business-layer-image:nth-child(3) {
background-position: 66.66%;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.feature-business-solution-items-2 .business-image .business-layer-wrapper .business-layer-image:nth-child(4) {
background-position: 100%;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.feature-business-solution-items-2 .content {
padding: 40px 60px;
padding-bottom: 0;
position: relative;
z-index: 9;
margin-top: 0;
padding-bottom: 0;
padding-top: 40px;
}
@media (max-width: 1199.98px) {
.feature-business-solution-items-2 .content {
margin-top: 0;
padding: 40px 35px;
padding-bottom: 0;
}
}
.feature-business-solution-items-2 .content .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
height: 70px;
line-height: 65px;
margin-bottom: -35px;
margin-top: 20px;
font-size: 34px;
text-align: center;
width: 70px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.feature-business-solution-items-2 .content .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.feature-business-solution-items-2 .content h3 {
color: #ffffff;
}
.feature-business-solution-items-2 .content p {
font-size: 18px;
color: #ffffff;
}
.feature-business-solution-items-2:hover .business-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.feature-business-solution-items-2:hover .business-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.feature-business-solution-items-2:hover .content .icon {
background-position: 100% 0;
}
.feature-business-solution-items-2:hover .content .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.counter-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media (max-width: 1199.98px) {
.counter-wrapper {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
}
.counter-box-1 {
width: 312px;
height: 312px;
border-radius: 320px;
border: 1px solid #D2D2D2;
text-align: center;
padding-top: 70px;
}
[data-tm-layout=dark] .counter-box-1 {
border: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1399.98px) {
.counter-box-1 {
width: 275px;
height: 275px;
padding-top: 60px;
}
}
@media (max-width: 991.98px) {
.counter-box-1 {
width: 215px;
height: 215px;
padding-top: 40px;
}
}
@media (max-width: 767.98px) {
.counter-box-1 {
width: 250px;
height: 250px;
padding-top: 45px;
margin: 0 auto;
}
}
@media (max-width: 575.98px) {
.counter-box-1 {
width: 230px;
height: 230px;
padding-top: 45px;
}
}
.counter-box-1 h2 {
font-size: 96px;
font-weight: 400;
margin-bottom: 0;
}
@media (max-width: 1399.98px) {
.counter-box-1 h2 {
font-size: 80px;
}
}
@media (max-width: 991.98px) {
.counter-box-1 h2 {
font-size: 60px;
}
}
@media (max-width: 767.98px) {
.counter-box-1 h2 {
font-size: 75px;
}
}
@media (max-width: 575.98px) {
.counter-box-1 h2 {
font-size: 60px;
}
}
.counter-box-1 p {
font-size: 18px;
font-weight: 500;
max-width: 140px;
line-height: 133%;
margin: 0 auto;
color: #144443;
}
[data-tm-layout=dark] .counter-box-1 p {
color: rgba(204, 204, 204, 0.8);
}
.cta-contact-wrapper {
border-radius: 20px;
padding: 40px 100px;
padding-left: 400px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: relative;
overflow: hidden;
z-index: 9;
}
.cta-contact-wrapper::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
background: #144443;
z-index: -1;
opacity: 0.9;
}
@media (max-width: 1199.98px) {
.cta-contact-wrapper {
padding-left: 100px;
}
}
@media (max-width: 991.98px) {
.cta-contact-wrapper {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 15px;
text-align: center;
text-align: center;
}
}
@media (max-width: 575.98px) {
.cta-contact-wrapper {
padding: 40px;
}
}
.cta-contact-wrapper .btn-style-one {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
}
.cta-contact-wrapper .btn-style-one:before {
display: none;
}
.cta-contact-wrapper .btn-style-one:hover {
background-position: 100% 0;
}
.cta-contact-wrapper .left-shape {
position: absolute;
left: 100px;
top: 0;
}
@media (max-width: 1199.98px) {
.cta-contact-wrapper .left-shape {
display: none;
}
}
.cta-contact-section {
position: relative;
z-index: 9;
}
.cta-contact-section::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
z-index: -1;
background-color: #F5F5F5;
height: 50%;
}
[data-tm-layout=dark] .cta-contact-section::before {
background-color: var(--dark-color2);
}
.benifit-wrapper {
}
[data-tm-layout=dark] .benifit-wrapper {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.benifit-box-items-style-1 {
margin-top: 30px;
}
.benifit-box-items-style-1 .benifit-image {
position: relative;
overflow: hidden;
border-radius: 5px;
}
.benifit-box-items-style-1 .benifit-image img {
width: 100%;
height: 100%;
border-radius: 5px;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.benifit-box-items-style-1 .benifit-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.benifit-box-items-style-1 .benifit-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.benifit-box-items-style-1 .benifit-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image {
width: 25%;
height: 100%;
-webkit-transition: 0.5s;
transition: 0.5s;
background-size: cover;
border-radius: 5px;
position: relative;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(1) {
background-position: 0;
-webkit-transition-delay: 0;
transition-delay: 0;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(2) {
background-position: 33.33%;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
border-radius: 0 !important;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(2)::before {
border-radius: 0 !important;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(3) {
background-position: 66.66%;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
border-radius: 0 !important;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(3)::before {
border-radius: 0 !important;
}
.benifit-box-items-style-1 .benifit-image .benifit-layer-wrapper .benifit-layer-image:nth-child(4) {
background-position: 100%;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.benifit-box-items-style-1 .benefit-content {
margin-top: 25px;
}
.benifit-box-items-style-1 .benefit-content h3 {
margin-bottom: 5px;
}
.benifit-box-items-style-1 .benefit-content .arrow-icon {
margin-top: 20px;
display: inline-block;
font-size: 30px;
color: var(--headings-color);
-webkit-transform: rotate(-47deg);
transform: rotate(-47deg);
}
.benifit-box-items-style-1 .benefit-content .arrow-icon svg {
-webkit-transform: rotate(-47deg);
transform: rotate(-47deg);
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
[data-tm-layout=dark] .benifit-box-items-style-1 .benefit-content .arrow-icon svg path {
fill: var(--link-color);
}
.benifit-box-items-style-1 .benefit-content .arrow-icon:hover {
-webkit-transform: rotate(0);
transform: rotate(0);
}
.benifit-box-items-style-1:hover .benifit-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.benifit-box-items-style-1:hover .benifit-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.benifit-box-items-style-2 {
margin-top: 30px;
position: relative;
z-index: 9;
border-radius: 10px;
padding: 20px 30px;
height: 350px;
}
@media (max-width: 1199.98px) {
.benifit-box-items-style-2 {
padding: 10px;
height: auto;
}
}
.benifit-box-items-style-2::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 10px;
background: #efefef;
z-index: -1;
}
.benifit-box-items-style-2 .nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 10px;
background: var(--theme-color-white);
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 8px 10px;
}
[data-tm-layout=dark] .benifit-box-items-style-2 .nav {
background-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 767.98px) {
.benifit-box-items-style-2 .nav {
border-radius: 20px;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
}
.benifit-box-items-style-2 .nav .nav-item .nav-link {
padding: 21px 40px;
font-size: 16px;
font-weight: 500;
color: var(--headings-color);
border-radius: 10px;
line-height: 1;
}
@media (max-width: 1399.98px) {
.benifit-box-items-style-2 .nav .nav-item .nav-link {
font-size: 14px;
padding: 15px 8px;
}
}
.benifit-box-items-style-2 .nav .nav-item .nav-link.active {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.benifit-box-items-style-2 .nav .nav-item .nav-link.active:hover {
background-position: 100% 0;
}
.benifit-box-items-style-2 .tab-content {
padding: 30px 0;
}
@media (max-width: 1399.98px) {
.benifit-box-items-style-2 .tab-content {
padding: 20px 10px;
}
}
.benifit-box-items-style-2 .why-choose-list {
}
.benifit-box-items-style-2 .why-choose-list h3 {
font-size: 26px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .benifit-box-items-style-2 .why-choose-list h3 {
color: var(--headings-color);
}
.benifit-box-items-style-2 .why-choose-list p {
font-size: 24px;
line-height: 45px;
text-align: justify;
color: #000;
}
[data-tm-layout=dark] .benifit-box-items-style-2 .why-choose-list p {
color: rgba(204, 204, 204, 0.8);
}
.benifit-box-items-style-2 .about-list {
margin-top: 20px;
}
.benifit-box-items-style-2 .about-list li {
font-size: 18px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .benifit-box-items-style-2 .about-list li {
color: #ffffff;
}
.benifit-box-items-style-2 .about-list li:not(:last-child) {
margin-bottom: 13px;
}
.benifit-box-items-style-2 .about-list li .icon {
position: relative;
color: var(--headings-color);
font-size: 14px;
}
.benifit-box-items-style-2 .about-list li .icon img {
position: relative;
z-index: 9;
}
.benifit-box-items-style-2 .about-list li .icon::before {
position: absolute;
top: 2px;
right: -4px;
content: "";
background-color: var(--theme-color1);
width: 24px;
height: 24px;
border-radius: 50%;
z-index: -1;
}
.lets-talk-banner-wrapper {
position: relative;
}
.lets-talk-banner-wrapper .lets-talk-banner-content h2 {
font-size: 100px;
font-weight: 700;
color: var(--theme-color-white);
line-height: 110%;
margin-bottom: 20px;
}
[data-tm-layout=dark] .lets-talk-banner-wrapper .lets-talk-banner-content h2 {
color: var(--headings-color);
}
@media (max-width: 1199.98px) {
.lets-talk-banner-wrapper .lets-talk-banner-content h2 {
font-size: 80px;
}
}
@media (max-width: 767.98px) {
.lets-talk-banner-wrapper .lets-talk-banner-content h2 {
font-size: 65px;
}
}
@media (max-width: 575.98px) {
.lets-talk-banner-wrapper .lets-talk-banner-content h2 {
font-size: 45px;
}
}
.lets-talk-banner-wrapper .lets-talk-banner-content p {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
color: var(--theme-color-white);
padding-bottom: 70px;
margin-bottom: 45px;
max-width: 745px;
}
[data-tm-layout=dark] .lets-talk-banner-wrapper .lets-talk-banner-content p {
color: #ffffff;
}
@media (max-width: 767.98px) {
.lets-talk-banner-wrapper .lets-talk-banner-content p {
padding-bottom: 30px;
}
}
.lets-talk-banner-wrapper .lets-talk-banner-content .count-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 80px;
}
@media (max-width: 1199.98px) {
.lets-talk-banner-wrapper .lets-talk-banner-content .count-item {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 40px;
}
}
.lets-talk-banner-wrapper .lets-talk-banner-content .count-item .count-box h2 {
font-weight: 500;
font-size: 64px;
color: var(--theme-color-white);
line-height: 53%;
margin-bottom: 20px;
}
[data-tm-layout=dark] .lets-talk-banner-wrapper .lets-talk-banner-content .count-item .count-box h2 {
color: #ffffff;
}
.lets-talk-banner-wrapper .lets-talk-banner-content .count-item .count-box span {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .lets-talk-banner-wrapper .lets-talk-banner-content .count-item .count-box span {
color: #ffffff;
}
.lets-talk-banner-wrapper .circle-box {
width: 160px;
min-width: 160px;
height: 160px;
text-align: center;
border-radius: 50%;
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-webkit-box-pack: center !important;
-ms-flex-pack: center !important;
justify-content: center !important;
-webkit-box-align: center !important;
-ms-flex-align: center !important;
align-items: center !important;
background-color: var(--theme-color1);
font-size: 14px;
font-weight: 500;
letter-spacing: 1.4px;
color: var(--headings-color);
position: relative;
}
.lets-talk-banner-wrapper .circle-box span {
position: relative;
z-index: 9;
max-width: 70px;
display: inline-block;
color: var(--theme-color2);
font-weight: 500;
}
.lets-talk-banner-wrapper .circle-box span i {
font-size: 40px;
color: var(--headings-color);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
display: inline-block;
margin-top: 5px;
}
.lets-talk-banner-wrapper .circle-box svg {
margin-top: 10px;
text-align: center;
}
.lets-talk-banner-wrapper .circle-box::before {
position: absolute;
width: 10px;
height: 10px;
border-radius: 50%;
content: "";
background: rgba(20, 68, 67, 0.9);
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: all 0.5s;
transition: all 0.5s;
z-index: 0;
opacity: 0;
}
.lets-talk-banner-wrapper .circle-box::after {
position: absolute;
width: 50px;
height: 50px;
border-radius: 50%;
content: "";
background: var(--theme-color1);
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: all 1.8s;
transition: all 1.8s;
z-index: 0;
opacity: 0;
}
.lets-talk-banner-wrapper .circle-box:hover::before {
width: 100%;
height: 100%;
opacity: 1;
}
.lets-talk-banner-wrapper .circle-box:hover::after {
width: 100%;
height: 100%;
opacity: 1;
}
.lets-talk-banner-wrapper .circle-box:hover span {
color: var(--headings-color);
}
.lets-talk-banner-section {
position: relative;
margin: 0 30px;
border-radius: 50px;
}
@media (max-width: 1399.98px) {
.lets-talk-banner-section {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.lets-talk-banner-section {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.lets-talk-banner-section::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
background: -webkit-gradient(linear, left bottom, left top, from(rgba(34, 34, 34, 0.8)), to(rgba(34, 34, 34, 0.8)));
background: linear-gradient(0deg, rgba(34, 34, 34, 0.8) 0%, rgba(34, 34, 34, 0.8) 100%);
}
.lets-talk-banner-section .blur-shape-1 {
position: absolute;
left: 0;
bottom: 0;
}
.lets-talk-banner-section .blur-shape-2 {
position: absolute;
right: 0;
bottom: 0;
}
.benifit-section {
padding: 80px 0;
position: relative;
}
.benifit-section .circle-shape {
position: absolute;
right: 0;
top: 10%;
}
@media (max-width: 1399.98px) {
.benifit-section .circle-shape {
display: none;
}
}
.benefit-feature-wrapper {
padding-top: 100px;
}
@media (max-width: 1199.98px) {
.benefit-feature-wrapper {
padding-top: 70px;
}
}
.icon-items-style-2 .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
height: 65px;
line-height: 65px;
text-align: center;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
width: 65px;
font-size: 30px;
color: var(--theme-color-white);
}
.icon-items-style-2 .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.icon-items-style-2 .content {
margin-top: 20px;
}
.icon-items-style-2 .content p {
font-size: 18px;
}
.icon-items-style-2:hover .icon {
background-position: 100% 0;
}
.icon-items-style-2:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.feature-section-3 {
margin: 30px 30px 0;
}
.feature-box-3 {
background-color: var(--theme-color-white);
border-radius: 30px;
padding: 45px 50px;
position: relative;
z-index: 9;
overflow: hidden;
}
.feature-box-3 .arrow-shape {
position: absolute;
right: 30px;
bottom: -40px;
z-index: -1;
}
.feature-box-3 .client-image {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 30px;
}
.feature-box-3 .client-image img {
border-radius: 50%;
border: 1px solid #fff;
}
.feature-box-3 .client-image .icon-2 {
margin-left: -15px;
}
.feature-box-3 .client-image .icon-3 {
margin-left: -15px;
}
.feature-box-3 .client-image .icon-4 {
margin-left: -15px;
}
.feature-box-3 span {
font-size: 48px;
color: var(--headings-color);
display: inline-block;
}
@media (max-width: 469.98px) {
.feature-box-3 span {
font-size: 34px;
line-height: 1;
}
}
.feature-box-3 span b {
font-weight: 600;
color: var(--headings-color);
}
.feature-box-3 .theme-btn {
position: relative;
margin-top: 15px;
}
@media (max-width: 767.98px) {
.feature-box-3 .theme-btn {
margin-top: 30px;
}
}
.feature-box-3 .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
@media only screen and (max-width: 767px) {
.feature-box-3 .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.feature-box-3 .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.feature-box-3 .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
.feature-box-3 .theme-btn.btn-style-one:before {
display: none;
}
@media (max-width: 575.98px) {
.feature-box-3 .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
@media (max-width: 469.98px) {
.feature-box-3 .theme-btn.btn-style-one {
padding: 22px 34px;
padding-right: 70px;
}
}
.feature-box-3 .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.feature-box-3 .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .feature-box-3 .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.feature-box-3 .theme-btn .icon {
background-color: var(--theme-color-white);
border-radius: 50%;
bottom: 4px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
width: 62px;
}
.feature-service-card-items {
border-radius: 30px;
background: #103C3B;
padding: 50px 60px;
padding-bottom: 30px;
}
@media (max-width: 1699.98px) {
.feature-service-card-items {
padding: 35px;
}
}
@media (max-width: 575.98px) {
.feature-service-card-items {
padding: 30px;
}
}
@media (max-width: 469.98px) {
.feature-service-card-items {
padding: 25px;
}
}
.feature-service-card-items .icon {
width: 68px;
height: 68px;
line-height: 68px;
text-align: center;
border-radius: 50%;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
font-size: 30px;
color: var(--theme-color-white);
}
.feature-service-card-items .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.feature-service-card-items .content {
margin-top: 25px;
}
.feature-service-card-items .content h3 a {
color: var(--theme-color-white);
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
[data-tm-layout=dark] .feature-service-card-items .content h3 a {
color: var(--headings-color);
}
.feature-service-card-items .content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff));
background-image: linear-gradient(180deg, #fff 0%, #fff 100%);
}
.feature-service-card-items .content p {
color: rgba(255, 255, 255, 0.7);
margin-top: 20px;
}
.feature-service-card-items .content .text-btn {
color: var(--theme-color-white);
font-size: 16px;
text-decoration: underline;
display: inline-block;
margin-top: 20px;
}
[data-tm-layout=dark] .feature-service-card-items .content .text-btn {
color: var(--headings-color);
}
.feature-service-card-items:hover .icon {
background-position: 100% 0;
}
.feature-service-card-items:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.feature-block-one {
margin-bottom: 30px;
}
.feature-block-one.active .inner-box::before, .feature-block-one:hover .inner-box::before {
width: 100%;
}
.feature-block-one.active .inner-box .feature-icon .svg-icon, .feature-block-one:hover .inner-box .feature-icon .svg-icon {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
color: #ffffff;
}
[data-tm-layout=dark] .feature-block-one.active .inner-box .feature-icon .svg-icon, [data-tm-layout=dark] .feature-block-one:hover .inner-box .feature-icon .svg-icon {
color: #ffffff;
}
.feature-block-one.active .inner-box .content-box .feature-title a, .feature-block-one:hover .inner-box .content-box .feature-title a {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .feature-block-one.active .inner-box .content-box .feature-title a, [data-tm-layout=dark] .feature-block-one:hover .inner-box .content-box .feature-title a {
color: var(--headings-color);
}
.feature-block-one.active .inner-box .content-box .feature-text, .feature-block-one:hover .inner-box .content-box .feature-text {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .feature-block-one.active .inner-box .content-box .feature-text, [data-tm-layout=dark] .feature-block-one:hover .inner-box .content-box .feature-text {
color: var(--headings-color);
}
.feature-block-one .inner-box {
position: relative;
padding: 40px;
z-index: 1;
border: 1px solid #DDDDDD;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
[data-tm-layout=dark] .feature-block-one .inner-box {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.feature-block-one .inner-box::before {
position: absolute;
top: 0;
left: 0;
width: 0px;
height: 100%;
content: "";
z-index: -1;
background-color: var(--bg-theme-color2);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.feature-block-one .inner-box .feature-icon {
margin-bottom: 34px;
}
.feature-block-one .inner-box .feature-icon .svg-icon {
color: var(--theme-color8);
font-size: 65px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.feature-block-one .inner-box .content-box .feature-title {
font-size: 24px;
line-height: 30px;
font-weight: 700;
margin-bottom: 10px;
text-transform: capitalize;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.feature-block-one .inner-box .content-box .feature-text {
line-height: 35px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.hzAccordion-area {
overflow: hidden;
background-color: var(--theme-color2);
}
.hzAccordion-area .outer-box {
padding: 0px 50px;
}
@media (max-width: 575.98px) {
.hzAccordion-area .outer-box {
padding: 0px;
}
}
.hzAccordion__wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
height: 700px;
overflow: hidden;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media (max-width: 1399.98px) {
.hzAccordion__wrp {
height: 450px;
}
}
@media (max-width: 991.98px) {
.hzAccordion__wrp {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: auto;
}
}
.hzAccordion__item {
-webkit-box-flex: 0.7;
-ms-flex: 0.7;
flex: 0.7;
min-width: 190px;
-webkit-transition: 0.7s;
transition: 0.7s;
overflow: hidden;
cursor: pointer;
position: relative;
z-index: 1;
}
.hzAccordion__item:last-child .content .wrp {
padding-right: 0;
}
.hzAccordion__item .head .head-title {
margin: 0;
padding-left: 25px;
text-align: center;
position: absolute;
bottom: 0;
left: 0;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
height: 100%;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
border-left: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.hzAccordion__item .head .head-title .title {
display: block;
max-height: 410px;
text-align: left;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .hzAccordion__item .head .head-title .title {
color: #ffffff;
}
.hzAccordion__item .head .head-title .number {
font-size: 150px;
line-height: 150px;
font-weight: 500;
color: transparent;
-webkit-text-stroke: 1px var(--theme-color-white);
-webkit-transition: 0.7s;
transition: 0.7s;
}
[data-tm-layout=dark] .hzAccordion__item .head .head-title .number {
-webkit-text-stroke: 1px #ffffff;
}
.hzAccordion__item .head .head-title:hover .number {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .hzAccordion__item .head .head-title:hover .number {
color: #ffffff;
}
.hzAccordion__item .content {
display: none;
height: 100%;
margin-left: 180px;
position: relative;
z-index: 1;
}
.hzAccordion__item .content .image {
height: 100%;
max-width: 450px;
}
.hzAccordion__item .content .image img {
height: 100%;
}
.hzAccordion__item .content .wrp {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 0 60px;
gap: 60px;
height: 100%;
}
.hzAccordion__item .content .content-wrp {
max-width: 330px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.hzAccordion__item .content .arry-btn {
font-size: 70px;
color: var(--theme-color-silver);
}
.hzAccordion__item .content .arry-btn i {
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.hzAccordion__item .content .arry-btn i:hover {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.hzAccordion__item .content .shape {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: -1;
}
.hzAccordion__item .content .text {
color: var(--theme-color-silver);
}
.hzAccordion__item.last-child .head .head-title {
padding-left: 0;
border: 1px solid transparent;
}
.hzAccordion__item.last-child.active .head .head-title {
padding-left: 25px;
border-left: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
.hzAccordion__item.active {
-webkit-box-flex: 4;
-ms-flex: 4;
flex: 4;
}
.hzAccordion__item.active .head .number {
-webkit-text-fill: var(--theme-color-white);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .hzAccordion__item.active .head .number {
-webkit-text-fill: #ffffff;
color: #ffffff;
}
.hzAccordion__item.active .content {
display: block;
}
@media (max-width: 1399.98px) {
.hzAccordion__item {
min-width: 75px;
}
.hzAccordion__item .head .head-title {
padding-left: 5px;
}
.hzAccordion__item .head .head-title .title {
font-size: 18px;
line-height: 30px;
max-height: 280px;
}
.hzAccordion__item .head .head-title .number {
font-size: 50px;
line-height: 50px;
}
.hzAccordion__item .content {
margin-left: 75px;
}
.hzAccordion__item .content .wrp {
padding: 0 20px;
gap: 10px;
}
.hzAccordion__item .content .arry-btn {
font-size: 40px;
}
}
@media (max-width: 991.98px) {
.hzAccordion__item .head .head-title {
position: unset;
-webkit-writing-mode: unset;
-ms-writing-mode: unset;
writing-mode: unset;
-webkit-transform: unset;
transform: unset;
border: none;
padding: 0;
border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
margin-bottom: 30px;
padding-bottom: 10px;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
gap: 10px;
}
.hzAccordion__item .head .head-title .number {
font-size: 30px;
line-height: 40px;
}
.hzAccordion__item .content {
margin-left: 0;
}
.hzAccordion__item .content .wrp {
padding: 20px 0px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.hzAccordion__item.active .head .head-title {
margin-bottom: 0px;
}
.hzAccordion__item.last-child .head .head-title {
margin-bottom: 0;
}
.hzAccordion__item.last-child.active .head .head-title {
padding-left: 0;
border-left: none;
}
}
/***
====================================================================
About Section
====================================================================
***/
.about-image-1 {
position: relative;
max-width: 602px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.about-image-1 img {
width: 100%;
height: 100%;
}
.about-content-1 .icon-items {
margin-top: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 17px;
}
@media (max-width: 1399.98px) {
.about-content-1 .icon-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.about-content-1 .icon-items .icon {
width: 90px;
height: 90px;
line-height: 90px;
text-align: center;
border-radius: 50%;
background-color: var(--theme-color2);
font-size: 36px;
}
.about-content-1 .icon-items .icon i {
background: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.about-content-1 .icon-items:hover .icon .animated-svg path {
-webkit-animation: draw2 3s forwards ease-in-out;
animation: draw2 3s forwards ease-in-out;
}
.about-content-1 .icon-items p {
font-size: 20px;
font-weight: 500;
line-height: 175%;
color: var(--theme-color2);
text-transform: capitalize;
text-decoration-line: underline;
max-width: 471px;
}
@media (max-width: 767.98px) {
.about-content-1 .icon-items p {
font-size: 18px;
}
}
@media (max-width: 575.98px) {
.about-content-1 .icon-items p {
font-size: 16px;
}
}
[data-tm-layout=dark] .about-content-1 .icon-items p {
color: #ffffff;
}
.about-content-1 .about-text {
font-size: 18px;
margin-top: 25px;
}
@media (max-width: 575.98px) {
.about-content-1 .about-text {
font-size: 16px;
margin-top: 20px;
}
}
.about-content-1 .about-list-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 40px;
}
@media (max-width: 1199.98px) {
.about-content-1 .about-list-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
@media (max-width: 767.98px) {
.about-content-1 .about-list-items {
margin-top: 30px;
}
}
.about-content-1 .about-list-items .about-list li {
font-size: 18px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
}
.about-content-1 .about-list-items .about-list li:not(:last-child) {
margin-bottom: 13px;
}
.about-content-1 .about-list-items .about-list li .icon {
position: relative;
color: var(--headings-color);
background-color: var(--theme-color1);
width: 22px;
height: 22px;
line-height: 22px;
border-radius: 22px;
font-size: 13px;
text-align: center;
border: 2px solid var(--headings-color);
}
.about-content-1 .about-list-items .about-list li .icon::before {
position: absolute;
top: 2px;
right: -4px;
content: "";
background-color: var(--theme-color2);
width: 20px;
height: 20px;
border-radius: 50%;
z-index: -1;
}
.about-content-1 .about-list-items .counter-box {
padding: 32px;
border-radius: 20px;
min-width: 250px;
background: -webkit-gradient(linear, left top, left bottom, from(#C8F169), to(#039397));
background: linear-gradient(180deg, #C8F169 0%, #039397 100%);
position: relative;
z-index: 9;
}
.about-content-1 .about-list-items .counter-box .butterfly-shape {
position: absolute;
bottom: 0;
right: 0;
z-index: -1;
}
.about-content-1 .about-list-items .counter-box h2 {
font-weight: 400;
font-size: 64px;
color: #fff;
}
.about-content-1 .about-list-items .counter-box .counter-bottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.about-content-1 .about-list-items .counter-box .counter-bottom p {
font-size: 18px;
max-width: 173px;
color: #fff;
font-weight: 500;
line-height: 133%;
}
.about-content-1 .about-list-items .counter-box .counter-bottom .icon {
font-size: 50px;
color: #fff;
}
.about-content-1 .about-list-items .counter-box:hover .counter-bottom .icon .animated-svg path {
-webkit-animation: draw2 3s forwards ease-in-out;
animation: draw2 3s forwards ease-in-out;
}
.about-section {
position: relative;
z-index: 9;
}
.about-section .star-shape {
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
@media (max-width: 1399.98px) {
.about-section .star-shape {
display: none;
}
}
.about-section .arrow-shape-1 {
position: absolute;
top: 35%;
right: 40px;
z-index: -1;
}
@media (max-width: 1399.98px) {
.about-section .arrow-shape-1 {
display: none;
}
}
.about-section .arrow-shape-2 {
position: absolute;
top: 35%;
right: 0;
z-index: -1;
}
@media (max-width: 1399.98px) {
.about-section .arrow-shape-2 {
display: none;
}
}
.about-section-2 {
margin: 120px 30px 120px;
border-radius: 50px;
position: relative;
z-index: 9;
}
@media (max-width: 1399.98px) {
.about-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 1199.98px) {
.about-section-2 {
margin-top: 100px;
margin-bottom: 100px;
}
}
@media (max-width: 991.98px) {
.about-section-2 {
margin-top: 80px;
margin-bottom: 80px;
}
}
@media (max-width: 767.98px) {
.about-section-2 {
margin-left: 20px;
margin-right: 20px;
padding-left: 18px;
padding-right: 18px;
}
}
@media (max-width: 575.98px) {
.about-section-2 {
padding-left: 0;
padding-right: 0;
padding-left: 12px;
padding-right: 12px;
}
}
.about-section-2 .shape-1 {
left: 0;
top: 40%;
position: absolute;
}
@media (max-width: 1399.98px) {
.about-section-2 .shape-1 {
display: none;
}
}
.about-section-2 .arrow-shape-1 {
position: absolute;
top: 35%;
right: 40px;
z-index: -1;
}
@media (max-width: 1399.98px) {
.about-section-2 .arrow-shape-1 {
display: none;
}
}
.about-section-2 .arrow-shape-2 {
position: absolute;
top: 35%;
right: 0;
z-index: -1;
}
@media (max-width: 1399.98px) {
.about-section-2 .arrow-shape-2 {
display: none;
}
}
.about-image-items-2 {
position: relative;
}
.about-image-items-2 .about-image {
position: relative;
max-width: 512px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.about-image-items-2 .about-image img {
width: 100%;
height: 100%;
}
.about-image-items-2 .about-counter2 {
border-radius: 50%;
text-align: center;
position: absolute;
top: 50%;
right: 80px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 9;
}
@media (max-width: 1199.98px) {
.about-image-items-2 .about-counter2 {
left: 220px;
right: auto;
}
}
@media (max-width: 767.98px) {
.about-image-items-2 .about-counter2 {
left: 41%;
}
}
.about-image-items-2 .about-counter2::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 168px;
height: 168px;
border-radius: 50%;
background-color: var(--theme-color-white);
border: 2px solid var(--theme-color1);
content: "";
z-index: -1;
}
.about-image-items-2 .about-counter2::after {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 140px;
height: 140px;
border-radius: 50%;
background-color: var(--theme-color1);
content: "";
z-index: -1;
}
.about-image-items-2 .about-counter2 h2 {
font-weight: bold;
font-size: 49px;
margin-top: -7px;
}
.about-image-items-2 .about-counter2 p {
color: var(--headings-color);
line-height: 1.3;
font-weight: 500;
margin-top: -10px;
max-width: 145px;
}
.about-image-items-2 .about-counter2 p br {
display: block;
}
.about-content-2 {
max-width: 620px;
}
.about-content-2 .icon-items-area {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 35px;
margin-bottom: 35px;
}
@media (max-width: 1199.98px) {
.about-content-2 .icon-items-area {
margin-top: 30px;
margin-bottom: 30px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 50px;
}
}
@media (max-width: 575.98px) {
.about-content-2 .icon-items-area {
gap: 20px;
}
}
.about-content-2 .icon-items-area .icon-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
width: 50%;
}
@media (max-width: 767.98px) {
.about-content-2 .icon-items-area .icon-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
.about-content-2 .icon-items-area .icon-items .icon {
max-width: 66px;
width: 100%;
height: 66px;
line-height: 66px;
text-align: center;
background-color: #144443;
border-radius: 50%;
position: relative;
font-size: 32px;
}
.about-content-2 .icon-items-area .icon-items .icon i {
background: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.about-content-2 .icon-items-area .icon-items .icon::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border: 1px dashed #144443;
content: "";
width: 84px;
height: 84px;
border-radius: 50%;
}
.about-content-2 .icon-items-area .icon-items .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.about-content-2 .icon-items-area .icon-items h6 {
font-family: var(--body-font-family);
font-size: 18px;
font-weight: 500;
max-width: 170px;
}
@media (max-width: 575.98px) {
.about-content-2 .icon-items-area .icon-items h6 {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
}
}
.about-content-2 .icon-items-area .icon-items:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.about-content-2 .theme-btn {
position: relative;
margin-top: 45px;
}
@media (max-width: 767.98px) {
.about-content-2 .theme-btn {
margin-top: 30px;
}
}
.about-content-2 .theme-btn.btn-style-one {
padding: 26px 60px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-right: 100px;
height: 70px;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
}
.about-content-2 .theme-btn.btn-style-one:before {
display: none;
}
@media only screen and (max-width: 767px) {
.about-content-2 .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.about-content-2 .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.about-content-2 .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.about-content-2 .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.about-content-2 .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.about-content-2 .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
fill: var(--theme-color-white);
}
.about-content-2 .theme-btn.btn-style-one:hover .icon svg path {
fill: var(--theme-color-white);
}
.about-content-2 .theme-btn .icon {
color: var(--headings-color);
width: 62px;
height: 62px;
line-height: 65px;
border-radius: 50%;
background-color: #fff;
position: absolute;
right: 4px;
top: 4px;
bottom: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
font-size: 30px;
}
[data-tm-layout=dark] .about-content-2 .theme-btn .icon {
color: var(--theme-color-white);
}
.about-content-2 .theme-btn:hover i {
color: var(--theme-color-white);
}
.about-counter {
border-top: 1px solid rgba(0, 0, 0, 0.1);
padding-top: 30px;
}
[data-tm-layout=dark] .about-counter {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.about-counter .count-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
}
.about-counter .count-box h2 {
font-size: 96px;
font-weight: 600;
}
@media (max-width: 575.98px) {
.about-counter .count-box h2 {
font-size: 60px;
}
}
.about-counter .count-box p {
font-size: 18px;
font-weight: 500;
}
.image-column-3 .inner-column {
position: relative;
z-index: 1;
max-width: 590px;
}
.image-column-3 .inner-column .image1 {
max-width: 500px;
border-radius: 12px;
border: 10px solid var(--theme-color-white);
-webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
}
.image-column-3 .inner-column .image1 img {
width: 100%;
border-radius: 12px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.image-column-3 .inner-column .image1:hover img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.image-column-3 .inner-column .info {
position: absolute;
bottom: -15px;
left: 26%;
max-width: 202px;
width: 100%;
border-radius: 10px;
-webkit-box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1019607843);
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1019607843);
overflow: hidden;
z-index: 2;
}
.image-column-3 .inner-column .image2 {
max-width: 295px;
border-radius: 12px;
border: 10px solid var(--theme-color-white);
-webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
position: absolute;
bottom: -120px;
right: 0;
}
.image-column-3 .inner-column .image2 img {
width: 100%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.image-column-3 .inner-column .image2:hover img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
@media (max-width: 991.98px) {
.image-column-3 .inner-column {
margin-bottom: 100px;
}
}
@media (max-width: 575.98px) {
.image-column-3 .inner-column {
margin-bottom: 0;
}
.image-column-3 .inner-column .image2 {
position: unset;
max-width: 100%;
margin-top: 20px;
}
}
.about-content-3 .about-text {
margin-top: 25px;
}
.about-content-3 .about-block .inner-box {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 20px;
margin-top: 20px;
}
.about-content-3 .about-block .inner-box .icon {
color: var(--theme-color-black);
font-size: 50px;
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
}
.about-content-3 .about-block .inner-box .title {
font-size: 20px;
line-height: 36px;
margin-bottom: 5px;
}
.about-content-3 .about-block .inner-box .text {
margin: 0;
}
.about-content-3 .about-block .inner-box:hover .icon {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.about-content-3 .info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
gap: 20px;
max-width: 450px;
}
@media (max-width: 575.98px) {
.about-content-3 .info {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.about-content-3 .info .user {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 12px;
}
.about-content-3 .info .user .image {
overflow: hidden;
border-radius: 50%;
max-width: 60px;
width: 100%;
height: 60px;
border: 3px solid var(--theme-color1);
}
.about-content-3 .info .user .image img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.about-content-3 .info .user .sub-title {
font-size: 14px;
line-height: 22px;
font-weight: 500;
color: #0c6460;
margin-bottom: 0;
}
[data-tm-layout=dark] .about-content-3 .info .user .sub-title {
color: rgba(204, 204, 204, 0.8);
}
.about-content-3 .skill-feature {
margin-top: 30px;
}
.about-content-3 .skill-feature .box-title {
font-size: 20px;
font-weight: 700;
font-family: var(--heading-font-family);
}
.about-content-3 .skill-feature .progress-value {
margin-bottom: 10px;
color: var(--headings-color);
text-transform: capitalize;
}
.about-content-3 .skill-feature .progress {
position: relative;
height: 8px;
background-color: #E8E8E8;
border-radius: 12px;
overflow: visible;
margin-top: 15px;
}
[data-tm-layout=dark] .about-content-3 .skill-feature .progress {
background-color: rgb(var(--theme-color-white-rgb), 0.3);
}
.about-content-3 .skill-feature .progress-bar {
background-color: #0C6460;
height: 8px;
margin: 0;
border-radius: 12px;
overflow: visible;
position: relative;
margin-top: 0;
}
.about-content-3 .skill-feature .progress-value {
position: absolute;
top: -38px;
right: -8px;
font-size: 18px;
font-weight: 700;
color: var(--headings-color);
font-family: var(--heading-font-family);
}
.about-content-3 .theme-btn {
position: relative;
}
.about-content-3 .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
.about-content-3 .theme-btn.btn-style-one:before {
display: none;
}
@media only screen and (max-width: 767px) {
.about-content-3 .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.about-content-3 .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.about-content-3 .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.about-content-3 .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.about-content-3 .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.about-content-3 .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .about-content-3 .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.about-content-3 .theme-btn .icon {
background-color: #fff;
color: var(--theme-color-black);
border-radius: 50%;
bottom: 4px;
height: 62px;
font-size: 50px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 62px;
}
.progress {
background-color: transparent;
position: relative;
display: block;
height: auto;
width: 100%;
border-radius: 0;
}
.progress .bar {
position: relative;
width: 100%;
height: 8px;
background-color: #e8e8e8;
border-radius: 13px;
overflow: hidden;
}
.progress .bar-inner {
position: relative;
display: block;
width: 0px;
height: 100%;
border-radius: 13px;
background-color: #0c6460;
-webkit-transition: all 1500ms ease;
transition: all 1500ms ease;
}
.progress .count-text {
position: absolute;
right: 0px;
bottom: 21px;
color: var(--theme-color-white);
background-color: #0c6460;
border-radius: 3px;
font-size: 18px;
line-height: 18px;
font-weight: 700;
opacity: 0;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
padding: 5px 13px;
z-index: 1;
}
.progress .count-text::after {
position: absolute;
bottom: -5px;
left: 50%;
-webkit-transform: translateX(-50%) rotate(45deg);
transform: translateX(-50%) rotate(45deg);
background-color: #0c6460;
width: 14px;
height: 14px;
content: "";
z-index: -1;
}
.progress .bar-inner.counted .count-text {
opacity: 1;
bottom: 25px;
right: -35px;
}
.progress .bar.marb-0 {
margin-bottom: 0;
}
.progress .progress-single {
position: relative;
display: block;
}
.progress .progress-title {
font-size: 20px;
font-weight: 700;
line-height: 36px;
color: var(--headings-color);
margin-bottom: 10px;
}
.about-image-style-4 {
position: relative;
max-width: 602px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.about-image-style-4 img {
width: 100%;
height: 100%;
}
.about-content-style-4 .about-icon-box {
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
margin-top: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 60px;
padding: 25px 0;
}
[data-tm-layout=dark] .about-content-style-4 .about-icon-box {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.about-content-style-4 .about-icon-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
.about-content-style-4 .about-icon-box .count-box {
border-right: 1px solid rgba(0, 0, 0, 0.1);
padding-right: 40px;
min-width: 220px;
}
[data-tm-layout=dark] .about-content-style-4 .about-icon-box .count-box {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.about-content-style-4 .about-icon-box .count-box {
border-right: none;
padding-right: 0;
}
}
.about-content-style-4 .about-icon-box .count-box h2 {
font-size: 120px;
font-weight: 500;
line-height: 1;
}
.about-content-style-4 .about-icon-box .about-block {
margin-bottom: 30px;
}
.about-content-style-4 .about-icon-box .about-block .inner-box {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 15px;
line-height: normal;
}
.about-content-style-4 .about-icon-box .about-block .inner-box .icon {
font-size: 50px;
color: var(--headings-color);
}
.about-content-style-4 .about-icon-box .about-block .inner-box .content .title {
font-size: 18px;
font-weight: 700;
}
.about-content-style-4 .about-icon-box .about-block .inner-box .content p {
font-size: 16px;
font-weight: 400;
}
.about-content-style-4 .info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 50px;
}
@media (max-width: 1199.98px) {
.about-content-style-4 .info {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
.about-content-style-4 .info .theme-btn {
position: relative;
}
.about-content-style-4 .info .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
@media only screen and (max-width: 767px) {
.about-content-style-4 .info .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.about-content-style-4 .info .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.about-content-style-4 .info .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.about-content-style-4 .info .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.about-content-style-4 .info .theme-btn.btn-style-one:before {
display: none;
}
.about-content-style-4 .info .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.about-content-style-4 .info .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .about-content-style-4 .info .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.about-content-style-4 .info .theme-btn .icon {
background-color: var(--theme-color-white);
color: var(--theme-color-black);
border-radius: 50%;
bottom: 4px;
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 62px;
}
[data-tm-layout=dark] .about-content-style-4 .info .theme-btn .icon {
color: var(--headings-color);
}
.about-content-style-4 .info .user {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 12px;
}
.about-content-style-4 .info .user .image {
overflow: hidden;
border-radius: 50%;
max-width: 60px;
width: 100%;
height: 60px;
border: 3px solid var(--theme-color1);
}
.about-content-style-4 .info .user .image img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.about-content-style-4 .info .user .sub-title {
font-size: 14px;
line-height: 22px;
font-weight: 500;
color: #0c6460;
margin-bottom: 0;
}
.about-section-three {
position: relative;
z-index: 9;
}
.about-section-three .container {
padding: 0;
}
.about-section-three .content-colmun .content-box .sec-title .text {
font-size: 16px;
line-height: 35px;
font-weight: 400;
text-transform: capitalize;
color: var(--text-color);
}
@media (max-width: 767.98px) {
.about-section-three .content-colmun .content-box .sec-title .text {
margin-top: 0;
margin-bottom: 30px;
}
}
.about-section-three .content-colmun .content-box .feature-box {
position: relative;
padding: 42px 50px 40px;
max-width: 560px;
width: 100%;
z-index: 1;
background-color: var(--bg-theme-color2);
}
@media (max-width: 991.98px) {
.about-section-three .content-colmun .content-box .feature-box {
padding: 42px 30px 40px;
}
}
@media (max-width: 767.98px) {
.about-section-three .content-colmun .content-box .feature-box {
max-width: 100%;
}
}
.about-section-three .content-colmun .content-box .feature-box .shape-image {
position: absolute;
top: 0;
right: 0;
z-index: -1;
}
.about-section-three .content-colmun .content-box .feature-box .feature-title {
font-weight: 700;
font-size: 24px;
line-height: 30px;
text-transform: capitalize;
margin-bottom: 25px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .about-section-three .content-colmun .content-box .feature-box .feature-title {
color: #ffffff;
}
.about-section-three .content-colmun .content-box .feature-box .feature-list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 10px;
}
.about-section-three .content-colmun .content-box .feature-box .feature-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
font-size: 16px;
line-height: 30px;
font-weight: 400;
font-family: var(--heading-font-family);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .about-section-three .content-colmun .content-box .feature-box .feature-list li {
color: #ffffff;
}
.about-section-three .content-colmun .content-box .feature-box .feature-list li .icon {
position: relative;
color: var(--theme-color-white);
font-size: 14px;
}
.about-section-three .content-colmun .content-box .feature-box .feature-list li .icon img {
position: relative;
z-index: 9;
}
.about-section-three .content-colmun .content-box .feature-box .feature-list li .icon::before {
position: absolute;
top: 2px;
right: -4px;
content: "";
background: var(--Linear, linear-gradient(90deg, #C8F169 0%, #039397 100%));
width: 24px;
height: 24px;
border-radius: 50%;
z-index: -1;
}
.about-section-three .image-colmun .image-box {
position: relative;
padding-left: 97px;
}
@media (max-width: 1399.98px) {
.about-section-three .image-colmun .image-box {
padding-left: 0;
}
}
.about-section-three .image-colmun .image-box .count-box {
position: absolute;
bottom: 30px;
left: -85px;
max-width: 312px;
width: 100%;
text-align: center;
display: inline-block;
padding: 35px 62px 48px;
background-color: #F5F5F5;
}
[data-tm-layout=dark] .about-section-three .image-colmun .image-box .count-box {
background-color: var(--dark-color2);
}
@media (max-width: 1399.98px) {
.about-section-three .image-colmun .image-box .count-box {
left: 30px;
}
}
@media (max-width: 1199.98px) {
.about-section-three .image-colmun .image-box .count-box {
padding: 30px 50px 30px;
}
}
.about-section-three .image-colmun .image-box .count-box .counter {
font-weight: 700;
font-size: 60px;
line-height: 60px;
color: var(--headings-color);
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 10px;
font-size: clamp(20px, 4.5vw, 60px);
line-height: 1.2;
}
.about-section-three .image-colmun .image-box .count-box .counter .count-text {
font-weight: 700;
font-size: 120px;
line-height: 120px;
letter-spacing: -7.2px;
font-size: clamp(40px, 6.25vw, 120px);
line-height: 1.2;
}
.about-section-three .image-colmun .image-box .count-box .counter-title {
line-height: 35px;
margin-bottom: 55px;
text-transform: capitalize;
color: var(--headings-color);
}
@media (max-width: 1199.98px) {
.about-section-three .image-colmun .image-box .count-box .counter-title {
margin-bottom: 30px;
}
}
.about-section-three .image-colmun .image-box .count-box .counter-btn {
text-align: center;
padding: 12px 20px;
font-weight: 700;
font-size: 18px;
line-height: 100%;
font-family: var(--heading-font-family);
text-transform: capitalize;
color: var(--headings-color);
background-color: var(--theme-color1);
}
.about-section-four {
position: relative;
margin: 0px 30px;
border-radius: 30px;
overflow: hidden;
z-index: 99;
background-color: var(--theme-color2);
}
@media (max-width: 767.98px) {
.about-section-four {
margin: 0;
}
}
.about-section-four .shape-1 {
position: absolute;
top: 45px;
left: 35px;
}
@media (max-width: 1199.98px) {
.about-section-four .shape-1 {
display: none;
}
}
.about-section-four .arrow-shape-1 {
position: absolute;
bottom: 40px;
right: 50px;
}
@media (max-width: 767.98px) {
.about-section-four .arrow-shape-1 {
display: none;
}
}
.about-section-four .arrow-shape-2 {
position: absolute;
bottom: 40px;
right: -100px;
}
@media (max-width: 767.98px) {
.about-section-four .arrow-shape-2 {
display: none;
}
}
.about-image-four {
position: relative;
padding-right: 50px;
z-index: 1;
}
@media (max-width: 1199.98px) {
.about-image-four {
padding-right: 0;
}
}
.about-image-four .shape-bg1 {
position: absolute;
right: 0;
bottom: 50px;
width: 470px;
height: 470px;
border-radius: 50%;
content: "";
z-index: -2;
background-color: rgba(31, 31, 31, 0.2);
}
@media (max-width: 1199.98px) {
.about-image-four .shape-bg1 {
display: none;
}
}
.about-image-four .about-counter-four {
background-color: var(--theme-color1);
border-radius: 50%;
text-align: center;
position: absolute;
bottom: 50px;
left: 15px;
z-index: 9;
}
.about-image-four .about-counter-four::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 168px;
height: 168px;
border-radius: 50%;
background-color: var(--theme-color-white);
border: 2px solid var(--theme-color1);
content: "";
z-index: -1;
}
[data-tm-layout=dark] .about-image-four .about-counter-four::before {
background-color: var(--dark-color2);
}
.about-image-four .about-counter-four::after {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 140px;
height: 140px;
border-radius: 50%;
background-color: var(--theme-color1);
content: "";
z-index: -1;
}
.about-image-four .about-counter-four .count-box {
width: 140px;
height: 140px;
line-height: 140px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.about-image-four .about-counter-four .count-box .counter {
font-family: var(--heading-font-family);
font-weight: 600;
font-size: 56px;
line-height: 70px;
text-align: center;
margin-top: -15px;
text-transform: capitalize;
color: var(--headings-color);
}
[data-tm-layout=dark] .about-image-four .about-counter-four .count-box .counter {
color: var(--theme-color2);
}
.about-image-four .about-counter-four .count-box .counter-title {
color: var(--headings-color);
line-height: 1.3;
font-weight: 500;
margin-top: -10px;
}
[data-tm-layout=dark] .about-image-four .about-counter-four .count-box .counter-title {
color: var(--theme-color2);
}
.about-image-four .about-counter-four .count-box .counter-title br {
display: block;
}
.about-content-four {
position: relative;
margin-left: 30px;
}
@media (max-width: 1399.98px) {
.about-content-four {
margin-left: 0;
}
}
.about-content-four .icon-items-area {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 50px;
margin-bottom: 30px;
}
@media (max-width: 1399.98px) {
.about-content-four .icon-items-area {
gap: 30px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.about-content-four .icon-items-area .icon-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
}
.about-content-four .icon-items-area .icon-items .icon-box {
width: 84px;
height: 84px;
border-radius: 50%;
text-align: center;
line-height: 64px;
padding: 9px;
-ms-flex-negative: 0;
flex-shrink: 0;
background-color: transparent;
border: 1px dashed var(--theme-color-white);
}
[data-tm-layout=dark] .about-content-four .icon-items-area .icon-items .icon-box {
border-color: #ffffff;
}
.about-content-four .icon-items-area .icon-items .icon-box .icon {
background-color: var(--theme-color-white);
border-radius: 50%;
}
.about-content-four .icon-items-area .icon-items .icon-box .icon i {
font-size: 25px;
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
.about-content-four .icon-items-area .icon-items .icon-title {
font-weight: 700;
font-size: 18px;
line-height: 30px;
text-transform: capitalize;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .about-content-four .icon-items-area .icon-items .icon-title {
color: #ffffff;
}
.about-content-four .about-text {
font-weight: 400;
font-size: 16px;
line-height: 35px;
text-transform: capitalize;
color: rgb(var(--theme-color-white-rgb), 0.7);
margin-bottom: 25px;
}
[data-tm-layout=dark] .about-content-four .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .about-content-four .btn-style-two .icon {
background-color: var(--theme-color1);
}
[data-tm-layout=dark] .about-content-four .btn-style-two:hover .icon {
background-color: #ffffff;
}
/***
====================================================================
Services Section
====================================================================
***/
.service-section {
position: relative;
z-index: 9;
border-radius: 30px;
margin: 0 15px;
padding: 120px 30px;
background-attachment: fixed;
}
.service-section::before {
background: linear-gradient(280deg, rgba(20, 68, 67, 0.85) 15.04%, #144443 50.27%);
z-index: -1;
border-radius: 30px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
}
.service-section .ellipse-bg {
position: absolute;
top: 45px;
left: 150px;
z-index: -1;
display: inline-block;
width: 180px;
height: 180px;
-ms-flex-negative: 0;
flex-shrink: 0;
background: #C8F169;
-webkit-filter: blur(100px);
filter: blur(100px);
z-index: -1;
}
.service-wrapper {
margin: 0 30px;
margin: 0 15px;
margin: 0;
}
.service-card-items {
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 30px;
margin-top: 30px;
padding: 50px;
padding-bottom: 30px;
}
@media (max-width: 1699.98px) {
.service-card-items {
padding: 35px;
}
}
@media (max-width: 575.98px) {
.service-card-items {
padding: 30px;
}
}
@media (max-width: 469.98px) {
.service-card-items {
padding: 25px;
}
}
.service-card-items .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
height: 68px;
line-height: 72px;
text-align: center;
width: 68px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
color: var(--theme-color-white);
font-size: 35px;
}
.service-card-items .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.service-card-items .content {
margin-top: 35px;
}
.service-card-items .content h3 a {
color: #fff;
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.service-card-items .content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff));
background-image: linear-gradient(180deg, #fff 0%, #fff 100%);
}
.service-card-items .content p {
color: #C4C4C4;
}
.service-card-items .content .link-btn {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
display: inline-block;
margin-top: 20px;
line-height: 1;
font-size: 35px;
color: var(--theme-color-white);
}
.service-card-items .content .link-btn:hover {
-webkit-transform: rotate(0);
transform: rotate(0);
}
.service-card-items:hover .icon {
background-position: 100% 0;
}
.service-card-items:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.service-section .section-counter-content h3 {
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: #C8F169;
font-size: 120px;
font-weight: 600;
color: transparent;
font-family: var(--body-font-family);
}
.service-card-items-2 {
margin-top: 30px;
position: relative;
padding: 30px 0;
padding-bottom: 0;
position: relative;
overflow: hidden;
}
.service-card-items-2 .arrow-shape-2 {
position: absolute;
bottom: 0;
right: 0;
z-index: -1;
}
.service-card-items-2::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border: 1px solid #DADADA;
left: 14px;
width: initial;
z-index: -1;
}
[data-tm-layout=dark] .service-card-items-2::before {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.service-card-items-2 .service-icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
}
.service-card-items-2 .service-icon .icon {
width: 89px;
height: 92px;
line-height: 92px;
background: #144443;
text-align: center;
position: relative;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
font-size: 33px;
color: var(--theme-color1);
}
.service-card-items-2 .service-icon .icon .arrow-shape {
position: absolute;
bottom: -52px;
left: 0px;
}
.service-card-items-2 .service-icon .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.service-card-items-2 .service-icon .icon .service-triangle {
position: absolute;
width: 0;
height: 0;
bottom: 0;
left: 0;
}
.service-card-items-2 .service-icon .icon .service-triangle::before {
content: "";
position: absolute;
width: 0;
height: 0;
border-right: 14px solid #235C5B;
border-bottom: 11px solid transparent;
}
.service-card-items-2 .service-icon .number {
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: #000000;
opacity: 0.3;
font-size: 96px;
font-weight: 700;
color: transparent;
font-family: var(--body-font-family);
line-height: 1;
}
[data-tm-layout=dark] .service-card-items-2 .service-icon .number {
-webkit-text-stroke-color: var(--headings-color);
}
.service-card-items-2 .content {
padding: 50px 40px 40px;
}
@media (max-width: 767.98px) {
.service-card-items-2 .content {
padding: 30px 30px 25px;
}
}
.service-card-items-2 .content h3 a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.service-card-items-2 .content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--headings-color)), to(var(--headings-color)));
background-image: linear-gradient(180deg, var(--headings-color) 0%, var(--headings-color) 100%);
}
.service-card-items-2 .content p {
line-height: 218%;
}
@media (max-width: 1199.98px) {
.service-card-items-2 .content p br {
display: none;
}
}
.service-card-items-2:hover .service-icon .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.service-know-box {
border-radius: 100px;
background: #C8F169;
padding: 5px 8px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 25px;
max-width: 770px;
margin: 60px auto 0;
}
@media (max-width: 767.98px) {
.service-know-box {
display: block;
margin: 40px auto 0;
text-align: center;
padding: 14px;
}
}
.service-know-box .icon {
width: 65px;
height: 65px;
line-height: 65px;
text-align: center;
border-radius: 50%;
-webkit-box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
background-color: var(--theme-color-white);
}
@media (max-width: 767.98px) {
.service-know-box .icon {
margin: 0 auto;
}
}
.service-know-box p {
font-size: 18px;
font-weight: 500;
color: var(--theme-color2);
text-transform: capitalize;
}
.service-know-box p a {
font-weight: 600;
text-decoration: underline;
}
[data-tm-layout=dark] .service-know-box p a {
color: var(--theme-color2);
}
.service-know-box p a i {
margin-left: 5px;
font-size: 19px;
}
.service-card-items-4 {
position: relative;
padding: 40px;
position: relative;
border-radius: 30px;
background: var(--theme-color-white);
}
@media (max-width: 1699.98px) {
.service-card-items-4 {
padding: 30px;
}
}
@media (max-width: 469.98px) {
.service-card-items-4 {
padding: 25px;
}
}
.service-card-items-4 .service-icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
}
.service-card-items-4 .service-icon .icon {
position: relative;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
font-size: 70px;
line-height: 1;
color: var(--theme-color2);
}
.service-card-items-4 .service-icon .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.service-card-items-4 .service-icon .number {
color: rgba(102, 102, 102, 0.15);
font-family: var(--heading-font-family);
font-size: 80px;
font-weight: 600;
top: -5px;
right: 30px;
position: absolute;
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
}
.service-card-items-4 .content {
margin-top: 160px;
}
@media (max-width: 1199.98px) {
.service-card-items-4 .content {
margin-top: 30px;
}
}
.service-card-items-4 .content h3 {
margin-bottom: 10px;
}
.service-card-items-4 .content h3 a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.service-card-items-4 .content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--headings-color)), to(var(--headings-color)));
background-image: linear-gradient(180deg, var(--headings-color) 0%, var(--headings-color) 100%);
}
.service-card-items-4 .content p {
line-height: 218%;
}
@media (max-width: 1199.98px) {
.service-card-items-4 .content p br {
display: none;
}
}
.service-card-items-4:hover .service-icon .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.service-card-items-4:hover .service-icon .icon svg path {
fill: var(--theme-color1);
}
.service-card-items-4:hover .service-icon .number {
color: var(--headings-color);
}
.service-section-4 .container-fluid {
padding: 0 90px;
}
@media (max-width: 1699.98px) {
.service-section-4 .container-fluid {
padding: 0 50px;
}
}
@media (max-width: 1399.98px) {
.service-section-4 .container-fluid {
padding: 0 40px;
}
}
@media (max-width: 1199.98px) {
.service-section-4 .container-fluid {
padding: 0 30px;
}
}
.service-wrapper-4 {
margin-top: 30px;
}
@media (max-width: 767.98px) {
.service-wrapper-4 {
margin-top: 30px;
}
}
.service-block-two {
margin-bottom: 0;
position: relative;
}
.service-block-two .inner-box {
position: relative;
padding-bottom: 20px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.service-block-two .inner-box:hover .title-box .title {
color: var(--theme-color1);
}
.service-block-two .inner-box.active .title-box .number,
.service-block-two .inner-box.active .title-box .icon-box {
color: var(--theme-color1);
}
.service-block-two .inner-box.active .content-box.active {
display: block;
}
.service-block-two .inner-box .title-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 18px 0 0;
position: relative;
cursor: pointer;
}
@media (max-width: 575.98px) {
.service-block-two .inner-box .title-box {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
}
}
.service-block-two .inner-box .title-box .number {
font-size: 20px;
margin-right: 77px;
color: var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .service-block-two .inner-box .title-box .number {
color: var(--headings-color);
}
@media (max-width: 767.98px) {
.service-block-two .inner-box .title-box .number {
margin-right: 20px;
}
}
@media (max-width: 575.98px) {
.service-block-two .inner-box .title-box .number {
margin-right: 0;
margin-bottom: 20px;
}
}
.service-block-two .inner-box .title-box .number span {
font-weight: 700;
}
.service-block-two .inner-box .title-box .title {
color: var(--theme-color-white);
font-weight: 600;
font-size: clamp(20px, 3.12vw, 50px);
line-height: 1.2;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .service-block-two .inner-box .title-box .title {
color: var(--headings-color);
}
.service-block-two .inner-box .title-box .title:hover {
color: var(--theme-color1);
}
.service-block-two .inner-box .title-box .icon-box {
color: var(--theme-color-white);
font-size: 50px;
line-height: 1;
margin-left: auto;
margin-right: 15px;
position: relative;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 767.98px) {
.service-block-two .inner-box .title-box .icon-box {
font-size: 30px;
}
}
@media (max-width: 575.98px) {
.service-block-two .inner-box .title-box .icon-box {
margin-right: auto;
}
}
.service-block-two .inner-box .content-box {
display: none;
padding: 39px 0 19px;
}
.service-block-two .inner-box .content-box .image-column .inner-column {
display: inline-block;
position: relative;
}
.service-block-two .inner-box .content-box .image-column .inner-column .image {
margin-bottom: 0;
}
.service-block-two .inner-box .content-box .image-column .inner-column .image img {
border-radius: 30px;
width: 100%;
height: 100%;
position: relative;
max-width: 602px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box {
position: absolute;
right: 0;
bottom: 0;
border-radius: 30px 0 0 0;
}
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 20px;
color: var(--theme-color-white);
display: inline-block;
font-size: 30px;
height: 86px;
line-height: 86px;
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 120px;
z-index: 2;
}
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner i {
-webkit-transform: rotate(40deg);
transform: rotate(40deg);
}
@media (max-width: 1399.98px) {
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
width: 110px;
height: 80px;
font-size: 40px;
line-height: 90px;
position: relative;
}
}
@media (max-width: 1199.98px) {
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
width: 92px;
height: 68px;
font-size: 30px;
line-height: 70px;
}
}
@media (max-width: 991.98px) {
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
width: 120px;
height: 86px;
font-size: 40px;
line-height: 90px;
}
}
@media (max-width: 767.98px) {
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
width: 100px;
height: 72px;
font-size: 32px;
line-height: 80px;
}
}
@media (max-width: 575.98px) {
.service-block-two .inner-box .content-box .image-column .inner-column .icon-box .inner {
width: 80px;
height: 60px;
font-size: 30px;
line-height: 66px;
}
}
.service-block-two .inner-box .content-box .image-column .inner-column:hover .inner {
background-position: 100% 0;
}
.service-block-two .inner-box .content-box .content-column .inner-column {
padding: 31px 25px 0 28px;
}
@media (max-width: 1199.98px) {
.service-block-two .inner-box .content-box .content-column .inner-column {
padding: 0 25px 0 28px;
}
}
@media (max-width: 991.98px) {
.service-block-two .inner-box .content-box .content-column .inner-column {
padding: 30px 0 0 0;
}
}
.service-block-two .inner-box .content-box .content-column .inner-column .text {
font-size: 16px;
font-weight: 400;
margin-bottom: 25px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .service-block-two .inner-box .content-box .content-column .inner-column .text {
color: var(--headings-color);
}
.service-block-two .inner-box .content-box .content-column .inner-column .info-list {
color: var(--theme-color-white);
position: relative;
}
[data-tm-layout=dark] .service-block-two .inner-box .content-box .content-column .inner-column .info-list {
color: var(--headings-color);
}
.service-block-two .inner-box .content-box .content-column .inner-column .info-list .list-item {
font-weight: 400;
margin-bottom: 16px;
text-transform: uppercase;
margin-right: -10px;
}
.service-block-two .inner-box .content-box .content-column .inner-column .info-list .list-item span {
display: inline-block;
min-width: 269px;
}
.service-section-three .btn-style-two {
max-width: 209px;
width: 100%;
margin: 0 auto;
margin-right: 0;
display: block;
margin-bottom: 20px;
}
[data-tm-layout=dark] .service-section-three .btn-style-two {
color: #ffffff;
}
@media (max-width: 767.98px) {
.service-section-three .btn-style-two {
margin: 0;
}
}
.service-section-three .btn-style-two:hover .icon {
background-color: var(--headings-color);
}
.service-section-three .btn-style-two .icon {
background-color: var(--theme-color1);
}
.service-block-three .outer-box {
position: relative;
padding: 40px;
padding-bottom: 36px;
border-radius: 10px;
overflow: hidden;
margin-bottom: 30px;
border: 1px solid rgba(var(--theme-color-black-rgb), 0.1);
}
[data-tm-layout=dark] .service-block-three .outer-box {
border-color: rgba(var(--theme-color-white-rgb), 0.1);
}
.service-block-three .outer-box .arrow-shape-2 {
position: absolute;
bottom: -1px;
right: 50px;
}
.service-block-three .outer-box:hover .icon-box .icon {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.service-block-three .outer-box .icon-box {
margin-bottom: 35px;
}
.service-block-three .outer-box .icon-box .icon {
-webkit-transform: rotateY(0);
transform: rotateY(0);
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
font-size: 50px;
line-height: 1;
background: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.service-block-three .outer-box .content-box .contact-title {
font-size: 24px;
line-height: 30px;
font-weight: 700;
text-transform: capitalize;
max-width: 222px;
margin-bottom: 15px;
font-size: clamp(18px, 1.25vw, 24px);
line-height: 1.5;
}
.service-block-three .outer-box .content-box .feature-list li {
position: relative;
font-size: 18px;
line-height: 30px;
font-weight: 600;
color: var(--theme-color-gray2);
font-family: var(--heading-font-family);
padding-left: 13px;
}
[data-tm-layout=dark] .service-block-three .outer-box .content-box .feature-list li {
color: rgba(204, 204, 204, 0.8);
}
.service-block-three .outer-box .content-box .feature-list li:before {
position: absolute;
top: 12px;
left: 0;
width: 5px;
height: 5px;
content: "";
border-radius: 50%;
background-color: var(--theme-color-gray2);
}
[data-tm-layout=dark] .service-section-four .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .service-section-four .btn-style-two .icon {
background-color: var(--headings-color);
}
.service-block-four {
position: relative;
padding: 40px 25px 35px 40px;
border-radius: 20px;
z-index: 1;
overflow: hidden;
border: 1px solid #DDDDDD;
margin-bottom: 30px;
}
[data-tm-layout=dark] .service-block-four {
border-color: rgba(var(--theme-color-white-rgb), 0.1);
}
.service-block-four:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
opacity: 0;
z-index: -1;
visibility: hidden;
-webkit-transform: scaleY(0);
transform: scaleY(0);
-webkit-transform-origin: top;
transform-origin: top;
background: var(--theme-color2);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.service-block-four .icon {
line-height: 1;
}
.service-block-four .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
font-size: 60px;
display: inline-block;
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.service-block-four .content {
margin-top: 30px;
}
.service-block-four .content .title {
font-weight: 700;
font-size: 24px;
line-height: 30px;
text-transform: capitalize;
margin-bottom: 10px;
}
.service-block-four .content .title a {
color: var(--headings-color);
}
.service-block-four .content .text {
color: var(--text-color);
font-family: var(--heading-font-family);
font-weight: 400;
font-size: 16px;
line-height: 30px;
margin-bottom: 30px;
}
.service-block-four .content .link-btn {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
font-family: var(--heading-font-family);
font-weight: 500;
font-size: 15px;
line-height: 20px;
text-align: center;
text-transform: uppercase;
}
.service-block-four:hover {
border-color: var(--theme-color2);
}
.service-block-four:hover:before {
opacity: 1;
visibility: visible;
-webkit-transform: scaleY(1);
transform: scaleY(1);
}
.service-block-four:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.service-block-four:hover .content .title a {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .service-block-four:hover .content .title a {
color: #ffffff;
}
.service-block-four:hover .content .title a:hover {
color: var(--theme-color1);
}
.service-block-four:hover .content .text {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .service-block-four:hover .content .text {
color: #ffffff;
}
.service-block-four:hover .content .link-btn {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .service-block-four:hover .content .link-btn {
color: #ffffff;
}
.service-block-four:hover .content .link-btn svg path {
fill: var(--theme-color-white);
}
[data-tm-layout=dark] .service-block-four:hover .content .link-btn svg path {
color: #ffffff;
}
/***
====================================================================
Map Section
====================================================================
***/
/***
====================================================================
Case Section
====================================================================
***/
.case-section {
position: relative;
z-index: 9;
}
[data-tm-layout=dark] .case-section .case-title-box .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .case-section .case-title-box .btn-style-two .icon {
background-color: #ffffff;
}
.case-block-one .inner-box {
max-width: 743px;
width: 100%;
height: 500px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 40px 50px 32px;
border-radius: 30px;
}
.case-block-one .inner-box:hover .content .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.case-block-one .inner-box:hover .content .icon:hover {
background-position: 100% 0;
}
.case-block-one .inner-box .case-title {
font-weight: 600;
font-size: 32px;
line-height: 40px;
color: var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .case-block-one .inner-box .case-title {
color: #ffffff;
}
@media (max-width: 991.98px) {
.case-block-one .inner-box .case-title {
font-size: 24px;
line-height: 34px;
}
}
.case-block-one .inner-box .case-title:hover {
color: var(--theme-color1);
}
.case-block-one .inner-box .content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.case-block-one .inner-box .content .sl-number {
font-family: var(--heading-font-family);
font-weight: 700;
font-size: 82px;
line-height: 98.4px;
color: var(--theme-color-white);
font-size: clamp(36px, 4.27vw, 82px);
line-height: 1.2;
}
[data-tm-layout=dark] .case-block-one .inner-box .content .sl-number {
color: #ffffff;
}
.case-block-one .inner-box .content .icon {
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
border-radius: 50%;
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
color: var(--headings-color);
background: var(--theme-color-white);
-webkit-transition: all 800ms ease;
transition: all 800ms ease;
}
[data-tm-layout=dark] .case-block-one .inner-box .content .icon {
color: #ffffff;
}
.case-section-three {
overflow: hidden;
position: relative;
z-index: 1;
background-color: var(--theme-color2);
}
.case-section-three .sec-shape {
position: absolute;
z-index: -1;
top: 10px;
left: 0;
}
@media (max-width: 1199.98px) {
.case-section-three .sec-shape {
display: none;
}
}
.case-section-three .box-shape {
width: 189px;
height: 189px;
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
.case-section-three .box-shape .box1 {
height: 100%;
width: 50%;
background-color: rgba(var(--theme-color-white-rgb), 0.15);
position: absolute;
bottom: 0;
left: 0;
}
.case-section-three .box-shape .box2 {
width: 100%;
height: 50%;
background-color: rgba(var(--theme-color-white-rgb), 0.15);
position: absolute;
bottom: 0;
left: 0;
}
.case-section-three .outer-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (max-width: 1199.98px) {
.case-section-three .outer-box {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.case-section-three .content-column {
width: 48%;
}
@media (max-width: 1199.98px) {
.case-section-three .content-column {
width: 100%;
}
}
.case-section-three .content-column .inner-column {
max-width: 550px;
margin: 60px 120px 60px auto;
}
.case-section-three .content-column .inner-column .text {
font-size: 16px;
line-height: 30px;
font-size: 16px;
line-height: 35px;
font-weight: 400;
text-transform: capitalize;
color: var(--theme-color-white);
font-family: var(--body-font-family);
margin-bottom: 20px;
}
[data-tm-layout=dark] .case-section-three .content-column .inner-column .text {
color: rgba(204, 204, 204, 0.8);
}
.case-section-three .content-column .inner-column .info li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
font-size: 16px;
color: var(--theme-color-white);
font-weight: 500;
font-size: 16px;
line-height: 35px;
text-transform: capitalize;
}
[data-tm-layout=dark] .case-section-three .content-column .inner-column .info li {
color: #ffffff;
}
[data-tm-layout=dark] .case-section-three .content-column .inner-column .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .case-section-three .content-column .inner-column .btn-style-two .icon {
background-color: var(--theme-color1);
}
[data-tm-layout=dark] .case-section-three .content-column .inner-column .btn-style-two:hover .icon {
background-color: #ffffff;
}
@media (max-width: 1199.98px) {
.case-section-three .content-column .inner-column {
margin: 60px 15px;
max-width: 100%;
}
}
.case-section-three .image-column {
width: 52%;
}
@media (max-width: 1199.98px) {
.case-section-three .image-column {
width: 100%;
}
}
.case-block-three {
position: relative;
z-index: 1;
}
.case-block-three .image {
overflow: hidden;
margin-bottom: 0;
}
.case-block-three .image img {
width: 100%;
}
.case-block-three .icon {
width: 50px;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
height: 50px;
line-height: 50px;
opacity: 0;
position: absolute;
right: 30px;
text-align: center;
top: 30px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
visibility: hidden;
z-index: 1;
}
[data-tm-layout=dark] .case-block-three .icon {
color: #ffffff;
}
.case-block-three .icon i {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.case-block-three .icon:hover {
background-position: 100% 0;
}
.case-block-three .icon:hover i {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.case-block-three .content {
position: absolute;
bottom: 40px;
left: 45px;
z-index: 1;
}
.case-block-three .content .title {
padding: 10px 20px;
color: var(--theme-color-white);
background-color: var(--theme-color2);
-webkit-transition: all 300ms ease 100ms;
transition: all 300ms ease 100ms;
font-weight: 700;
font-size: 24px;
line-height: 30px;
text-transform: capitalize;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
margin-bottom: 0;
}
[data-tm-layout=dark] .case-block-three .content .title {
color: #ffffff;
}
.case-block-three .content .sub-title {
display: inline-block;
padding-left: 20px;
padding-right: 30px;
font-family: var(--body-font-family);
font-weight: 400;
font-size: 16px;
line-height: 35px;
text-transform: capitalize;
color: var(--theme-color-black);
background-color: var(--theme-color1);
-webkit-transition: all 300ms ease 300ms;
transition: all 300ms ease 300ms;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
margin-bottom: 0;
}
.case-block-three:hover .icon {
right: 40px;
opacity: 1;
visibility: visible;
}
.case-block-three:hover .content .title,
.case-block-three:hover .content .sub-title {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
/***
====================================================================
Locations Section
====================================================================
***/
/***
====================================================================
FAQ's Sectiom
====================================================================
***/
.faq-left-items-1 .faq-image {
margin-top: 45px;
position: relative;
}
@media (max-width: 767.98px) {
.faq-left-items-1 .faq-image {
margin-top: 30px;
}
}
.faq-left-items-1 .faq-image img {
width: 100%;
height: 100%;
border-radius: 20px;
}
.faq-left-items-1 .faq-image .shape-1 {
position: absolute;
top: 40px;
left: -40px;
}
@media (max-width: 1199.98px) {
.faq-left-items-1 .faq-image .shape-1 {
display: none;
}
}
.faq-left-items-1 .faq-image .shape-2 {
position: absolute;
bottom: 50px;
right: -40px;
}
@media (max-width: 1199.98px) {
.faq-left-items-1 .faq-image .shape-2 {
display: none;
}
}
.faq-content-1 .accordion-box {
position: relative;
}
.faq-content-1 .accordion-box .block {
position: relative;
background-color: transparent;
margin-bottom: 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding-bottom: 25px;
margin-bottom: 25px;
}
[data-tm-layout=dark] .faq-content-1 .accordion-box .block {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.faq-content-1 .accordion-box .block:last-child {
margin-bottom: 0;
}
.faq-content-1 .accordion-box .block .acc-btn {
position: relative;
font-size: 22px;
color: var(--headings-color);
font-weight: 600;
cursor: pointer;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
@media (max-width: 1199.98px) {
.faq-content-1 .accordion-box .block .acc-btn {
font-size: 20px;
}
}
.faq-content-1 .accordion-box .block .acc-btn .icon {
position: absolute;
right: 0;
top: 0;
height: 35px;
font-size: 18px;
line-height: 25px;
color: var(--headings-color);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.faq-content-1 .accordion-box .block .acc-btn.active .icon:before {
content: "\f068";
}
.faq-content-1 .accordion-box .block .acc-content {
position: relative;
display: none;
padding-right: 20px;
margin-top: 10px;
}
.faq-content-1 .accordion-box .block .acc-content .content {
position: relative;
}
.faq-content-1 .accordion-box .block .acc-content .content .text {
display: block;
font-size: 16px;
line-height: 30px;
margin-bottom: 0;
}
.faq-content-1 .accordion-box .block .acc-content.current {
display: block;
}
.faq-section-2 {
position: relative;
margin: 0 30px;
border-radius: 50px;
background-color: #144443;
}
@media (max-width: 1399.98px) {
.faq-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 1199.98px) {
.faq-section-2 {
padding-top: 100px;
}
}
@media (max-width: 991.98px) {
.faq-section-2 {
padding-top: 80px;
}
}
@media (max-width: 767.98px) {
.faq-section-2 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.faq-section-2 .dotted-shape {
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
}
@media (max-width: 1199.98px) {
.faq-section-2 .dotted-shape {
display: none;
}
}
.faq-section-2 .dotted-shape img {
height: 100%;
}
.faq-wrapper-2 .faq-items-wrap {
padding: 120px 80px 100px;
padding-left: 50px;
}
@media (max-width: 1699.98px) {
.faq-wrapper-2 .faq-items-wrap {
padding-left: 25px;
padding-right: 40px;
}
}
@media (max-width: 1399.98px) {
.faq-wrapper-2 .faq-items-wrap {
padding-top: 25px;
padding-left: 0;
padding-right: 0;
}
}
.faq-image-style-3 {
height: 822px;
}
@media (max-width: 1199.98px) {
.faq-image-style-3 {
display: none;
}
}
.faq-image-style-3 img {
border-radius: 50px 0px 0px 0px;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.faq-content-style-3 .sec-title .triangle2 {
border-left-color: #67A19F;
}
.faq-content-style-3 .faq-text {
margin-top: 35px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .faq-content-style-3 .faq-text {
color: rgba(204, 204, 204, 0.8);
}
.faq-content-style-3 .theme-btn {
margin-top: 40px;
position: relative;
}
.faq-content-style-3 .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
[data-tm-layout=dark] .faq-content-style-3 .theme-btn.btn-style-one {
color: var(--headings-color);
}
@media only screen and (max-width: 767px) {
.faq-content-style-3 .theme-btn.btn-style-one {
padding-right: 80px;
height: 60px;
}
.faq-content-style-3 .theme-btn.btn-style-one .icon {
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
width: 40px;
}
.faq-content-style-3 .theme-btn.btn-style-one .icon svg {
height: 15px;
width: 15px;
}
}
@media (max-width: 575.98px) {
.faq-content-style-3 .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.faq-content-style-3 .theme-btn.btn-style-one:before {
display: none;
}
.faq-content-style-3 .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.faq-content-style-3 .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .faq-content-style-3 .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.faq-content-style-3 .theme-btn .icon {
background-color: var(--theme-color-white);
border-radius: 50%;
bottom: 4px;
color: var(--theme-color-black);
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
width: 62px;
}
[data-tm-layout=dark] .faq-content-style-3 .theme-btn .icon {
color: var(--headings-color);
}
.faq-accordion-style-3 .accordion .accordion-item {
border: none;
border-radius: 10px;
margin-bottom: 20px;
overflow: hidden;
}
[data-tm-layout=dark] .faq-accordion-style-3 .accordion .accordion-item {
-webkit-box-shadow: 0px 4.4px 20px -1px rgba(19, 16, 34, 0.0509803922);
box-shadow: 0px 4.4px 20px -1px rgba(19, 16, 34, 0.0509803922);
}
.faq-accordion-style-3 .accordion .accordion-item .accordion-header button {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-box-shadow: none;
box-shadow: none;
border-radius: 0 !important;
color: var(--theme-color-white);
font-family: var(--heading-font-family);
font-size: 18px;
font-weight: 700;
line-height: 30px;
padding: 17px 30px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .faq-accordion-style-3 .accordion .accordion-item .accordion-header button {
color: #ffffff;
}
.faq-accordion-style-3 .accordion .accordion-item .accordion-body {
padding: 20px;
background: #efefef;
}
.faq-accordion-style-3 .accordion .accordion-item .accordion-body .text p{
font-size: 16px;
line-height: 30px;
margin: 0;
color: #000;
}
.faq-accordion-style-3 .accordion .accordion-item:hover .accordion-header button {
background-position: 100% 0;
}
.faq-accordion-style-3 .accordion .accordion-button::after {
display: none;
}
.faq-accordion-style-3 .accordion .accordion-button::before {
position: absolute;
content: "\f105";
font-family: "Font Awesome 6 Pro";
font-weight: 700;
top: 15px;
right: 15px;
font-size: 16px;
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 0px;
color: var(--theme-color-white);
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
[data-tm-layout=dark] .faq-accordion-style-3 .accordion .accordion-button::before {
color: #ffffff;
}
.faq-accordion-style-3 .accordion .accordion-button.collapsed {
color: var(--theme-color-white);
}
.faq-accordion-style-3 .accordion .accordion-button.collapsed::before {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
[data-tm-layout=dark] .faq-accordion-style-3 .accordion .accordion-button.collapsed {
color: #ffffff;
}
.faq-left-items-2 .faq-image img {
border-radius: 30px;
}
.faq-left-items-2 .info-box {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
gap: 10px;
margin: 0px 50px;
position: relative;
-webkit-transform: translateY(-40%);
transform: translateY(-40%);
width: 100%;
}
@media (max-width: 575.98px) {
.faq-left-items-2 .info-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0;
margin-top: 30px;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.faq-left-items-2 .info-box .icon-box {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
border-radius: 10px;
color: var(--theme-color-white);
height: 110px;
line-height: 130px;
text-align: center;
width: 110px;
}
.faq-left-items-2 .info-box .icon-box .icon {
color: var(--theme-color-white);
font-size: 50px;
}
.faq-left-items-2 .info-box:hover .icon-box {
background-position: 100% 0;
}
.faq-left-items-2 .info-box .content-box {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 17px;
border-radius: 10px;
padding: 20px;
padding-right: 30px;
background-color: var(--theme-color-white);
-webkit-box-shadow: 0px 4px 10px 0px #E2CCCC;
box-shadow: 0px 4px 10px 0px #E2CCCC;
}
[data-tm-layout=dark] .faq-left-items-2 .info-box .content-box {
background-color: var(--theme-color2);
-webkit-box-shadow: none;
box-shadow: none;
}
.faq-left-items-2 .info-box .content-box .content-icon {
width: 68px;
height: 68px;
line-height: 48px;
text-align: center;
border-radius: 50%;
border: 10px solid rgba(106, 111, 120, 0.1);
}
.faq-left-items-2 .info-box .content-box .content-icon .icon {
font-size: 20px;
width: 100%;
height: 100%;
display: inline-block;
border-radius: 50%;
color: var(--theme-color-white);
background: var(--theme-color2);
}
[data-tm-layout=dark] .faq-left-items-2 .info-box .content-box .content-icon .icon {
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
.faq-left-items-2 .info-box .content-box .content .content-title {
font-weight: 700;
font-size: 18px;
line-height: 100%;
text-transform: capitalize;
margin-bottom: 10px;
color: var(--headings-color);
}
.faq-left-items-2 .info-box .content-box .content .content-text {
font-weight: 400;
font-size: 14px;
line-height: 24px;
color: #6A6F78;
display: block;
}
.faq-section-three {
position: relative;
margin: 0px 30px;
padding: 120px 0px 160px;
border-radius: 30px;
margin-bottom: -80px;
background-color: #F5F5F5;
}
[data-tm-layout=dark] .faq-section-three {
background-color: var(--dark-color2);
}
@media (max-width: 1199.98px) {
.faq-section-three {
margin: 0;
margin-bottom: -80px;
}
}
.faq-section-three .bg-layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.3;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.faq-section-three .faq-content-1 .accordion {
position: relative;
overflow: hidden;
padding: 0;
border-radius: 10px;
border: 1px solid rgb(var(--theme-color-black-rgb), 0.1);
}
.faq-section-three .faq-content-1 .accordion .acc-btn {
position: relative;
font-family: var(--heading-font-family);
font-weight: 700;
font-size: 18px;
line-height: 100%;
padding: 20px 30px;
padding-right: 50px;
text-transform: capitalize;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.faq-section-three .faq-content-1 .accordion .acc-btn .arrow-icon {
position: absolute;
top: 20px;
right: 30px;
}
.faq-section-three .faq-content-1 .accordion.active-block .acc-btn {
color: var(--theme-color-light);
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.faq-section-three .faq-content-1 .accordion.active-block .acc-btn .arrow-icon {
color: var(--theme-color-light);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.faq-section-three .faq-content-1 .accordion.active-block .acc-btn:hover {
background-position: 100% 0;
}
.faq-section-three .faq-content-1 .accordion .acc-content {
margin: 0;
padding: 0;
}
.faq-section-three .faq-content-1 .accordion .acc-content .content {
padding: 20px 30px;
}
/***
====================================================================
Work Section
====================================================================
***/
/***
====================================================================
Work Section
====================================================================
***/
.how-it-work-wrapper {
border: 1px dashed #d9d9d9;
border-radius: 15px;
padding-top: 40px;
padding-bottom: 60px;
margin-top: 60px;
}
[data-tm-layout=dark] .how-it-work-wrapper {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.how-it-work-wrapper.border-none {
position: relative;
border: none;
padding: 0;
margin: 0;
}
.how-it-work-wrapper.border-none::before {
position: absolute;
top: 80px;
left: 0;
width: 100%;
height: 1px;
content: "";
background-color: rgb(var(--theme-color-black-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.how-it-work-wrapper.border-none::before {
display: none;
}
}
[data-tm-layout=dark] .how-it-work-wrapper.border-none::before {
background-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 767.98px) {
.how-it-work-wrapper {
margin-top: 30px;
}
}
.how-it-work-items-style-3 {
padding: 30px;
padding-bottom: 0;
border-right: 1px solid #d9d9d9;
}
[data-tm-layout=dark] .how-it-work-items-style-3 {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.how-it-work-items-style-3.style-2 {
position: relative;
padding: 0;
border: none;
margin-bottom: 30px;
}
.how-it-work-items-style-3.style-2::before {
position: absolute;
top: 80px;
left: 0;
width: 5px;
height: 5px;
content: "";
-webkit-transform: translateY(-2px);
transform: translateY(-2px);
background-color: var(--theme-color-black);
}
[data-tm-layout=dark] .how-it-work-items-style-3.style-2::before {
background-color: #ffffff;
}
.how-it-work-items-style-3.style-2::after {
position: absolute;
top: 80px;
left: 0;
width: 100%;
height: 1px;
content: "";
display: none;
background-color: rgb(var(--theme-color-black-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.how-it-work-items-style-3.style-2::after {
display: block;
}
}
.how-it-work-items-style-3 .number {
font-size: 66px;
font-weight: 700;
line-height: 66px;
margin-bottom: 30px;
color: transparent;
-webkit-text-stroke: 1px var(--headings-color);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .how-it-work-items-style-3 .number {
-webkit-text-stroke: 1px rgb(var(--theme-color-white-rgb), 0.2);
}
.how-it-work-items-style-3 .title {
margin-bottom: 10px;
font-size: 24px;
}
.how-it-work-items-style-3:hover .number {
color: var(--headings-color);
}
.how-it-work-items-style-3.border-none {
border-right: none;
}
.how-sec-text {
font-size: 20px;
font-weight: bold;
text-align: center;
}
.how-sec-text a {
color: #0C6460;
text-decoration: underline;
}
[data-tm-layout=dark] .how-sec-text a {
text-decoration: none;
color: var(--theme-color1);
}
.how-it-work-section {
position: relative;
z-index: 9;
}
.how-it-work-section .sec-title .title {
max-width: 750px;
width: 100%;
margin: 0 auto;
}
.how-it-work-section .circle-shape {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 0;
z-index: -1;
}
@media (max-width: 1399.98px) {
.how-it-work-section .circle-shape {
display: none;
}
}
.how-it-work-section.gray-bg {
position: relative;
margin: 0px 30px;
padding-top: 210px;
margin-top: -90px;
border-radius: 0 0 30px 30px;
background-color: #F6F5EF;
}
@media (max-width: 767.98px) {
.how-it-work-section.gray-bg {
margin: 0;
padding-top: 120px;
}
}
[data-tm-layout=dark] .how-it-work-section.gray-bg {
background-color: var(--dark-color2);
}
/***
====================================================================
Fun Fact Section
====================================================================
***/
.counter-section {
position: relative;
}
.counter-section.theme-color-bg {
background-color: var(--theme-color2);
}
.counter-section .counter-wrapper2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 70px;
margin: 0px 50px;
border-bottom: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
font-size: 50px;
}
@media (max-width: 1199.98px) {
.counter-section .counter-wrapper2 {
margin: 0;
}
}
@media (max-width: 991.98px) {
.counter-section .counter-wrapper2 {
gap: 30px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.counter-section .counter-wrapper2 .icon-box {
font-size: 60px;
background: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.counter-block-one {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
max-width: 30%;
width: 100%;
}
@media (max-width: 991.98px) {
.counter-block-one {
max-width: 47%;
}
}
@media (max-width: 575.98px) {
.counter-block-one {
max-width: 100%;
}
}
.counter-block-one::before {
position: absolute;
top: 0;
right: 0;
content: "";
width: 15px;
height: 15px;
background: -webkit-gradient(linear, left top, left bottom, from(#85A6A6), to(#A68585));
background: linear-gradient(180deg, #85A6A6 0%, #A68585 100%);
clip-path: polygon(0 0, 100% 100%, 100% 0);
}
.counter-block-one .count-box .counter {
font-size: 48px;
font-weight: 700;
line-height: 57.6px;
font-family: var(--heading-font-family);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .counter-block-one .count-box .counter {
color: #ffffff;
}
.counter-block-one .count-box .counter-title {
font-size: 16px;
line-height: 30px;
font-weight: 400;
font-family: var(--heading-font-family);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .counter-block-one .count-box .counter-title {
color: #ffffff;
}
.counter-section .separator {
width: 1px;
height: 108px;
background: #D2D2D2;
}
@media (max-width: 991.98px) {
.counter-section .separator {
display: none;
}
}
.counter-box-one {
position: relative;
text-align: center;
}
.counter-box-one h2 {
font-size: 96px;
font-weight: 400;
margin-bottom: 0;
}
.counter-box-one p {
font-size: 18px;
font-weight: 500;
max-width: 140px;
line-height: 133%;
margin: 0 auto;
color: #144443;
}
[data-tm-layout=dark] .counter-box-one p {
color: #ffffff;
}
/***
====================================================================
Marquee Section
====================================================================
***/
.marquee {
position: relative;
--duration: 50s;
--gap: 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
gap: 0;
}
.marquee.slide-right {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.marquee.slide-right .text {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.marquee.slide-right .stroke-text {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.marquee .marquee-group {
-ms-flex-negative: 0;
flex-shrink: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: space-around;
gap: 0;
min-width: 100%;
-webkit-animation: scroll var(--duration) linear infinite;
animation: scroll var(--duration) linear infinite;
}
@media (max-width: 1899.98px) {
.marquee .marquee-group {
gap: 30px;
}
}
.marquee .text {
font-size: 48px;
line-height: 1.3;
font-weight: 600;
text-transform: capitalize;
margin: 0 30px;
position: relative;
color: var(--headings-color);
-webkit-text-stroke: 1px var(--headings-color);
}
.marquee .text img{width: 100px}
.marquee .stroke-text {
font-size: 48px;
line-height: 1.3;
font-weight: 600;
text-transform: capitalize;
margin: 0 30px;
position: relative;
color: transparent;
-webkit-text-stroke: 1px #B4B4B4;
}
@-webkit-keyframes scroll {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
-webkit-transform: translateX(calc(-100% - var(--gap)));
transform: translateX(calc(-100% - var(--gap)));
}
}
@keyframes scroll {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
-webkit-transform: translateX(calc(-100% - var(--gap)));
transform: translateX(calc(-100% - var(--gap)));
}
}
.marquee-section-2 {
border-top: 1px solid rgba(0, 0, 0, 0.2);
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding: 45px 0;
}
[data-tm-layout=dark] .marquee-section-2 {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
/***
====================================================================
Project Section
====================================================================
***/
.project-card-items {
margin-top: 30px;
}
.project-card-items .project-image {
position: relative;
z-index: 2;
overflow: hidden;
width: 100%;
border-radius: 20px;
}
.project-card-items .project-image img {
width: 100%;
height: 100%;
display: block;
border-radius: 20px;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.project-card-items .project-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.project-card-items .project-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.project-card-items .project-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.project-card-items .project-image .project-layer-wrapper {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image {
width: 25%;
height: 100%;
-webkit-transition: 0.5s;
transition: 0.5s;
background-size: cover;
border-radius: 20px;
position: relative;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 20px;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 68, 67, 0)), to(#144443));
background: linear-gradient(180deg, rgba(20, 68, 67, 0) 0%, #144443 100%);
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(1) {
background-position: 0;
-webkit-transition-delay: 0;
transition-delay: 0;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(1)::before {
border-bottom-right-radius: 20px !important;
border-bottom-left-radius: 20px !important;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(2) {
background-position: 33.33%;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
border-radius: 0 !important;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(2)::before {
border-radius: 0 !important;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(3) {
background-position: 66.66%;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
border-radius: 0 !important;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(3)::before {
border-radius: 0 !important;
}
.project-card-items .project-image .project-layer-wrapper .project-layer-image:nth-child(4) {
background-position: 100%;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.project-card-items .project-image::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 20px;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 68, 67, 0)), to(#144443));
background: linear-gradient(180deg, rgba(20, 68, 67, 0) 0%, #144443 100%);
z-index: 9;
}
.project-card-items .project-image .number {
font-size: 96px;
font-weight: 700;
color: transparent;
-webkit-text-stroke: 1px #fff;
position: absolute;
bottom: 60px;
left: 60px;
}
.project-card-items .project-content {
padding: 25px;
background-color: var(--theme-color-white);
margin-left: 50px;
margin-right: 50px;
margin-top: -70px;
position: relative;
z-index: 9;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding-top: 30px;
padding-bottom: 35px;
position: relative;
}
[data-tm-layout=dark] .project-card-items .project-content {
background-color: var(--dark-color2);
}
.project-card-items .project-content .arrow-shape {
position: absolute;
top: 8%;
left: 50%;
display: none;
}
.project-card-items .project-content::before {
position: absolute;
bottom: 0;
left: 0;
right: 0;
content: "";
width: 100%;
height: 5px;
border-radius: 20px;
background: -webkit-gradient(linear, left top, right top, color-stop(0.58%, #C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0.58%, #039397 100%);
}
.project-card-items .project-content h3 {
line-height: 1;
}
.project-card-items .project-content h3 a {
color: var(--headings-color);
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.project-card-items .project-content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--headings-color)), to(var(--headings-color)));
background-image: linear-gradient(180deg, var(--headings-color) 0%, var(--headings-color) 100%);
}
.project-card-items .project-content .icon {
width: 60px;
height: 60px;
line-height: 60px;
display: inline-block;
border-radius: 10px;
background: #144443;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
text-align: center;
font-size: 30px;
color: var(--theme-color-white);
}
.project-card-items .project-content .icon i {
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
display: inline-block;
}
.project-card-items .project-content .icon:hover {
background: var(--gradient-1);
color: var(--theme-color-white);
}
.project-card-items .project-content .icon:hover i {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
.project-card-items:hover .project-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.project-card-items:hover .project-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.project-wrapper {
margin-right: -35%;
}
@media (max-width: 767.98px) {
.project-wrapper {
margin-right: 0;
}
}
.project-section {
position: relative;
}
.project-section .shape-1 {
position: absolute;
top: 39%;
left: 5%;
}
@media (max-width: 1199.98px) {
.project-section .shape-1 {
display: none;
}
}
.project-section .shape-2 {
position: absolute;
left: 0;
bottom: 15%;
}
@media (max-width: 1199.98px) {
.project-section .shape-2 {
display: none;
}
}
@media (max-width: 991.98px) {
.project-section .array-button {
-webkit-box-pack: start !important;
-ms-flex-pack: start !important;
justify-content: start !important;
}
}
.project-wrapper-2 {
margin-left: -10%;
margin-right: -10%;
}
@media (max-width: 991.98px) {
.project-wrapper-2 {
margin-left: 0;
margin-right: 0;
}
}
.project-box-items-2 {
margin-top: 30px;
border-radius: 10px;
border: 1px solid #EBEBEB;
padding: 30px 24px;
}
[data-tm-layout=dark] .project-box-items-2 {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.project-box-items-2 .project-image {
position: relative;
overflow: hidden;
border-radius: 10px 10px 0px 0px;
}
.project-box-items-2 .project-image::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 10px 10px 0px 0px;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 68, 67, 0)), to(#144443));
background: linear-gradient(180deg, rgba(20, 68, 67, 0) 0%, #144443 100%);
z-index: 9;
}
.project-box-items-2 .project-image img {
width: 100%;
height: 100%;
border-radius: 10px 10px 0px 0px;
}
.project-box-items-2 .project-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.project-box-items-2 .project-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.project-box-items-2 .project-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.project-box-items-2 .project-image .shape-1 {
position: absolute;
bottom: 0;
right: 20px;
}
.project-box-items-2 .project-image .project-content {
position: absolute;
bottom: 40px;
left: 40px;
z-index: 9;
}
.project-box-items-2 .project-image .project-content h3 {
line-height: 1;
}
.project-box-items-2 .project-image .project-content h3 a {
color: #fff;
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.project-box-items-2 .project-image .project-content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff));
background-image: linear-gradient(180deg, #fff 0%, #fff 100%);
}
.project-box-items-2 .project-image .project-content p {
color: #fff;
}
.project-box-items-2 .project-image .project-layer-wrapper {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image {
width: 25%;
height: 100%;
-webkit-transition: 0.5s;
transition: 0.5s;
background-size: cover;
border-radius: 10px 10px 0px 0px;
position: relative;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 10px 10px 0px 0px;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(20, 68, 67, 0)), to(#144443));
background: linear-gradient(180deg, rgba(20, 68, 67, 0) 0%, #144443 100%);
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(1) {
background-position: 0;
-webkit-transition-delay: 0;
transition-delay: 0;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(2) {
background-position: 33.33%;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
border-radius: 0 !important;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(2)::before {
border-radius: 0 !important;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(3) {
background-position: 66.66%;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
border-radius: 0 !important;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(3)::before {
border-radius: 0 !important;
}
.project-box-items-2 .project-image .project-layer-wrapper .project-layer-image:nth-child(4) {
background-position: 100%;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.project-box-items-2 .theme-btn {
position: relative;
}
.project-box-items-2 .theme-btn.btn-style-one {
padding: 26px 22px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 60px;
border-radius: 0px 10px 10px 0px;
background: #C8F169;
color: var(--headings-color);
padding-right: 85px;
}
[data-tm-layout=dark] .project-box-items-2 .theme-btn.btn-style-one {
color: var(--theme-color2);
}
.project-box-items-2 .theme-btn.btn-style-one::before {
z-index: -1;
background-color: var(--headings-color);
}
.project-box-items-2 .theme-btn.btn-style-one:hover {
color: #fff;
}
[data-tm-layout=dark] .project-box-items-2 .theme-btn.btn-style-one:hover {
color: var(--theme-color2);
}
.project-box-items-2 .theme-btn .icon {
width: 52px;
height: 52px;
line-height: 56px;
border-radius: 10px;
background: #144443;
position: absolute;
right: 4px;
top: 4px;
bottom: 4px;
font-size: 28px;
color: var(--theme-color-white);
}
.project-box-items-2 .theme-btn .icon i {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
display: inline-block;
}
.project-box-items-2:hover .project-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.project-box-items-2:hover .project-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.project-wrapper-4 {
padding: 0 30px;
}
@media (max-width: 1399.98px) {
.project-wrapper-4 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.project-wrapper-4 {
padding-left: 18px;
padding-right: 18px;
}
}
.project-image-4 {
margin-top: 30px;
overflow: hidden;
position: relative;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
z-index: 9;
}
.project-image-4::before {
top: 0;
left: 0;
height: 100%;
width: 100%;
-webkit-transform: scale(0.7);
transform: scale(0.7);
content: "";
position: absolute;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.42%, #C8F169), color-stop(98.86%, #039397));
background: linear-gradient(180deg, #C8F169 1.42%, #039397 98.86%);
-webkit-transition: 0.5s;
transition: 0.5s;
opacity: 0;
visibility: hidden;
}
.project-image-4 img {
width: 100%;
height: 100%;
}
.project-image-4 .title {
font-size: 24px;
font-weight: 700;
position: absolute;
left: 50px;
right: 50px;
bottom: -50px;
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
color: #fff;
}
.project-image-4 .title a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.project-image-4 .title a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--theme-color-white)), to(var(--theme-color-white)));
background-image: linear-gradient(180deg, var(--theme-color-white) 0%, var(--theme-color-white) 100%);
}
.project-image-4:hover .title {
bottom: 50px;
opacity: 1;
visibility: visible;
}
.project-image-4:hover::before {
opacity: 0.7;
-webkit-transform: scale(1);
transform: scale(1);
visibility: visible;
}
.project-section-4 .nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 25px;
}
.project-section-4 .nav .nav-item .nav-link {
background: var(--theme-color-white);
-webkit-box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.05);
border-radius: 10px;
color: var(--headings-color);
font-size: 16px;
font-weight: 500;
font-family: var(--heading-font-family);
}
.project-section-4 .nav .nav-item .nav-link.active {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.project-section-4 .nav .nav-item .nav-link.active:hover {
background-position: 100% 0;
}
/***
====================================================================
Project Section
====================================================================
***/
.ks-project-area {
overflow: hidden;
padding-top: 110px;
padding-bottom: 120px;
}
.ks-project-subtitle {
font-weight: 600;
font-size: 14px;
line-height: 28px;
margin-bottom: 10px;
display: block;
text-transform: uppercase;
color: var(--headings-color);
}
@media (max-width: 767.98px) {
.ks-project-subtitle br {
display: none;
}
}
.ks-project-title {
font-weight: 600;
font-size: 32px;
line-height: 40px;
font-family: var(--heading-font-family);
max-width: 255px;
margin-bottom: 20px;
}
@media (max-width: 1199.98px) {
.ks-project-title {
font-size: 28px;
line-height: 36px;
}
}
@media (max-width: 991.98px) {
.ks-project-title {
font-size: 24px;
line-height: 32px;
}
}
@media (max-width: 767.98px) {
.ks-project-title {
font-size: 20px;
line-height: 32px;
}
.ks-project-title br {
display: none;
}
}
.ks-project-text {
font-weight: 400;
font-size: 16px;
line-height: 30px;
color: var(--text-color);
margin-bottom: 25px;
}
@media (max-width: 767.98px) {
.ks-project-text br {
display: none;
}
}
.ks-project-thumb img {
border-radius: 20px;
}
.ks-project-item {
position: relative;
margin-bottom: 80px;
border-radius: 50px;
}
.ks-project-item:last-child {
margin-bottom: 0;
}
.ks-project-btn a:first-child {
margin-right: 10px;
}
.ks-project-content-wrap {
margin: 50px;
display: inline-block;
padding: 54px 80px 55px 60px;
z-index: 1;
overflow: hidden;
cursor: pointer;
max-width: 488px;
width: 100%;
position: relative;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1199.98px) {
.ks-project-content-wrap {
padding: 45px;
}
}
@media (max-width: 767.98px) {
.ks-project-content-wrap {
padding: 30px 15px;
margin: 35px 20px;
}
}
@media (min-width: 576px) and (max-width: 767.98px) {
.ks-project-content-wrap {
margin: 45px;
padding: 50px 40px;
}
}
.ks-project-content-wrap::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
z-index: -1;
border-radius: 50px;
background-color: var(--theme-color-white);
-webkit-mask-image: url(../images/home-5/shape/mask.png);
-webkit-mask-size: cover;
-webkit-mask-position: top right;
-webkit-mask-repeat: no-repeat;
}
@media (max-width: 767.98px) {
.ks-project-content-wrap::after {
-webkit-mask-image: unset;
mask-image: unset;
}
}
.ks-project-content-wrap.ks-btn-black {
padding: 16px 35px;
color: var(--theme-color-white);
background-color: var(--gray-color3);
}
@media (max-width: 767.98px) {
.ks-project-content-wrap.ks-btn-black {
padding: 12px 20px;
}
}
.ks-project-content-wrap.ks-btn-black:hover {
color: var(--theme-color-white);
background-color: var(--theme-color-blue);
}
.ks-project-arrow {
position: absolute;
top: 0;
right: 0;
}
@media (max-width: 767.98px) {
.ks-project-arrow {
top: 15px;
right: 15px;
}
}
.ks-project-arrow a {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
display: inline-block;
font-size: 60px;
height: 100px;
line-height: 100px;
overflow: hidden;
position: relative;
text-align: center;
width: 100px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1199.98px) {
.ks-project-arrow a {
font-size: 50px;
height: 85px;
width: 85px;
line-height: 85px;
}
}
@media (max-width: 767.98px) {
.ks-project-arrow a {
font-size: 40px;
height: 55px;
width: 55px;
line-height: 55px;
}
}
.ks-project-arrow a:hover {
background-position: 100% 0;
color: var(--theme-color-white);
}
.ks-project-arrow a:hover::after {
-webkit-transform: scale(1);
transform: scale(1);
}
/***
====================================================================
Testimonial Section
====================================================================
***/
.testimonial-box-items {
margin-top: 30px;
padding: 40px;
padding-top: 0;
position: relative;
}
@media (max-width: 767.98px) {
.testimonial-box-items {
padding: 40px 25px;
padding-top: 0;
}
}
.testimonial-box-items::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 20px;
border: 1px solid #c9c9c9;
background-color: var(--theme-color-white);
z-index: -1;
top: 30px;
height: initial;
}
[data-tm-layout=dark] .testimonial-box-items::before {
border-color: var(--dark-color2);
}
.testimonial-box-items .client-info-items {
border-radius: 20px;
background: #144443;
padding: 15px 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
}
@media (max-width: 767.98px) {
.testimonial-box-items .client-info-items {
padding: 15px 15px;
}
}
.testimonial-box-items .client-info-items .client-image {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.testimonial-box-items .client-info-items .client-image .quote-icon {
width: 60px;
height: 60px;
line-height: 60px;
background-color: var(--theme-color1);
text-align: center;
border-radius: 50%;
margin-left: -15px;
color: var(--headings-color);
}
.testimonial-box-items .client-info-items .client-image img {
width: 60px;
height: 60px;
-o-object-fit: cover;
object-fit: cover;
border-radius: 50%;
}
.testimonial-box-items .client-info-items .client-content h5 {
color: #fff;
font-weight: 700;
line-height: 1;
margin: 0;
}
.testimonial-box-items .client-info-items .client-content span {
font-size: 12px;
line-height: 1;
display: inline-block;
color: #fff;
}
.testimonial-box-items .testimonial-content {
margin-top: 24px;
}
.testimonial-box-items .testimonial-content .star {
font-size: 12px;
color: #ffc65e;
margin-bottom: 10px;
}
.testimonial-box-items .testimonial-content p {
font-size: 18px;
line-height: 195%;
}
.testimonial-wrapper-2 {
margin-left: -20%;
margin-right: -9%;
}
@media (max-width: 1199.98px) {
.testimonial-wrapper-2 {
margin-left: 0;
margin-right: 0;
}
}
.testimonial-card-item {
background-color: #fff;
border: 1px solid #c9c9c9;
border-radius: 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
margin-top: 30px;
gap: 30px;
z-index: 9;
}
[data-tm-layout=dark] .testimonial-card-item {
border-color: transparent;
background-color: var(--dark-color2);
}
@media (max-width: 1199.98px) {
.testimonial-card-item {
display: block;
text-align: center;
}
}
.testimonial-card-item .box-shape {
position: absolute;
bottom: 0;
left: 60px;
z-index: 1;
}
.testimonial-card-item .client-item {
text-align: center;
position: relative;
padding: 60px 35px;
background-color: #144443;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}
@media (max-width: 1199.98px) {
.testimonial-card-item .client-item {
padding: 30px;
border-top-right-radius: 20px;
border-bottom-left-radius: 0;
}
}
.testimonial-card-item .client-item .client-image {
position: relative;
height: 80px;
width: 80px;
margin: 0 auto;
z-index: 9;
}
.testimonial-card-item .client-item .client-image::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
content: "";
width: 90px;
height: 90px;
border-radius: 50%;
border: 1px dashed var(--theme-color1);
}
.testimonial-card-item .client-item .client-image img {
border-radius: 50%;
-o-object-fit: cover;
object-fit: cover;
}
.testimonial-card-item .client-item .info-text {
margin-top: 30px;
z-index: 9;
}
@media (max-width: 1199.98px) {
.testimonial-card-item .client-item .info-text {
text-align: center;
}
}
.testimonial-card-item .client-item .info-text h5 {
font-size: 18px;
font-weight: 700;
color: #fff;
line-height: 1;
position: relative;
z-index: 9;
}
.testimonial-card-item .client-item .info-text span {
color: #fff;
font-size: 12px;
font-weight: 400;
text-transform: capitalize;
position: relative;
z-index: 9;
}
@media (max-width: 1199.98px) {
.testimonial-card-item .content {
padding: 30px;
}
}
.testimonial-card-item .content .quote-icon {
background: #c8f169;
color: var(--headings-color);
font-size: 30px;
height: 67px;
line-height: 67px;
position: absolute;
text-align: center;
top: -11px;
width: 67px;
}
.testimonial-card-item .content .quote-icon .test-triangle {
position: absolute;
width: 0;
height: 0;
top: 11px;
right: 0px;
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
.testimonial-card-item .content .quote-icon .test-triangle::before {
content: "";
position: absolute;
width: 0;
height: 0;
border-left: 11px solid var(--theme-color1);
border-bottom: 11px solid transparent;
}
.testimonial-card-item .content .star {
color: #ffc65e;
margin-top: 40px;
margin-bottom: 10px;
}
@media (max-width: 1199.98px) {
.testimonial-card-item .content .star {
margin-top: 0;
}
}
.testimonial-card-item .content p {
max-width: 303px;
font-size: 18px;
}
@media (max-width: 1199.98px) {
.testimonial-card-item .content p {
margin: 0 auto;
}
}
@media (max-width: 575.98px) {
.testimonial-card-item .content p {
font-size: 16px;
}
}
.testimonial-card-item.border-none {
border: none;
}
.testimonial-card-item.border-none .client-item {
background: #144443;
}
.testimonial-top-right {
position: relative;
}
@media (max-width: 1199.98px) {
.testimonial-top-right {
display: none;
}
}
.testimonial-top-right .client-1 {
position: absolute;
top: 22%;
left: 12%;
width: 90px;
height: 90px;
}
.testimonial-top-right .client-1 img {
border-radius: 50%;
border: 3px solid solid var(--theme-color-white);
}
@media (max-width: 575.98px) {
.testimonial-top-right .client-1 {
display: none;
}
}
.testimonial-top-right .client-2 {
position: absolute;
top: -17px;
left: 34%;
width: 55px;
height: 55px;
}
.testimonial-top-right .client-2 img {
border-radius: 50%;
border: 1px solid var(--theme-color-white);
}
@media (max-width: 575.98px) {
.testimonial-top-right .client-2 {
display: none;
}
}
.testimonial-top-right .client-3 {
position: absolute;
left: 52%;
top: 22%;
width: 55px;
height: 55px;
}
@media (max-width: 575.98px) {
.testimonial-top-right .client-3 {
display: none;
}
}
.testimonial-top-right .client-3 img {
border-radius: 50%;
border: 1px solid var(--theme-color-white);
}
.testimonial-top-right .client-4 {
position: absolute;
right: 14%;
top: 13%;
width: 53px;
height: 53px;
}
.testimonial-top-right .client-4 img {
border-radius: 50%;
border: 1px solid var(--theme-color-white);
}
@media (max-width: 575.98px) {
.testimonial-top-right .client-4 {
display: none;
}
}
.testimonial-section-2 {
position: relative;
border-radius: 50px;
background: #f5f5f5;
margin: 0 30px;
}
.testimonial-section-2.bg-white {
background-color: var(--dark-color2) !important;
}
@media (max-width: 1399.98px) {
.testimonial-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.testimonial-section-2 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.testimonial-section-3 {
margin: 0 30px;
border-radius: 25px;
background: var(--theme-color-white);
}
@media (max-width: 1399.98px) {
.testimonial-section-3 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.testimonial-section-3 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.testimonial-section-3 .array-button {
position: absolute;
bottom: 0;
right: 0;
z-index: 99;
}
@media (max-width: 1199.98px) {
.testimonial-section-3 .array-button {
position: static;
-webkit-box-pack: center !important;
-ms-flex-pack: center !important;
justify-content: center !important;
margin-top: 30px;
}
}
.testimonial-section-3 .array-button .array-prev,
.testimonial-section-3 .array-button .array-next {
width: 60px;
height: 60px;
line-height: 60px;
text-align: center;
border: none;
font-size: 18px;
}
.testimonial-section-3 .array-button .array-prev {
background: #f1f1f1;
}
[data-tm-layout=dark] .testimonial-section-3 .array-button .array-prev {
background-color: transparent;
border: 1px solid rgba(var(--theme-color-white-rgb), 0.1);
}
.testimonial-section-3 .array-button .array-prev:hover {
background: var(--theme-color1);
color: var(--headings-color);
}
.testimonial-section-3 .array-button .array-next {
background: var(--theme-color1);
}
.testimonial-section-3 .array-button .array-next:hover {
background: var(--headings-color);
color: var(--theme-color-white);
}
.testimonial-wrapper-3 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
max-width: 1240px;
margin: 0 auto;
position: relative;
z-index: 9;
padding-top: 85px;
}
@media (max-width: 1199.98px) {
.testimonial-wrapper-3 {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding-top: 17px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
}
}
.mask-shape-style-3 {
position: absolute;
top: 50%;
left: -5%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1199.98px) {
.mask-shape-style-3 {
display: none;
}
}
.image-box-style-3 {
max-width: 300px;
position: relative;
text-align: center;
z-index: 1;
}
.image-box-style-3 .quate {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
font-size: 32px;
height: 90px;
line-height: 100px;
position: absolute;
right: 5px;
text-align: center;
top: -15px;
width: 90px;
z-index: 9;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.image-box-style-3 .image {
overflow: hidden;
border-radius: 50%;
position: relative;
width: 300px;
height: 300px;
}
.image-box-style-3 .image::after {
background-color: rgba(var(--theme-color-white-rgb), 0.3);
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 0;
opacity: 1;
z-index: 9;
pointer-events: none;
}
.image-box-style-3 .image img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.image-box-style-3 .image .planet-shape {
position: absolute;
bottom: 0;
left: 0;
}
.image-box-style-3 .star {
position: relative;
z-index: 1;
margin: 0 auto;
margin-top: 35px;
border: 1px solid #e1e1e1;
padding: 5px 35px;
border-radius: 30px;
width: 190px;
font-size: 16px;
color: #ff8c22;
}
.image-box-style-3 .star::after {
position: absolute;
top: -14px;
left: 50%;
-webkit-transform: translateX(-50%) rotate(45deg);
transform: translateX(-50%) rotate(45deg);
border-top: 1px solid #e1e1e1;
border-left: 1px solid #e1e1e1;
background-color: var(--theme-color-white);
width: 25px;
height: 25px;
content: "";
}
.image-box-style-3:hover .quate {
background-position: 100% 0;
}
.content-box-style-3 {
max-width: 810px;
}
.content-box-style-3 .text {
font-size: 30px;
line-height: 50px;
font-weight: 500;
padding-bottom: 30px;
margin-bottom: 35px;
border-bottom: 1px solid rgba(24, 24, 94, 0.1);
color: var(--headings-color);
}
[data-tm-layout=dark] .content-box-style-3 .text {
border-color: rgba(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.content-box-style-3 .text {
font-size: 26px;
line-height: 150%;
}
}
@media (max-width: 767.98px) {
.content-box-style-3 .text {
font-size: 23px;
}
}
@media (max-width: 575.98px) {
.content-box-style-3 .text {
font-size: 20px;
}
}
.content-box-style-3 .title span {
font-family: var(--body-font-family);
color: var(--text-color);
font-size: 14px;
font-weight: 400;
}
.testimonial-section-five .title-box {
margin-right: 50px;
}
@media (max-width: 1199.98px) {
.testimonial-section-five .title-box {
margin-right: 0;
}
}
@media (max-width: 1199.98px) {
.testimonial-section-five .title-box .sec-title .title {
font-size: 40px;
}
}
[data-tm-layout=dark] .testimonial-section-five .title-box .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .testimonial-section-five .title-box .btn-style-two .icon {
background-color: #ffffff;
}
.testimonial-section-five .testimonials-outer {
margin-left: -50px;
}
@media (max-width: 1199.98px) {
.testimonial-section-five .testimonials-outer {
margin-left: 0;
}
}
.testimonial-block-five:last-child .inner-box {
margin-bottom: 0;
}
.testimonial-block-five .inner-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 0px;
max-width: 790px;
width: 100%;
border-radius: 20px;
overflow: hidden;
margin-bottom: 30px;
}
@media (max-width: 575.98px) {
.testimonial-block-five .inner-box {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.testimonial-block-five .inner-box .thumb {
position: relative;
margin-bottom: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
max-width: 44%;
width: 100%;
}
@media (max-width: 575.98px) {
.testimonial-block-five .inner-box .thumb {
max-width: 100%;
}
.testimonial-block-five .inner-box .thumb img {
width: 100%;
}
}
.testimonial-block-five .inner-box .thumb img {
-o-object-fit: cover;
object-fit: cover;
height: 100%;
}
.testimonial-block-five .inner-box .thumb .video-btn {
display: inline-block;
width: 45px;
height: 45px;
line-height: 45px;
text-align: center;
border-radius: 50%;
color: var(--headings-color);
background-color: var(--theme-color1);
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.testimonial-block-five .inner-box .content-box {
padding: 40px;
border-radius: 0 20px 20px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border: 1px solid rgba(19, 81, 216, 0.05);
-webkit-box-shadow: 0px 4px 18px 0px rgba(var(--theme-color-black-rgb), 0.05);
box-shadow: 0px 4px 18px 0px rgba(var(--theme-color-black-rgb), 0.05);
}
[data-tm-layout=dark] .testimonial-block-five .inner-box .content-box {
background-color: var(--dark-color2);
border-color: var(--dark-color2);
}
@media (max-width: 575.98px) {
.testimonial-block-five .inner-box .content-box {
padding: 40px 20px;
border-radius: 0 0 20px 20px;
}
}
.testimonial-block-five .inner-box .content-box .logo {
margin-bottom: 20px;
}
[data-tm-layout=dark] .testimonial-block-five .inner-box .content-box .logo img {
-webkit-filter: invert(1);
filter: invert(1);
}
.testimonial-block-five .inner-box .content-box .text {
font-size: 20px;
line-height: 32px;
color: var(--text-color);
}
@media (max-width: 1899.98px) {
.testimonial-block-five .inner-box .content-box .text {
font-size: 16px;
}
}
.testimonial-block-five .inner-box .content-box .info-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
gap: 20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding-top: 15px;
margin-top: 30px;
border-top: 1px solid #EEEFF1;
}
[data-tm-layout=dark] .testimonial-block-five .inner-box .content-box .info-box {
border-color: rgba(var(--theme-color-white-rgb), 0.1);
}
.testimonial-block-five .inner-box .content-box .info-box .user-info .name {
font-size: 18px;
line-height: 16px;
font-weight: 700;
margin-bottom: 0;
}
.testimonial-block-five .inner-box .content-box .info-box .user-info .designation {
font-weight: 400;
font-size: 16px;
line-height: 36px;
color: var(--text-color3);
}
.testimonial-block-five .inner-box .content-box .info-box .rating-info {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 4px;
padding: 5px 15px;
border-radius: 35px;
background-color: var(--theme-color1);
}
.testimonial-block-five .inner-box .content-box .info-box .rating-info .rating {
font-size: 15px;
line-height: 18px;
font-weight: 700;
color: var(--headings-color);
}
.testimonial-block-five .inner-box .content-box .info-box .rating-info .icon {
font-size: 14px;
line-height: 18px;
color: var(--headings-color);
}
/***
====================================================================
Video Section
====================================================================
***/
/***
====================================================================
Why Choose Us
====================================================================
***/
.why-choose-section.section-bg-2 {
position: relative;
z-index: 9;
background-color: var(--theme-color2);
}
.why-choose-section.section-bg-2 .shape-1 {
position: absolute;
bottom: 38px;
right: -51px;
z-index: -1;
}
.why-choose-section.section-bg-2 .why-choose-us-content-1 .tab-content.light .why-choose-list h3 {
color: var(--theme-color-white);
}
.why-choose-section.section-bg-2 .why-choose-us-content-1 .tab-content.light .why-choose-list p {
color: var(--theme-color-white);
}
.why-choose-section.section-bg-2 .why-choose-us-content-1 .tab-content.light .why-choose-list-items .why-list li {
color: var(--theme-color-white);
}
.why-choose-section.section-bg-2 .why-choose-us-content-1 .tab-content.light .text {
color: var(--theme-color-white);
}
@media (max-width: 1199.98px) {
.why-choose-us-wrapper {
padding: 100px 0;
}
}
.why-choose-us-image-1 {
direction: rtl;
max-width: 850px;
position: relative;
width: 100%;
height: 800px;
}
.why-choose-us-image-1 img {
max-width: initial;
}
@media (max-width: 1199.98px) {
.why-choose-us-image-1 img {
width: 100%;
height: 100%;
}
}
.why-choose-us-image-1 .icon-box-items {
position: absolute;
bottom: 0;
right: 0;
background: rgba(154, 154, 154, 0.3);
backdrop-filter: blur(20px);
padding: 35px 35px;
max-width: 340px;
}
@media (max-width: 575.98px) {
.why-choose-us-image-1 .icon-box-items {
padding: 18px 30px;
max-width: 286px;
}
}
.why-choose-us-image-1 .icon-box-items .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
font-size: 50px;
font-size: 50px;
height: 112px;
line-height: 120px;
margin: 0 auto 30px;
text-align: center;
width: 112px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
text-align: center;
}
.why-choose-us-image-1 .icon-box-items h3 {
color: #fff;
font-size: 30px;
font-weight: 500;
line-height: 134%;
font-family: var(--body-font-family);
text-align: center;
}
@media (max-width: 575.98px) {
.why-choose-us-image-1 .icon-box-items h3 {
font-size: 20px;
line-height: 144%;
}
}
.why-choose-us-image-1 .icon-box-items:hover .icon {
background-position: 100% 0;
}
.why-choose-us-content-1 {
margin-left: 60px;
}
@media (max-width: 1399.98px) {
.why-choose-us-content-1 {
margin-left: 30px;
}
}
@media (max-width: 1199.98px) {
.why-choose-us-content-1 {
margin-left: 0;
}
}
.why-choose-us-content-1 .nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 100px;
background: #FFF;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 8px 10px;
margin-top: 45px;
}
[data-tm-layout=dark] .why-choose-us-content-1 .nav {
background-color: #1F4646;
}
@media (max-width: 767.98px) {
.why-choose-us-content-1 .nav {
margin-top: 30px;
border-radius: 20px;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
}
.why-choose-us-content-1 .nav .nav-item .nav-link {
padding: 21px 30px;
font-size: 16px;
font-weight: 500;
color: var(--headings-color);
border-radius: 100px;
line-height: 1;
}
@media (max-width: 1199.98px) {
.why-choose-us-content-1 .nav .nav-item .nav-link {
font-size: 15px;
padding: 18px 20px;
}
}
.why-choose-us-content-1 .nav .nav-item .nav-link.active {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
color: #fff;
}
.why-choose-us-content-1 .nav .nav-item .nav-link.active:hover {
background-position: 100% 0;
}
.why-choose-us-content-1 .why-choose-list {
margin-top: 30px;
}
.why-choose-us-content-1 .why-choose-list h3 {
font-size: 26px;
color: #0B3130;
}
[data-tm-layout=dark] .why-choose-us-content-1 .why-choose-list h3 {
color: #ffffff;
}
.why-choose-us-content-1 .why-choose-list p {
font-size: 18px;
margin-top: 10px;
}
.why-choose-us-content-1 .why-choose-list-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 20px;
}
@media (max-width: 1199.98px) {
.why-choose-us-content-1 .why-choose-list-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 30px;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
}
.why-choose-us-content-1 .why-choose-list-items .why-list li {
font-size: 18px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 20px;
}
@media (max-width: 767.98px) {
.why-choose-us-content-1 .why-choose-list-items .why-list li {
font-size: 16px;
}
}
.why-choose-us-content-1 .why-choose-list-items .why-list li:not(:last-child) {
margin-bottom: 13px;
}
.why-choose-us-content-1 .why-choose-list-items .why-list li .icon {
position: relative;
color: var(--headings-color);
background-color: var(--theme-color1);
width: 22px;
height: 22px;
line-height: 22px;
border-radius: 22px;
font-size: 13px;
text-align: center;
border: 2px solid var(--headings-color);
}
.why-choose-us-content-1 .why-choose-list-items .why-list li .icon::before {
position: absolute;
top: 2px;
right: -4px;
content: "";
background-color: var(--theme-color2);
width: 20px;
height: 20px;
border-radius: 50%;
z-index: -1;
}
.why-choose-us-content-1 .choose-us-progressbar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 60px;
margin-top: 20px;
}
@media (max-width: 1199.98px) {
.why-choose-us-content-1 .choose-us-progressbar {
gap: 30px;
}
}
.why-choose-us-content-1 .progress-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.why-choose-us-content-1 .circular-progress {
position: relative;
width: 150px;
height: 150px;
background: conic-gradient(#C8F169 0deg, #D4D4D4 0deg);
border-radius: 50%;
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;
}
.why-choose-us-content-1 .circular-progress::before {
content: "";
position: absolute;
width: 120px;
height: 120px;
background: #fff;
border-radius: 50%;
}
[data-tm-layout=dark] .why-choose-us-content-1 .circular-progress::before {
background: var(--theme-color2);
}
.why-choose-us-content-1 .progress-value {
position: absolute;
font-size: 26px;
font-weight: 600;
color: #0B3130;
font-family: var(--heading-font-family);
}
[data-tm-layout=dark] .why-choose-us-content-1 .progress-value {
color: #ffffff;
}
.why-choose-us-content-1 .text {
margin-top: 10px;
font-size: 18px;
font-weight: 500;
color: #0B3130;
}
[data-tm-layout=dark] .why-choose-us-content-1 .text {
color: #ffffff;
}
.why-choose-section-2 {
position: relative;
margin: 0 30px;
border-radius: 50px;
z-index: 9;
}
@media (max-width: 1399.98px) {
.why-choose-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.why-choose-section-2 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.why-choose-section-2 .circle-shape {
position: absolute;
bottom: 170px;
right: 0;
}
@media (max-width: 1399.98px) {
.why-choose-section-2 .circle-shape {
display: none;
}
}
.why-choose-section-2::before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
border-radius: 50px;
background: -webkit-gradient(linear, left top, right top, from(rgba(20, 68, 67, 0)), color-stop(14%, rgba(20, 68, 67, 0.8)), color-stop(30%, rgba(20, 68, 67, 0.96)), to(#144443));
background: linear-gradient(90deg, rgba(20, 68, 67, 0) 0%, rgba(20, 68, 67, 0.8) 14%, rgba(20, 68, 67, 0.96) 30%, #144443 100%);
z-index: -1;
}
@media (max-width: 1399.98px) {
.why-choose-us-wrapper-2 {
padding-bottom: 120px;
}
}
@media (max-width: 1199.98px) {
.why-choose-us-wrapper-2 {
padding-bottom: 100px;
}
}
@media (max-width: 991.98px) {
.why-choose-us-wrapper-2 {
padding-bottom: 80px;
}
}
.why-choose-us-wrapper-2 .sec-title .triangle2 {
border-left-color: #67A19F;
}
@media (max-width: 1199.98px) {
.service-imagestyle-3 {
display: none;
}
}
.service-imagestyle-3 img {
width: 100%;
height: 100%;
border-radius: 10px;
}
.choose-us-image-2 {
width: 560px;
margin-left: -155px;
}
@media (max-width: 1699.98px) {
.choose-us-image-2 {
margin-left: -70px;
}
}
@media (max-width: 1399.98px) {
.choose-us-image-2 {
width: 515px;
margin-left: -50px;
}
}
@media (max-width: 1199.98px) {
.choose-us-image-2 {
display: none;
}
}
.choose-us-image-2 img {
width: 100%;
height: 100%;
}
.choose-us-content-2 {
margin-left: 40px;
}
@media (max-width: 1699.98px) {
.choose-us-content-2 {
margin-left: 105px;
}
}
@media (max-width: 1399.98px) {
.choose-us-content-2 {
margin-left: 30px;
}
}
@media (max-width: 1199.98px) {
.choose-us-content-2 {
margin-left: 0;
}
}
.choose-us-box-style-2 {
margin-top: 40px;
}
@media (max-width: 767.98px) {
.choose-us-box-style-2 {
margin-top: 30px;
}
}
.choose-us-box-style-2 .icon {
width: 65px;
height: 65px;
line-height: 65px;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
text-align: center;
border-radius: 50%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
font-size: 28px;
color: var(--theme-color-white);
}
.choose-us-box-style-2 .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.choose-us-box-style-2 .content {
max-width: 310px;
margin-top: 25px;
}
.choose-us-box-style-2 .content h3 {
color: var(--theme-color-white);
margin-bottom: 10px;
}
[data-tm-layout=dark] .choose-us-box-style-2 .content h3 {
color: var(--headings-color);
}
.choose-us-box-style-2 .content h3 a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.choose-us-box-style-2 .content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--theme-color-white)), to(var(--theme-color-white)));
background-image: linear-gradient(180deg, var(--theme-color-white) 0%, var(--theme-color-white) 100%);
}
.choose-us-box-style-2 .content p {
color: var(--theme-color-white);
line-height: 218%;
}
[data-tm-layout=dark] .choose-us-box-style-2 .content p {
color: var(--headings-color);
}
.choose-us-box-style-2:hover .icon {
background-position: 100% 0;
}
.choose-us-box-style-2:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.why-choose-us-section-4 {
margin: 0 30px;
position: relative;
z-index: 9;
border-radius: 60px;
background: var(--theme-color-white);
}
.why-choose-us-section-4 .shape-1 {
left: 0;
top: 40%;
position: absolute;
}
@media (max-width: 1899.98px) {
.why-choose-us-section-4 .shape-1 {
display: none;
}
}
@media (max-width: 1399.98px) {
.why-choose-us-section-4 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.why-choose-us-section-4 {
margin-left: 20px;
margin-right: 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.choose-us-image-items-4 {
position: relative;
}
.choose-us-image-items-4 .choose-image {
position: relative;
max-width: 512px;
-webkit-mask: url('data:image/svg+xml;utf8,');
mask: url('data:image/svg+xml;utf8,');
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-size: cover;
mask-size: cover;
}
.choose-us-image-items-4 .choose-image img {
width: 100%;
height: 100%;
}
.choose-us-image-items-4 .choose-counter4 {
border-radius: 50%;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 9;
}
.choose-us-image-items-4 .choose-counter4::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 168px;
height: 168px;
border-radius: 50%;
background-color: var(--theme-color-white);
border: 2px solid var(--theme-color1);
content: "";
z-index: -1;
}
.choose-us-image-items-4 .choose-counter4::after {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 140px;
height: 140px;
border-radius: 50%;
background-color: var(--theme-color1);
content: "";
z-index: -1;
}
.choose-us-image-items-4 .choose-counter4 h2 {
font-weight: bold;
font-size: 49px;
margin-top: -7px;
}
.choose-us-image-items-4 .choose-counter4 p {
color: var(--headings-color);
line-height: 1.3;
font-weight: 500;
margin-top: -10px;
}
.choose-us-image-items-4 .choose-counter4 p br {
display: block;
}
.choose-content-4 {
max-width: 620px;
}
.choose-content-4 .about-text {
margin-top: 25px;
}
.choose-content-4 .icon-items-area {
margin-top: 10px;
}
.choose-content-4 .icon-items-area .icon-items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 50px;
margin-top: 30px;
}
@media (max-width: 1199.98px) {
.choose-content-4 .icon-items-area .icon-items {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
.choose-content-4 .icon-items-area .icon-items .icon {
max-width: 66px;
height: 66px;
line-height: 68px;
text-align: center;
background-color: #144443;
border-radius: 50%;
position: relative;
-ms-flex-preferred-size: 30%;
flex-basis: 30%;
font-size: 28px;
color: #fff;
}
.choose-content-4 .icon-items-area .icon-items .icon::before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border: 1px dashed #144443;
content: "";
width: 84px;
height: 84px;
border-radius: 50%;
}
.choose-content-4 .icon-items-area .icon-items .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.choose-content-4 .icon-items-area .icon-items .icon-content h4 {
font-family: var(--body-font-family);
}
.choose-content-4 .icon-items-area .icon-items .icon-content p {
margin-top: 8px;
}
.choose-content-4 .icon-items-area .icon-items:hover .icon {
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
.choose-content-4 .icon-items-area .icon-items:hover .icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.why-choose-section-3 {
position: relative;
z-index: 2;
background-color: var(--theme-color2);
}
.why-choose-section-3 .bg-image {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: calc(50% - 80px);
z-index: -1;
background-repeat: no-repeat;
background-position: left center;
background-size: cover;
}
@media (max-width: 1399.98px) {
.why-choose-section-3 .bg-image {
width: calc(50% - 200px);
}
}
@media (max-width: 991.98px) {
.why-choose-section-3 .bg-image {
position: relative;
width: 100%;
}
}
.why-choose-section-3 .bg-image .img-fit-cover {
-o-object-fit: cover;
object-fit: cover;
width: 100%;
height: 100%;
}
.why-choose-section-3 .outer-box {
position: relative;
left: calc(50% - 80px);
width: calc(50% + 80px);
}
@media (max-width: 1399.98px) {
.why-choose-section-3 .outer-box {
left: calc(50% - 200px);
width: calc(50% + 200px);
}
}
@media (max-width: 991.98px) {
.why-choose-section-3 .outer-box {
width: 100%;
left: 0;
}
}
.why-choose-section-3 .choose-content {
padding: 120px;
}
@media (max-width: 1699.98px) {
.why-choose-section-3 .choose-content {
padding: 120px 50px;
}
}
@media (max-width: 767.98px) {
.why-choose-section-3 .choose-content {
padding: 100px 30px;
}
}
@media (max-width: 575.98px) {
.why-choose-section-3 .choose-content {
padding: 80px 15px;
}
}
.why-choose-section-3 .choose-content .inner-box .content-title {
font-weight: 700;
font-size: 24px;
line-height: 30px;
margin-bottom: 20px;
text-transform: capitalize;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .why-choose-section-3 .choose-content .inner-box .content-title {
color: #ffffff;
}
@media (max-width: 1899.98px) {
.why-choose-section-3 .choose-content .inner-box .content-title {
font-size: 20px;
}
}
.why-choose-section-3 .choose-content .inner-box .content-text {
font-weight: 400;
font-size: 16px;
line-height: 35px;
margin-bottom: 30px;
text-transform: capitalize;
color: rgba(var(--theme-color-white-rgb), 0.8);
}
.why-choose-section-3 .choose-content .inner-box .choose-us-box {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
margin-bottom: 20px;
}
.why-choose-section-3 .choose-content .inner-box .choose-us-box .icon-box .icon {
-webkit-transform: rotateY("0deg");
transform: rotateY("0deg");
font-size: 44px;
color: var(--theme-color-white);
}
.why-choose-section-3 .choose-content .inner-box .choose-us-box .content-box span {
font-weight: 400;
font-size: 16px;
line-height: 35px;
display: block;
margin-bottom: 10px;
text-transform: capitalize;
color: rgba(var(--theme-color-white-rgb), 0.8);
}
.why-choose-section-3 .choose-content .inner-box .choose-us-box .content-box h5 {
font-weight: 700;
font-size: 18px;
line-height: 100%;
text-transform: capitalize;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .why-choose-section-3 .choose-content .inner-box .choose-us-box .content-box h5 {
color: #ffffff;
}
.why-choose-section-3 .choose-content .inner-box .theme-btn {
margin-top: 20px;
}
[data-tm-layout=dark] .why-choose-section-3 .choose-content .inner-box .theme-btn {
color: #ffffff;
}
[data-tm-layout=dark] .why-choose-section-3 .choose-content .inner-box .theme-btn .icon {
background-color: #ffffff;
}
@media (max-width: 1199.98px) {
.why-choose-section-3 .choose-content .inner-box .theme-btn {
margin-bottom: 20px;
}
}
.why-choose-section-3 .choose-content .inner-box .process-bar {
margin-left: 30px;
border-radius: 10px;
overflow: hidden;
}
@media (max-width: 1199.98px) {
.why-choose-section-3 .choose-content .inner-box .process-bar {
margin-left: 0;
}
}
.ks-choose-2-area {
padding-top: 110px;
padding-bottom: 120px;
background-color: var(--theme-color2);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
@media (max-width: 1699.98px) {
.ks-choose-2-content {
padding-right: 30px;
}
}
@media (max-width: 991.98px) {
.ks-choose-2-content {
margin-bottom: 50px;
}
}
@media (max-width: 1199.98px) {
.ks-choose-2-content {
padding-right: 0;
}
}
.ks-choose-2-content .ks-section-title-wrap {
margin-bottom: 30px;
}
.ks-choose-2-content .text {
padding-right: 40px;
margin-bottom: 30px;
max-width: 530px;
color: rgb(var(--theme-color-white-rgb), 0.7);
}
@media (max-width: 1699.98px) {
.ks-choose-2-content .text {
padding-right: 0;
}
}
@media (max-width: 1199.98px) {
.ks-choose-2-content .text {
font-size: 15px;
}
}
.ks-choose-2-content .btn-style-two .icon {
color: var(--theme-color2);
}
[data-tm-layout=dark] .ks-choose-2-content .btn-style-two .icon {
color: var(--headings-color);
}
.ks-choose-2-content .btn-style-two:hover .icon {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .ks-choose-2-content .btn-style-two:hover .icon {
background-color: var(--theme-color-white);
color: var(--headings-color);
}
.ks-choose-2-icon {
position: absolute;
top: 50%;
left: 0;
right: 0;
margin: 0 auto;
text-align: center;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 1199.98px) {
.ks-choose-2-icon {
display: none;
}
}
.ks-choose-2-icon img {
-webkit-animation: animationglob 6s cubic-bezier(1, 0.99, 0.03, 0.01) infinite;
animation: animationglob 6s cubic-bezier(1, 0.99, 0.03, 0.01) infinite;
}
.ks-choose-2-more-wrap {
margin-bottom: 40px;
}
.ks-choose-2-more-wrap .text2 {
margin-bottom: 0;
max-width: 220px;
color: rgb(var(--theme-color-white-rgb), 0.7);
}
.ks-choose-2-more-info {
padding-right: 35px;
margin-right: 30px;
border-right: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 1199.98px) {
.ks-choose-2-more-info {
padding-right: 25px;
margin-right: 25px;
}
}
@media (max-width: 767.98px) {
.ks-choose-2-more-info {
border-right: none;
padding-right: 0;
margin-right: 0;
margin-bottom: 25px;
}
}
@media (min-width: 576px) and (max-width: 767.98px) {
.ks-choose-2-more-info {
margin-bottom: 0;
padding-right: 25px;
}
}
.ks-choose-2-more-info .icon {
display: inline-block;
height: 60px;
width: 60px;
font-size: 30px;
line-height: 60px;
text-align: center;
border-radius: 50%;
margin-right: 20px;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
background-color: var(--theme-color-blue);
border: 1px solid rgb(var(--theme-color-white-rgb), 0.27);
color: var(--theme-color-white);
}
.ks-choose-2-more-info b {
font-weight: 600;
font-size: 24px;
line-height: 1.33;
font-family: var(--heading-font-family);
text-transform: capitalize;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .ks-choose-2-more-info b {
color: #ffffff;
}
@media (max-width: 1699.98px) {
.ks-choose-2-more-info b {
font-size: 17px;
}
}
@media (max-width: 1199.98px) {
.ks-choose-2-more-info b {
font-size: 15px;
}
}
.ks-choose-2-thumb img {
border-radius: 50%;
}
@media (max-width: 767.98px) {
.ks-choose-2-thumb img {
width: 100%;
}
}
.ks-choose-2-thumb-wrap {
position: relative;
margin-left: 60px;
}
@media (max-width: 1199.98px) {
.ks-choose-2-thumb-wrap {
margin-left: 0px;
}
}
.ks-choose-2-thumb-wrap .style-2 {
margin-top: -40px;
}
@media (max-width: 1199.98px) {
.ks-choose-2-thumb-wrap .style-2 {
margin-top: 0;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
}
}
@media (max-width: 767.98px) {
.ks-choose-2-thumb-wrap .style-2 {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
.ks-choose-2-circle {
border-radius: 50%;
width: 286px;
height: 283px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 10px;
-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: relative;
z-index: 1;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1199.98px) {
.ks-choose-2-circle {
height: 100%;
width: 100%;
}
}
.ks-choose-2-circle .title {
margin-bottom: 0;
font-weight: 600;
font-size: 32px;
line-height: 40px;
text-align: center;
}
@media (max-width: 1199.98px) {
.ks-choose-2-circle .title {
font-size: 25px;
}
}
@media (max-width: 767.98px) {
.ks-choose-2-circle .title {
font-size: 16px;
line-height: 26px;
}
}
.ks-choose-2-circle:hover {
background-position: 100% 0;
}
/***
==================================================================
Pricing Section
==================================================================
***/
.request-section {
position: relative;
z-index: 9;
}
.pricing-section .pricing-circle {
position: absolute;
right: 30px;
top: 50px;
z-index: -1;
}
@media (max-width: 1399.98px) {
.pricing-section .pricing-circle {
display: none;
}
}
.pricing-section .info-bottom {
text-align: center;
margin-top: 80px;
}
.pricing-section .info-bottom .info-box {
position: relative;
border-radius: 30px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 30px;
padding: 15px 50px;
border: 1px solid var(--theme-color-black);
}
[data-tm-layout=dark] .pricing-section .info-bottom .info-box {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 991.98px) {
.pricing-section .info-bottom .info-box {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 10px;
}
}
.request-section .nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 10px;
border: 1px solid #f58a20;
padding: 5px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
max-width: 400px;
margin: 0 auto 15px;
}
[data-tm-layout=dark] .request-section .nav {
background-color: rgba(255, 255, 255, 0.1);
border-color: transparent;
}
.request-section .nav .nav-link {
font-size: 18px;
font-weight: 700;
color: #595B62;
padding: 13px 40px;
line-height: 1;
border-radius: 10px;
}
[data-tm-layout=dark] .pricing-section .nav .nav-link {
color: #ffffff;
}
.request-section .nav .nav-link.active {
background-color: var(--theme-color1);
color: #fff;
-webkit-box-shadow: 0px 2px 2px -1px rgba(89, 86, 233, 0.15), 0px 0px 1px 0px rgba(89, 86, 233, 0.1);
box-shadow: 0px 2px 2px -1px rgba(89, 86, 233, 0.15), 0px 0px 1px 0px rgba(89, 86, 233, 0.1);
}
[data-tm-layout=dark] .request-section .nav .nav-link.active {
color: #000000;
}
.pricing-box-items {
margin-top: 30px;
border-radius: 20px;
background-color: var(--theme-color-white);
border: 1px solid rgba(0, 0, 0, 0.1);
}
[data-tm-layout=dark] .pricing-box-items {
background-color: var(--dark-color1);
border-color: rgba(255, 255, 255, 0.1);
}
.pricing-box-items .pricing-header {
padding-bottom: 25px;
padding-left: 60px;
padding-right: 60px;
padding-top: 40px;
}
@media (max-width: 1399.98px) {
.pricing-box-items .pricing-header {
padding-left: 50px;
padding-right: 50px;
}
}
@media (max-width: 1199.98px) {
.pricing-box-items .pricing-header {
padding-left: 40px;
padding-right: 40px;
}
}
@media (max-width: 575.98px) {
.pricing-box-items .pricing-header {
padding-left: 30px;
padding-right: 30px;
margin-top: 25px;
}
}
.pricing-box-items .pricing-header .title-icon {
margin-bottom: 20px;
color: #144443;
font-size: 55px;
line-height: 1;
}
.pricing-box-items .pricing-header h3 {
font-size: 22px;
line-height: 1;
}
.pricing-box-items .pricing-header span {
font-size: 14px;
}
.pricing-box-items .pricing-header .icon {
color: var(--theme-color2);
display: inline-block;
font-size: 57px;
line-height: 1;
}
.pricing-box-items .pricing-list {
padding-top: 25px;
border-top: 1px solid #dee2e6;
margin: 0 60px;
}
[data-tm-layout=dark] .pricing-box-items .pricing-list {
border-top-color: rgba(150, 150, 150, 0.2);
}
@media (max-width: 1399.98px) {
.pricing-box-items .pricing-list {
margin: 0 40px;
}
}
@media (max-width: 575.98px) {
.pricing-box-items .pricing-list {
margin: 0 30px;
}
}
.pricing-box-items .pricing-list li {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #595B62;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
font-size: 16px;
gap: 12px;
width: 100%;
}
.pricing-box-items .pricing-list li .icon {
background-color: var(--headings-color);
border-radius: 17px;
height: 17px;
line-height: 15px;
text-align: center;
width: 17px;
}
.pricing-box-items .pricing-list li i {
color: var(--theme-color-white);
font-size: 11px;
}
[data-tm-layout=dark] .pricing-box-items .pricing-list li {
color: var(--headings-color);
}
.pricing-box-items .pricing-list li:not(:last-child) {
margin-bottom: 20px;
}
.pricing-box-items .pricing-list li.disable {
opacity: 0.2;
}
.pricing-box-items .pricing-button {
padding: 40px 50px;
}
@media (max-width: 1199.98px) {
.pricing-box-items .pricing-button {
padding: 40px 40px;
}
}
@media (max-width: 575.98px) {
.pricing-box-items .pricing-button {
padding: 30px;
}
}
.pricing-box-items .pricing-button .btn-style-one {
background-color: var(--theme-color1);
color: var(--headings-color);
}
[data-tm-layout=dark] .pricing-box-items .pricing-button .btn-style-one {
background-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.pricing-box-items .pricing-button .btn-style-one::before {
background-color: var(--headings-color);
}
[data-tm-layout=dark] .pricing-box-items .pricing-button .btn-style-one::before {
background-color: var(--theme-color1);
}
.pricing-box-items .pricing-button .btn-style-one:hover {
color: #fff;
}
.pricing-box-items.active {
border-radius: 20px;
background: #144443;
-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.05);
position: relative;
overflow: hidden;
}
.pricing-box-items.active .gt-price-tag {
padding: 4px 12px;
display: inline-block;
background-color: var(--theme-color1);
font-size: 14px;
text-align: center;
color: #000000;
position: absolute;
top: 24px;
right: -40px;
-webkit-transform: rotate(40.012deg);
transform: rotate(40.012deg);
width: 185px;
font-weight: 600;
text-transform: uppercase;
font-family: var(--titlt-font);
}
.pricing-box-items.active .title-icon {
color: #fff;
}
.pricing-box-items.active .pricing-header h3 {
font-size: 22px;
line-height: 1;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .pricing-box-items.active .pricing-header h3 {
color: var(--headings-color);
}
.pricing-box-items.active .pricing-header span {
font-size: 14px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .pricing-box-items.active .pricing-header span {
color: var(--headings-color);
}
.pricing-box-items.active .pricing-header .icon {
color: var(--theme-color-white);
}
.pricing-box-items.active .pricing-list {
border-top: 1px solid rgba(232, 234, 241, 0.5);
}
.pricing-box-items.active .pricing-list li {
color: var(--theme-color-white);
}
.pricing-box-items.active .pricing-list li .icon {
background-color: var(--theme-color-white);
}
.pricing-box-items.active .pricing-list li .icon i {
color: var(--headings-color);
}
[data-tm-layout=dark] .pricing-box-items.active .pricing-list li {
color: var(--headings-color);
}
.pricing-box-items.active .pricing-button .btn-style-one {
background: rgba(255, 255, 255, 0.15);
color: #fff;
}
.pricing-box-items.active .pricing-button .btn-style-one::before {
background-color: var(--theme-color1);
}
.pricing-box-items.active .pricing-button .btn-style-one:hover {
color: var(--headings-color);
}
@media (max-width: 991.98px) {
.pricing-content-2 {
margin-bottom: 30px;
}
}
.pricing-content-2 p {
max-width: 339px;
margin-top: 30px;
}
.pricing-card-item-2 {
border-radius: 10px;
background: #FFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 60px;
position: relative;
}
[data-tm-layout=dark] .pricing-card-item-2 {
background: var(--dark-color2);
}
@media (max-width: 575.98px) {
.pricing-card-item-2 {
display: block;
padding: 30px;
padding-top: 0;
}
}
.pricing-card-item-2 .blur-shape {
bottom: 0;
border-radius: 10px;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
}
.pricing-card-item-2 .blur-shape img {
width: 100%;
height: 100%;
}
.pricing-card-item-2::before {
bottom: 0;
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 10px;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.pricing-card-item-2 .pricing-left-ber {
border-right: 1px solid rgba(0, 0, 0, 0.1);
display: inline-block;
padding: 0 50px 35px;
text-align: center;
}
[data-tm-layout=dark] .pricing-card-item-2 .pricing-left-ber {
color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 575.98px) {
.pricing-card-item-2 .pricing-left-ber {
border-right: none;
padding: 0;
}
}
.pricing-card-item-2 .pricing-left-ber .pricing-icon {
color: #000;
display: inline-block;
font-size: 35px;
position: relative;
z-index: 9;
}
.pricing-card-item-2 .pricing-left-ber .pricing-icon::before {
background-color: #F5F5F5;
border-radius: 100%;
content: "";
height: 102px;
left: 50%;
position: absolute;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 102px;
z-index: -1;
}
.pricing-card-item-2 .pricing-left-ber .pricing-icon::after {
background-color: var(--theme-color1);
border-radius: 100%;
content: "";
height: 34px;
position: absolute;
right: -7px;
top: 13px;
width: 34px;
z-index: -1;
}
.pricing-card-item-2 .pricing-left-ber .pricing-icon i {
display: inline-block;
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
}
.pricing-card-item-2 .pricing-left-ber .pricing-header {
margin-top: 75px;
}
@media (max-width: 575.98px) {
.pricing-card-item-2 .pricing-left-ber .pricing-header {
margin-top: 60px;
}
}
.pricing-card-item-2 .pricing-left-ber .pricing-header h5 {
font-size: 18px;
font-weight: 500;
}
.pricing-card-item-2 .pricing-left-ber .pricing-header h3 {
font-size: 36px;
font-weight: 600;
}
.pricing-card-item-2 .pricing-right-ber {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 50px 30px;
padding-right: 60px;
width: 100%;
}
@media (max-width: 1199.98px) {
.pricing-card-item-2 .pricing-right-ber {
padding-right: 30px;
}
}
@media (max-width: 1199.98px) {
.pricing-card-item-2 .pricing-right-ber {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
@media (max-width: 575.98px) {
.pricing-card-item-2 .pricing-right-ber {
padding: 0;
}
}
.pricing-card-item-2 .pricing-right-ber .pricing-list li {
font-size: 14px;
font-weight: 400;
color: #646464;
}
[data-tm-layout=dark] .pricing-card-item-2 .pricing-right-ber .pricing-list li {
color: rgba(204, 204, 204, 0.8);
}
.pricing-card-item-2 .pricing-right-ber .pricing-list li:not(:last-child) {
margin-bottom: 15px;
}
.pricing-card-item-2 .pricing-right-ber .pricing-list li i {
margin-right: 10px;
color: #144443;
}
[data-tm-layout=dark] .pricing-card-item-2 .pricing-right-ber .pricing-list li i {
color: #646464;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn {
position: relative;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 60px;
padding: 26px 30px;
padding-right: 80px;
}
@media (max-width: 575.98px) {
.pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one {
height: 57px;
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
}
}
[data-tm-layout=dark] .pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one {
color: #ffffff;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one:before {
display: none;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
[data-tm-layout=dark] .pricing-card-item-2 .pricing-right-ber .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.pricing-card-item-2 .pricing-right-ber .theme-btn .icon {
background-color: var(--theme-color1);
border-radius: 50%;
bottom: 4px;
color: var(--headings-color);
font-size: 40px;
height: 52px;
line-height: 52px;
position: absolute;
right: 4px;
top: 4px;
width: 52px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-card-item-2 .pricing-right-ber .theme-btn .icon i {
display: inline-block;
}
.pricing-card-item-2:hover .pricing-left-ber .pricing-icon i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.pricing-card-item-2.style-2 .pricing-left-ber .pricing-icon::before {
background-color: var(--theme-color1);
}
.pricing-card-item-2.style-2 .pricing-left-ber .pricing-icon::after {
background-color: #F5F5F5;
}
.pricing-section-2 {
background-color: var(--theme-color-white);
border-radius: 50px;
margin: 0 30px;
position: relative;
z-index: 9;
}
@media (max-width: 1399.98px) {
.pricing-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 991.98px) {
.pricing-section-2 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.pricing-card-items {
background-color: var(--theme-color-white);
-webkit-box-shadow: 0px 10px 37px rgba(0, 0, 0, 0.06);
box-shadow: 0px 10px 37px rgba(0, 0, 0, 0.06);
border: 1.2px solid rgba(0, 23, 38, 0.1);
border-radius: 20px;
margin-top: 40px;
padding: 50px;
padding-top: 55px;
position: relative;
z-index: 9;
}
[data-tm-layout=dark] .pricing-card-items {
background-color: var(--dark-color1);
}
@media (max-width: 1399.98px) {
.pricing-card-items {
padding: 35px;
padding-top: 35px;
}
}
@media (max-width: 767.98px) {
.pricing-card-items {
margin-top: 30px;
}
}
@media (max-width: 575.98px) {
.pricing-card-items {
padding: 25px;
padding-top: 25px;
}
}
.pricing-card-items .pricing-shape {
position: absolute;
top: 40px;
right: 5px;
z-index: -1;
}
.pricing-card-items .plan-text {
background-color: #1A4137;
border-radius: 7px;
color: var(--theme-color-white);
display: inline-block;
font-size: 18px;
font-weight: 600;
line-height: 1;
margin-bottom: 10px;
padding: 10px 20px;
}
[data-tm-layout=dark] .pricing-card-items .plan-text {
background-color: rgb(var(--theme-color-white-rgb), 0.1);
color: var(--headings-color);
}
.pricing-card-items .pricing-list {
border-bottom: 1px solid rgba(0, 23, 38, 0.1);
margin-top: 35px;
padding-bottom: 45px;
}
.pricing-card-items .pricing-list li {
color: var(--headings-color);
font-size: 16px;
font-weight: 500;
line-height: 1;
padding-left: 20px;
position: relative;
}
.pricing-card-items .pricing-list li::before {
background-color: var(--theme-color1);
border-radius: 5px;
content: "";
height: 5px;
left: 0;
position: absolute;
top: 4px;
width: 5px;
}
.pricing-card-items .pricing-list li:not(:last-child) {
margin-bottom: 25px;
}
.pricing-card-items .pricing-list li:nth-of-type(4) {
color: #D9DCDF;
}
.pricing-card-items .pricing-list li:nth-of-type(4)::before {
opacity: 0.3;
}
.pricing-card-items .pricing-list li:nth-of-type(5) {
color: #D9DCDF;
}
.pricing-card-items .pricing-list li:nth-of-type(5)::before {
opacity: 0.3;
}
.pricing-card-items p {
color: #4B5563;
}
[data-tm-layout=dark] .pricing-card-items p {
color: rgba(204, 204, 204, 0.8);
}
.pricing-card-items .pricing-price {
padding-top: 30px;
}
.pricing-card-items .pricing-price h2 {
font-size: 48px;
font-weight: 700;
}
@media (max-width: 575.98px) {
.pricing-card-items .pricing-price h2 {
font-size: 38px;
}
}
.pricing-card-items .pricing-price h2 sub {
font-weight: 400;
color: var(--text-color);
font-family: var(--body-font-family);
font-size: 16px;
margin-left: -5px;
}
.pricing-card-items .pricing-price span {
font-weight: 500;
font-family: var(--titlt-font);
}
.pricing-card-items .theme-btn {
margin-top: 30px;
position: relative;
}
.pricing-card-items .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: transparent;
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 100px;
color: var(--headings-color);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
[data-tm-layout=dark] .pricing-card-items .theme-btn.btn-style-one {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 1399.98px) {
.pricing-card-items .theme-btn.btn-style-one {
padding: 26px 44px;
padding-right: 90px;
}
}
@media (max-width: 991.98px) {
.pricing-card-items .theme-btn.btn-style-one {
padding: 26px 38px;
padding-right: 80px;
}
}
@media only screen and (max-width: 767px) {
.pricing-card-items .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.pricing-card-items .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.pricing-card-items .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.pricing-card-items .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.pricing-card-items .theme-btn.btn-style-one::before {
display: none;
}
.pricing-card-items .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.pricing-card-items .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .pricing-card-items .theme-btn.btn-style-one:hover .icon {
color: var(--headings-color);
}
.pricing-card-items .theme-btn .icon {
bottom: 4px;
background-color: var(--theme-color1);
color: var(--headings-color);
border-radius: 50%;
font-size: 50px;
height: 60px;
line-height: 70px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 60px;
}
[data-tm-layout=dark] .pricing-card-items .theme-btn .icon {
color: var(--theme-color-white);
}
@media (max-width: 767.98px) {
.pricing-main-items {
margin-top: 30px;
}
}
.pricing-main-items .popular {
border-radius: 20px 20px 0px 0px;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
padding: 10px;
padding-bottom: 30px;
font-family: var(--heading-font-family);
font-weight: 700;
color: var(--theme-color-white);
text-transform: uppercase;
text-align: center;
font-size: 16px;
margin-bottom: -30px;
}
[data-tm-layout=dark] .pricing-main-items .popular {
color: var(--headings-color);
}
.pricing-main-items:hover .popular {
background-position: 100% 0;
}
.pricing-main-items .pricing-card-items {
margin-top: 0;
position: relative;
z-index: 9;
}
[data-tm-layout=dark] .pricing-main-items .pricing-card-items {
background-color: var(--dark-color2);
}
.pricing-main-items .theme-btn.btn-style-one {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: var(--theme-color-white);
}
.pricing-main-items .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.pricing-main-items .theme-btn.btn-style-one::before {
display: none;
}
[data-tm-layout=dark] .pricing-main-items .theme-btn.btn-style-one::before {
background: rgb(var(--theme-color-white-rgb), 0.1);
}
.pricing-section-2 .pricing-two__tab {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 10px;
margin-bottom: 50px;
gap: 25px;
}
@media (max-width: 1199.98px) {
.pricing-section-2 .pricing-two__tab {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px;
}
}
@media (max-width: 767.98px) {
.pricing-section-2 .pricing-two__tab {
margin-bottom: 0;
}
}
@media (max-width: 575.98px) {
.pricing-section-2 .pricing-two__tab {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-bottom: 0;
}
}
.pricing-section-2 .save-text {
position: relative;
font-size: 20px;
font-weight: 500;
color: var(--headings-color);
}
.pricing-section-2 .save-text img {
position: absolute;
bottom: -30px;
left: -3%;
}
.pricing-section-2 .nav {
border: none;
}
.pricing-section-2 .nav .nav-tabs {
border-bottom: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.pricing-section-2 .nav .nav-link {
font-size: 20px;
font-weight: 700;
text-transform: capitalize;
border: 0;
border-radius: 0;
padding: 7px 56px;
position: relative;
background: transparent;
font-family: var(--heading-font-family);
z-index: 2;
color: var(--text-color);
margin-bottom: 0;
}
.pricing-section-2 .nav .nav-link::before {
position: absolute;
content: "";
right: 0px;
top: 50%;
-webkit-transform: translateY(-50%) translateX(50%);
transform: translateY(-50%) translateX(50%);
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
width: 75px;
height: 32px;
border-radius: 20px;
border: 1px solid var(--theme-color1);
}
.pricing-section-2 .nav .nav-link::after {
position: absolute;
content: "";
right: -33px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 24px;
height: 24px;
border-radius: 50%;
background: var(--theme-color-white);
z-index: 1;
}
.pricing-section-2 .nav .nav-link:first-child {
padding-left: 0;
}
.pricing-section-2 .nav .nav-link:last-child {
padding-right: 0;
}
.pricing-section-2 .nav .nav-link:last-child::after {
display: none;
}
.pricing-section-2 .nav .nav-link:last-child::before {
display: none;
}
.pricing-section-2 .nav .nav-link.active {
color: var(--headings-color);
}
.pricing-section-2 .nav .nav-link.active::after {
right: 8px;
}
/***
====================================================================
Pricing Section Three
====================================================================
***/
.pricing-section-three {
position: relative;
padding: 120px 0 90px;
}
.pricing-section-three .shape-9 {
position: absolute;
top: 0;
left: 0;
}
@media (max-width: 1199.98px) {
.pricing-section-three .shape-9 {
top: -100px;
left: -100px;
}
}
@media (max-width: 767.98px) {
.pricing-section-three .shape-9 {
display: none;
}
}
.pricing-block-three {
margin-bottom: 30px;
}
.pricing-block-three .inner-box {
position: relative;
margin-right: 10px;
border-radius: 25px;
}
.pricing-block-three .inner-box:hover .content::before {
left: -1px;
left: 0;
right: 0;
top: -1px;
opacity: 1;
}
.pricing-block-three .inner-box:hover .content .bg-layer {
background: var(--theme-color2);
opacity: 1;
-webkit-transform: scaleX(1);
transform: scaleX(1);
z-index: -1;
}
.pricing-block-three .inner-box:hover .content .time,
.pricing-block-three .inner-box:hover .content .title,
.pricing-block-three .inner-box:hover .content .list-style-three li {
color: var(--theme-color-light);
}
[data-tm-layout=dark] .pricing-block-three .inner-box:hover .content .time,
[data-tm-layout=dark] .pricing-block-three .inner-box:hover .content .title,
[data-tm-layout=dark] .pricing-block-three .inner-box:hover .content .list-style-three li {
color: #ffffff;
}
.pricing-block-three .inner-box:hover .content .text {
color: rgba(255, 255, 255, 0.5);
border-color: rgb(var(--theme-color-black-rgb), 0.1);
}
[data-tm-layout=dark] .pricing-block-three .inner-box:hover .content .text {
color: rgba(204, 204, 204, 0.8);
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.pricing-block-three .inner-box:hover .pricing-icon {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.pricing-block-three .inner-box:hover .pricing-box .price {
color: var(--theme-color-light);
}
.pricing-block-three .inner-box:hover .list-style-three li .icon path {
fill: var(--theme-color-light);
}
.pricing-block-three .inner-box:hover .pricing-title {
color: var(--theme-color-light);
}
.pricing-block-three .inner-box:hover .btn-box .btn-style-two {
background: rgba(255, 255, 255, 0.15);
}
.pricing-block-three .inner-box:before {
content: "";
position: absolute;
top: 11px;
left: 11px;
right: -11px;
bottom: -11px;
z-index: -4;
background: #F2F3F5;
clip-path: polygon(93.888% 99.92%, 6.112% 99.92%, 6.112% 99.92%, 5.141% 99.869%, 4.219% 99.72%, 3.36% 99.482%, 2.575% 99.164%, 1.877% 98.772%, 1.278% 98.315%, 0.791% 97.801%, 0.428% 97.239%, 0.201% 96.636%, 0.122% 96%, 0.122% 27.921%, 0.122% 27.921%, 0.145% 27.577%, 0.214% 27.238%, 0.327% 26.906%, 0.482% 26.582%, 0.68% 26.27%, 0.917% 25.969%, 1.194% 25.683%, 1.509% 25.413%, 1.861% 25.16%, 2.248% 24.926%, 45.533% 1.005%, 45.533% 1.005%, 45.865% 0.834%, 46.214% 0.679%, 46.577% 0.542%, 46.953% 0.421%, 47.34% 0.318%, 47.737% 0.234%, 48.143% 0.167%, 48.556% 0.119%, 48.975% 0.09%, 49.398% 0.08%, 93.888% 0.08%, 93.888% 0.08%, 94.859% 0.131%, 95.781% 0.28%, 96.64% 0.518%, 97.425% 0.836%, 98.123% 1.228%, 98.722% 1.685%, 99.209% 2.199%, 99.572% 2.761%, 99.799% 3.364%, 99.878% 4%, 99.878% 96%, 99.876% 96.101%, 99.876% 96.101%, 99.776% 96.723%, 99.534% 97.312%, 99.162% 97.86%, 98.67% 98.36%, 98.072% 98.805%, 97.379% 99.186%, 96.602% 99.495%, 95.753% 99.726%, 94.844% 99.87%, 93.888% 99.92%);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .pricing-block-three .inner-box:before {
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
.pricing-block-three .inner-box .pricing-icon {
position: absolute;
top: 20px;
left: 20px;
width: 110px;
height: 110px;
font-size: 54px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
color: var(--theme-color-light);
border-radius: 50%;
background: var(--gradient-1);
z-index: 5;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-block-three .inner-box .content {
position: relative;
z-index: 3;
padding: 50px 50px 30px 50px;
border-radius: 25px;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
@media (max-width: 575.98px) {
.pricing-block-three .inner-box .content {
padding: 50px 30px 30px 30px;
}
}
.pricing-block-three .inner-box .content::after {
position: absolute;
content: "";
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
z-index: -2;
background-color: var(--theme-color-white);
clip-path: polygon(93.888% 99.92%, 6.112% 99.92%, 6.112% 99.92%, 5.141% 99.869%, 4.219% 99.72%, 3.36% 99.482%, 2.575% 99.164%, 1.877% 98.772%, 1.278% 98.315%, 0.791% 97.801%, 0.428% 97.239%, 0.201% 96.636%, 0.122% 96%, 0.122% 27.921%, 0.122% 27.921%, 0.145% 27.577%, 0.214% 27.238%, 0.327% 26.906%, 0.482% 26.582%, 0.68% 26.27%, 0.917% 25.969%, 1.194% 25.683%, 1.509% 25.413%, 1.861% 25.16%, 2.248% 24.926%, 45.533% 1.005%, 45.533% 1.005%, 45.865% 0.834%, 46.214% 0.679%, 46.577% 0.542%, 46.953% 0.421%, 47.34% 0.318%, 47.737% 0.234%, 48.143% 0.167%, 48.556% 0.119%, 48.975% 0.09%, 49.398% 0.08%, 93.888% 0.08%, 93.888% 0.08%, 94.859% 0.131%, 95.781% 0.28%, 96.64% 0.518%, 97.425% 0.836%, 98.123% 1.228%, 98.722% 1.685%, 99.209% 2.199%, 99.572% 2.761%, 99.799% 3.364%, 99.878% 4%, 99.878% 96%, 99.876% 96.101%, 99.876% 96.101%, 99.776% 96.723%, 99.534% 97.312%, 99.162% 97.86%, 98.67% 98.36%, 98.072% 98.805%, 97.379% 99.186%, 96.602% 99.495%, 95.753% 99.726%, 94.844% 99.87%, 93.888% 99.92%);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-block-three .inner-box .content:before {
border-radius: 25px;
position: absolute;
content: "";
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
z-index: -3;
background: #E6E0FA;
clip-path: polygon(93.888% 99.92%, 6.112% 99.92%, 6.112% 99.92%, 5.141% 99.869%, 4.219% 99.72%, 3.36% 99.482%, 2.575% 99.164%, 1.877% 98.772%, 1.278% 98.315%, 0.791% 97.801%, 0.428% 97.239%, 0.201% 96.636%, 0.122% 96%, 0.122% 27.921%, 0.122% 27.921%, 0.145% 27.577%, 0.214% 27.238%, 0.327% 26.906%, 0.482% 26.582%, 0.68% 26.27%, 0.917% 25.969%, 1.194% 25.683%, 1.509% 25.413%, 1.861% 25.16%, 2.248% 24.926%, 45.533% 1.005%, 45.533% 1.005%, 45.865% 0.834%, 46.214% 0.679%, 46.577% 0.542%, 46.953% 0.421%, 47.34% 0.318%, 47.737% 0.234%, 48.143% 0.167%, 48.556% 0.119%, 48.975% 0.09%, 49.398% 0.08%, 93.888% 0.08%, 93.888% 0.08%, 94.859% 0.131%, 95.781% 0.28%, 96.64% 0.518%, 97.425% 0.836%, 98.123% 1.228%, 98.722% 1.685%, 99.209% 2.199%, 99.572% 2.761%, 99.799% 3.364%, 99.878% 4%, 99.878% 96%, 99.876% 96.101%, 99.876% 96.101%, 99.776% 96.723%, 99.534% 97.312%, 99.162% 97.86%, 98.67% 98.36%, 98.072% 98.805%, 97.379% 99.186%, 96.602% 99.495%, 95.753% 99.726%, 94.844% 99.87%, 93.888% 99.92%);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
[data-tm-layout=dark] .pricing-block-three .inner-box .content:before {
background: var(--dark-color2);
}
.pricing-block-three .inner-box .content .bg-layer {
border-radius: 25px;
bottom: 0px;
content: "";
left: 0px;
position: absolute;
right: 0px;
top: 0px;
z-index: -3;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
clip-path: polygon(93.888% 99.92%, 6.112% 99.92%, 6.112% 99.92%, 5.141% 99.869%, 4.219% 99.72%, 3.36% 99.482%, 2.575% 99.164%, 1.877% 98.772%, 1.278% 98.315%, 0.791% 97.801%, 0.428% 97.239%, 0.201% 96.636%, 0.122% 96%, 0.122% 27.921%, 0.122% 27.921%, 0.145% 27.577%, 0.214% 27.238%, 0.327% 26.906%, 0.482% 26.582%, 0.68% 26.27%, 0.917% 25.969%, 1.194% 25.683%, 1.509% 25.413%, 1.861% 25.16%, 2.248% 24.926%, 45.533% 1.005%, 45.533% 1.005%, 45.865% 0.834%, 46.214% 0.679%, 46.577% 0.542%, 46.953% 0.421%, 47.34% 0.318%, 47.737% 0.234%, 48.143% 0.167%, 48.556% 0.119%, 48.975% 0.09%, 49.398% 0.08%, 93.888% 0.08%, 93.888% 0.08%, 94.859% 0.131%, 95.781% 0.28%, 96.64% 0.518%, 97.425% 0.836%, 98.123% 1.228%, 98.722% 1.685%, 99.209% 2.199%, 99.572% 2.761%, 99.799% 3.364%, 99.878% 4%, 99.878% 96%, 99.876% 96.101%, 99.876% 96.101%, 99.776% 96.723%, 99.534% 97.312%, 99.162% 97.86%, 98.67% 98.36%, 98.072% 98.805%, 97.379% 99.186%, 96.602% 99.495%, 95.753% 99.726%, 94.844% 99.87%, 93.888% 99.92%);
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.pricing-block-three .inner-box .list-style-three {
margin-bottom: 20px;
}
.pricing-block-three .inner-box .list-style-three li {
position: relative;
font-weight: 400;
font-size: 16px;
line-height: 44px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 15px;
color: var(--headings-color);
font-family: var(--heading-font-family);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-block-three .inner-box .list-style-three li .icon {
background-color: var(--headings-color);
border-radius: 17px;
height: 17px;
line-height: 15px;
text-align: center;
width: 17px;
}
.pricing-block-three .inner-box .list-style-three li .icon i {
color: var(--theme-color-white);
font-size: 11px;
}
.pricing-block-three .inner-box .list-style-three li.disable-color {
opacity: 0.5;
}
.pricing-block-three .inner-box .pricing-box {
position: relative;
margin-left: 40%;
margin-bottom: 35px;
}
@media (max-width: 1199.98px) {
.pricing-block-three .inner-box .pricing-box {
margin-left: 35%;
margin-bottom: 60px;
}
}
.pricing-block-three .inner-box .pricing-box .price {
font-family: var(--heading-font-family);
font-weight: 700;
font-size: 65px;
line-height: 65px;
text-align: center;
color: var(--theme-color2);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 10px;
font-size: clamp(32px, 3.38vw, 65px);
line-height: 1.2;
}
[data-tm-layout=dark] .pricing-block-three .inner-box .pricing-box .price {
color: #ffffff;
}
.pricing-block-three .inner-box .pricing-box .price sub {
font-family: var(--heading-font-family);
font-weight: 700;
font-size: 24px;
line-height: 34px;
top: 0;
}
.pricing-block-three .inner-box .pricing-box .price sup {
font-family: var(--heading-font-family);
font-weight: 700;
font-size: 24px;
line-height: 30px;
top: 0;
}
.pricing-block-three .inner-box .pricing-box .time {
position: absolute;
left: calc(50% + 50px);
top: 35px;
}
@media (max-width: 991.98px) {
.pricing-block-three .inner-box .pricing-box .time {
left: 0;
}
}
.pricing-block-three .inner-box .pricing-title {
font-weight: 700;
font-size: 24px;
line-height: 30px;
text-transform: capitalize;
color: var(--headings-color);
}
[data-tm-layout=dark] .pricing-block-three .inner-box .pricing-title {
color: #ffffff;
}
.pricing-block-three .inner-box .text {
font-size: 16px;
font-weight: 400;
line-height: 29px;
color: var(--text-color);
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 2px solid #E8EAF1;
}
[data-tm-layout=dark] .pricing-block-three .inner-box .text {
color: rgba(204, 204, 204, 0.8);
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.pricing-block-three .inner-box .btn-box .btn-style-two {
max-width: 100%;
width: 100%;
padding: 20px 50px;
}
[data-tm-layout=dark] .pricing-block-three .inner-box .btn-box .btn-style-two {
color: #ffffff;
}
/***
====================================================================
team Section
====================================================================
***/
.team-wrapper {
position: relative;
z-index: 9;
}
@media (max-width: 1199.98px) {
.team-wrapper {
margin-left: 0;
}
}
.team-wrapper .team-slider {
padding-bottom: 20px;
}
.team-wrapper .team-bg-shape {
position: absolute;
top: 0;
bottom: 0;
z-index: -1;
max-width: 1300px;
}
@media (max-width: 1399.98px) {
.team-wrapper .team-bg-shape {
margin-left: 0;
left: 0;
right: 0;
}
}
.team-wrapper .team-bg-shape img {
height: 100%;
width: 100%;
}
.team-box-items {
margin-top: 30px;
}
.team-box-items .team-image {
position: relative;
overflow: hidden;
}
.team-box-items .team-image img {
width: 100%;
height: 100%;
}
.team-box-items .team-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.team-box-items .team-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-box-items .team-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.team-box-items .team-image .arrow-shape {
position: absolute;
left: 14px;
bottom: -20px;
}
.team-box-items .team-image .team-content {
padding: 14px 20px;
background-color: var(--theme-color-white);
position: absolute;
bottom: 30px;
left: 70px;
right: 30px;
left: 20px;
right: 20px;
bottom: 20px;
}
.team-box-items .team-image .team-content h4 {
line-height: 1;
}
.team-box-items .team-image .team-content h4 a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.team-box-items .team-image .team-content h4 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#144443), to(#144443));
background-image: linear-gradient(180deg, #144443 0%, #144443 100%);
}
.team-box-items .team-image .team-content .share-icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
bottom: 19px;
color: var(--theme-color-white);
cursor: pointer;
font-size: 18px;
height: 50px;
line-height: 50px;
position: absolute;
right: 20px;
text-align: center;
width: 50px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
z-index: 3;
}
.team-box-items .team-image .team-content .share-icon:hover {
background-position: 100% 0;
}
.team-box-items .team-image .team-content .social-links {
position: absolute;
right: 20px;
bottom: 75px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 5px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
background: transparent;
-webkit-transform: scaleY(0);
transform: scaleY(0);
-webkit-transform-origin: bottom;
transform-origin: bottom;
opacity: 0;
z-index: 3;
visibility: hidden;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.team-box-items .team-image .team-content .social-links a {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
color: var(--theme-color-white);
display: block;
font-size: 16px;
height: 50px;
line-height: 50px;
position: relative;
text-align: center;
width: 50px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-box-items .team-image .team-content .social-links a:hover {
background-position: 100% 0;
}
.team-box-items:hover .team-image img:nth-child(1) {
-webkit-filter: blur(0);
filter: blur(0);
opacity: 1;
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
}
.team-box-items:hover .team-image img:nth-child(2) {
-webkit-filter: blur(10px);
filter: blur(10px);
opacity: 0;
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
}
.team-box-items .team-content:hover .social-links {
opacity: 1;
-webkit-transform: scaleY(1);
transform: scaleY(1);
visibility: visible;
}
.team-box-items-4 {
background-color: var(--theme-color-white);
border-radius: 20px;
margin-top: 30px;
position: relative;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
z-index: 1;
}
[data-tm-layout=dark] .team-box-items-4 {
background-color: #144443;
}
.team-box-items-4 .team-image {
border-radius: 20px 20px 0 0;
overflow: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
position: relative;
}
.team-box-items-4 .team-image img {
width: 100%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-box-items-4 .team-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.team-box-items-4 .team-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-box-items-4 .team-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.team-box-items-4 .team-image::after {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(-135deg, rgba(23, 23, 23, 0) 0%, rgba(23, 23, 23, 0) 65%, var(--theme-color1) 100%);
content: "";
z-index: 0;
opacity: 0;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
visibility: hidden;
}
.team-box-items-4 .content-box {
padding: 20px 30px;
-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.0509803922);
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.0509803922);
border-radius: 0 0 20px 20px;
}
.team-box-items-4 .content-box .title {
margin-bottom: 0;
}
.team-box-items-4 .content-box .title a:hover {
color: var(--theme-color1);
}
.team-box-items-4 .content-box .sub-title {
font-weight: 600;
color: var(--headings-color);
font-size: 14px;
line-height: 28px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
margin-bottom: 0;
}
.team-box-items-4 .socials {
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
border-radius: 50%;
background-color: var(--headings-color);
color: var(--theme-color-white);
position: absolute;
right: 20px;
bottom: 83px;
cursor: pointer;
font-size: 14px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .team-box-items-4 .socials {
color: #ffffff;
background-color: var(--dark-color1);
}
.team-box-items-4 .socials .fa-plus {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-box-items-4 .socials ul {
width: 40px;
position: absolute;
bottom: 45px;
right: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 5px;
visibility: hidden;
}
.team-box-items-4 .socials ul li {
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(10px);
transform: translateY(10px);
-webkit-transition: all 700ms ease;
transition: all 700ms ease;
}
.team-box-items-4 .socials ul li:nth-child(2) {
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-box-items-4 .socials ul li:nth-child(3) {
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.team-box-items-4 .socials ul li:nth-child(4) {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-box-items-4 .socials ul li a {
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
background-color: var(--theme-color-white);
color: var(--theme-color4);
border-radius: 50%;
display: inline-block;
}
[data-tm-layout=dark] .team-box-items-4 .socials ul li a {
color: #ffffff;
}
.team-box-items-4 .socials ul li i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
}
.team-box-items-4 .socials ul li:hover i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.team-box-items-4:hover {
background-color: #163839;
}
.team-box-items-4:hover .team-image {
border-radius: 20px;
overflow: hidden;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.team-box-items-4:hover .team-image img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.team-box-items-4:hover .team-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.team-box-items-4:hover .team-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-box-items-4:hover .team-image::after {
opacity: 1;
visibility: visible;
}
.team-box-items-4:hover .content-box .title,
.team-box-items-4:hover .content-box .sub-title {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .team-box-items-4:hover .content-box .title,
[data-tm-layout=dark] .team-box-items-4:hover .content-box .sub-title {
color: #ffffff;
}
.team-box-items-4:hover .socials {
background-color: var(--theme-color1);
color: var(--theme-color4);
}
.team-box-items-4:hover .socials .fa-plus {
display: inline-block;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
.team-box-items-4:hover .socials ul {
visibility: visible;
}
.team-box-items-4:hover .socials ul li {
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
visibility: visible;
}
.team-wrapper-4 {
padding: 0 90px;
}
@media (max-width: 1699.98px) {
.team-wrapper-4 {
padding: 0 50px;
}
}
@media (max-width: 1399.98px) {
.team-wrapper-4 {
padding: 0 40px;
}
}
@media (max-width: 1199.98px) {
.team-wrapper-4 {
padding: 0 30px;
}
}
.team-block {
margin-top: 30px;
}
.team-block .inner-box {
position: relative;
margin-bottom: 26px;
border-radius: 30px 0 30px 30px;
overflow: hidden;
}
.team-block .inner-box::before {
content: "";
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: top right;
background-image: url(../images/home-4/team/bg-shape.png);
border-radius: 30px;
}
[data-tm-layout=dark] .team-block .inner-box::before {
background-image: url(../images/home-4/team/bg-shape-dark.png);
}
.team-block .inner-box:hover .image-box::before {
opacity: 1;
visibility: visible;
top: calc(100% - 152px);
}
.team-block .inner-box:hover .image-box .image img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.team-block .inner-box:hover .share-icon .icon {
background-color: var(--headings-color);
color: var(--theme-color-white);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.team-block .inner-box:hover .social-links {
-webkit-transform: scaleY(1);
transform: scaleY(1);
opacity: 1;
visibility: visible;
height: auto;
}
.team-block .inner-box .image-box {
position: relative;
padding-top: 12px;
}
.team-block .inner-box .image-box::before {
content: "";
position: absolute;
left: 0;
top: 100%;
width: 623.54px;
height: 623.74px;
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
-webkit-filter: blur(75px);
filter: blur(75px);
opacity: 0;
visibility: hidden;
z-index: 1;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block .inner-box .image-box .image {
margin-bottom: 0;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block .inner-box .image-box .image img {
width: 100%;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-block .share-icon {
position: absolute;
top: 0;
right: 0;
z-index: 1;
padding-left: 18px;
background-color: var(--theme-color6);
border-radius: 0 0 0 30px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .team-block .share-icon {
background-color: var(--dark-color1);
}
.team-block .share-icon::before, .team-block .share-icon::after {
content: "";
position: absolute;
width: 20px;
background-color: transparent;
z-index: -1;
-webkit-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
.team-block .share-icon::before {
top: 0;
right: 100%;
height: 40px;
-webkit-box-shadow: 0 20px 0 0 var(--theme-color6);
box-shadow: 0 20px 0 0 var(--theme-color6);
border-radius: 0 0 30px 0;
}
[data-tm-layout=dark] .team-block .share-icon::before {
-webkit-box-shadow: 0 20px 0 0 var(--dark-color1);
box-shadow: 0 20px 0 0 var(--dark-color1);
}
.team-block .share-icon::after {
right: 0;
bottom: -40px;
height: 40px;
-webkit-box-shadow: 0 17px 0 0 var(--theme-color6);
box-shadow: 0 17px 0 0 var(--theme-color6);
border-radius: 0 0 30px 0;
}
[data-tm-layout=dark] .team-block .share-icon::after {
-webkit-box-shadow: 0 20px 0 0 var(--dark-color1);
box-shadow: 0 20px 0 0 var(--dark-color1);
}
.team-block .share-icon .icon {
z-index: 3;
width: 40px;
height: 40px;
line-height: 40px;
font-size: 18px;
text-align: center;
border-radius: 50%;
color: var(--headings-color);
background-color: var(--theme-color-white);
border-top: 1px solid var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block .social-links {
position: relative;
top: 0;
right: 2px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 10px 0;
margin-top: 0;
height: 0;
opacity: 0;
visibility: hidden;
-webkit-transform: scaleY(0);
transform: scaleY(0);
-webkit-transform-origin: top;
transform-origin: top;
z-index: 3;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.team-block .social-links a {
position: relative;
width: 40px;
height: 40px;
line-height: 40px;
font-size: 16px;
text-align: center;
border-radius: 50%;
background-color: var(--headings-color);
color: var(--theme-color-white);
margin-bottom: 10px;
display: block;
z-index: 1;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block .social-links a:last-child {
margin-bottom: 0;
}
.team-block .social-links a::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
z-index: -1;
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block .social-links a:hover {
color: var(--theme-color-white);
}
.team-block .social-links a:hover::before {
-webkit-transform: scale(1);
transform: scale(1);
}
.team-block .content-box {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 30px;
z-index: 2;
}
.team-block .content-box .name {
margin-bottom: 0;
color: var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
font-size: 26px;
font-weight: 600;
font-family: var(--heading-font-family);
}
[data-tm-layout=dark] .team-block .content-box .name {
color: var(--headings-color);
}
.team-block .content-box .name a:hover {
color: var(--theme-color-white);
}
.team-block .content-box .designation {
font-size: 14px;
color: var(--theme-color-white);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
[data-tm-layout=dark] .team-block .content-box .designation {
color: var(--headings-color);
}
@media (max-width: 767.98px) {
.team-section-4 .array-button {
display: none;
}
}
.team-section-five {
padding: 120px 50px 0;
}
.team-section-five .container-fluid {
padding: 0;
}
.team-section-five.have-after {
position: relative;
z-index: 1;
}
.team-section-five.have-after::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 75%;
content: "";
z-index: -1;
background-color: var(--theme-color2);
}
.team-block-five .inner-box {
position: relative;
margin-bottom: 30px;
border-radius: 10px;
background-color: var(--theme-color-white);
overflow: hidden;
}
.team-block-five .inner-box:hover .team-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.team-block-five .inner-box:hover .team-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-block-five .inner-box:hover .content-box {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
}
.team-block-five .inner-box:hover .content-box .name {
color: var(--theme-color-white);
}
.team-block-five .inner-box:hover .content-box .designation {
color: var(--theme-color-white);
}
.team-block-five .inner-box:hover .content-box:hover {
background-position: 100% 0;
}
.team-block-five .inner-box .team-image {
border-radius: 10px;
overflow: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
position: relative;
}
.team-block-five .inner-box .team-image img {
width: 100%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block-five .inner-box .team-image img {
background-size: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.team-block-five .inner-box .team-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-block-five .inner-box .team-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.team-block-five .content-box {
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
padding: 25px 30px 25px;
z-index: 2;
text-align: center;
border-radius: 10px;
background: var(--theme-color-white);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-block-five .content-box .name {
font-size: 24px;
font-weight: 700;
line-height: 30px;
text-transform: capitalize;
margin-bottom: 8px;
color: var(--headings-color);
font-family: var(--heading-font-family);
}
.team-block-five .content-box .name a {
-webkit-transition: none;
transition: none;
}
.team-block-five .content-box .name a:hover {
color: var(--theme-color1);
}
.team-block-five .content-box .designation {
font-size: 16px;
font-weight: 400;
line-height: 30px;
text-transform: capitalize;
color: var(--theme-color-gray2);
}
.team-block-five .content-box .social-links {
margin-top: 10px;
display: none;
}
.team-block-five .content-box .social-links ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 10px;
}
.team-block-five .content-box .social-links ul li a {
position: relative;
width: 24px;
height: 24px;
line-height: 24px;
font-size: 14px;
text-align: center;
border-radius: 50%;
color: var(--headings-color);
background-color: var(--theme-color-white);
display: block;
z-index: 1;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block-five .content-box .social-links ul li a:hover {
color: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
.team-section-six .btn-style-two {
max-width: 209px;
width: 100%;
margin: 0 auto;
margin-right: 0;
display: block;
margin-bottom: 20px;
}
@media (max-width: 767.98px) {
.team-section-six .btn-style-two {
margin: 0;
}
}
[data-tm-layout=dark] .team-section-six .btn-style-two {
color: #ffffff;
}
[data-tm-layout=dark] .team-section-six .btn-style-two .icon {
background-color: #ffffff;
}
.team-block-six .inner-box {
position: relative;
padding: 10px;
margin-bottom: 30px;
border-radius: 8px;
overflow: hidden;
border: 1px solid rgb(var(--theme-color-black-rgb), 0.1);
}
[data-tm-layout=dark] .team-block-six .inner-box {
background-color: var(--dark-color2);
border-color: var(--dark-color2);
}
.team-block-six .inner-box:hover .team-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.team-block-six .inner-box:hover .team-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-block-six .inner-box:hover .content-box .social-links {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
visibility: visible;
}
.team-block-six .inner-box .team-image {
border-radius: 8px;
overflow: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
position: relative;
height: 250px;
}
.team-block-six .inner-box .team-image img {
width: 100%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block-six .inner-box .team-image img {
object-fit: cover;
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
height: 100%;
}
.team-block-six .inner-box .team-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.team-block-six .inner-box .team-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.team-block-six .content-box {
position: relative;
padding: 20px;
padding-bottom: 10px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-block-six .content-box .name {
font-size: 22px;
line-height: 35px;
font-weight: 700;
vertical-align: middle;
margin-bottom: 8px;
color: var(--headings-color);
}
.team-block-six .content-box .name a {
-webkit-transition: none;
transition: none;
}
.team-block-six .content-box .name a:hover {
color: var(--theme-color1);
}
.team-block-six .content-box .designation {
font-weight: 500;
font-size: 15px;
line-height: 30px;
text-transform: capitalize;
color: var(--theme-color-gray2);
}
.team-block-six .content-box .social-links {
position: absolute;
right: 15px;
bottom: 30px;
-webkit-transform: translateX(100%);
transform: translateX(100%);
opacity: 0;
z-index: 99;
visibility: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 1399.98px) {
.team-block-six .content-box .social-links {
bottom: 15px;
}
}
.team-block-six .content-box .social-links ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 10px;
}
@media (max-width: 1199.98px) {
.team-block-six .content-box .social-links ul {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.team-block-six .content-box .social-links ul li a {
position: relative;
width: 30px;
height: 30px;
line-height: 30px;
font-size: 12px;
text-align: center;
border-radius: 50%;
color: var(--headings-color);
background: var(--theme-color-white);
-webkit-box-shadow: 0 1px 4px rgba(12, 12, 13, 0.1);
box-shadow: 0 1px 4px rgba(12, 12, 13, 0.1);
display: block;
z-index: 1;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.team-block-six .content-box .social-links ul li a:hover {
color: var(--theme-color-white);
background: -webkit-gradient(linear, left top, right top, from(#C8F169), to(#039397));
background: linear-gradient(90deg, #C8F169 0%, #039397 100%);
}
/***
====================================================================
Contact Sectiom
====================================================================
***/
.contact-content-1 .sec-title .triangle2 {
border-left-color: #67A19F;
}
.contact-content-1 .form-box {
background-color: #fff;
padding: 65px 42px;
border-radius: 20px;
margin-top: 70px;
max-width: 590px;
}
[data-tm-layout=dark] .contact-content-1 .form-box {
background-color: var(--dark-color2);
}
@media (max-width: 767.98px) {
.contact-content-1 .form-box {
margin-top: 30px;
padding: 40px 30px;
}
}
.contact-content-1 .form-box .form-clt input, .contact-content-1 .form-box .form-clt textarea {
width: 100%;
border: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding-bottom: 20px;
outline: none;
background-color: #fff;
color: var(--text-color);
text-transform: capitalize;
}
[data-tm-layout=dark] .contact-content-1 .form-box .form-clt input, [data-tm-layout=dark] .contact-content-1 .form-box .form-clt textarea {
color: rgba(204, 204, 204, 0.8);
background-color: transparent;
border-color: rgba(255, 255, 255, 0.1);
}
.contact-content-1 .form-box .form-clt textarea {
padding-bottom: 40px;
}
.contact-content-1 .form-box .form-clt button {
border: none;
}
.contact-content-1 .form-box .form-clt .btn-style-one {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
color: #fff;
padding: 24px 42px;
}
.contact-content-1 .form-box .form-clt .btn-style-one:before {
display: none;
}
.contact-content-1 .form-box .form-clt .btn-style-one:hover {
background-position: 100% 0;
}
.contact-image-1 {
position: absolute;
top: 0;
bottom: 0;
right: 0;
z-index: 9;
}
@media (max-width: 1399.98px) {
.contact-image-1 {
max-width: 600px;
}
.contact-image-1 img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
@media (max-width: 1199.98px) {
.contact-image-1 {
max-width: 500px;
}
}
@media (max-width: 991.98px) {
.contact-image-1 {
position: static;
height: 600px;
max-width: initial;
}
}
.contact-image-1 img {
height: 100%;
}
.contact-image-1 .contact-info-box {
border-radius: 20px;
position: absolute;
bottom: 130px;
left: -36%;
padding: 55px 70px;
background-color: #093736;
overflow: hidden;
}
@media (max-width: 1699.98px) {
.contact-image-1 .contact-info-box {
left: 0;
bottom: 0;
}
}
@media (max-width: 767.98px) {
.contact-image-1 .contact-info-box {
padding: 30px;
}
}
.contact-image-1 .contact-info-box h2 {
font-size: 36px;
color: #fff;
max-width: 322px;
margin-bottom: 30px;
}
@media (max-width: 767.98px) {
.contact-image-1 .contact-info-box h2 {
font-size: 24px;
}
}
.contact-image-1 .contact-info-box .contact-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 17px;
}
.contact-image-1 .contact-info-box .contact-list li:not(:last-child) {
margin-bottom: 24px;
}
.contact-image-1 .contact-info-box .contact-list li .icon {
width: 72px;
height: 72px;
line-height: 72px;
border-radius: 50%;
background-color: var(--theme-color1);
text-align: center;
color: var(--headings-color);
font-size: 30px;
}
.contact-image-1 .contact-info-box .contact-list li .icon img {
width: initial;
height: initial;
}
.contact-image-1 .contact-info-box .contact-list li .content h3 {
font-size: 24px;
color: #fff;
font-family: var(--body-font);
font-weight: 600;
line-height: 1;
}
.contact-image-1 .contact-info-box .contact-list li .content p {
font-size: 16px;
}
.contact-image-1 .contact-info-box .contact-list li .content p a {
color: #fff;
}
.contact-image-1 .contact-info-box .ellipse-bg {
width: 232px;
height: 249.521px;
position: absolute;
bottom: -30%;
right: -60px;
background: rgba(200, 241, 105, 0.5);
-webkit-filter: blur(100px);
filter: blur(100px);
z-index: -1;
}
.contact-section {
position: relative;
background-color: #144443;
z-index: 9;
}
@media (max-width: 991.98px) {
.contact-section {
padding-bottom: 0;
}
}
.contact-section .shape-image {
position: absolute;
top: 27%;
left: -40%;
-webkit-animation: rounded 5s linear infinite;
animation: rounded 5s linear infinite;
}
@media (max-width: 1699.98px) {
.contact-section .shape-image {
display: none;
}
}
.contact-section .contact-shape {
position: absolute;
left: 0;
bottom: 130px;
z-index: -1;
}
.contact-content-style-3 .contact-text {
margin-top: 25px;
max-width: 405px;
}
.contact-content-style-3 .contact-list {
margin-top: 50px;
}
.contact-content-style-3 .contact-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
}
.contact-content-style-3 .contact-list li:not(:last-child) {
margin-bottom: 30px;
}
.contact-content-style-3 .contact-list li .icon {
max-width: 70px;
width: 100%;
height: 70px;
line-height: 70px;
border-radius: 50%;
text-align: center;
background-color: var(--theme-color-white);
font-size: 32px;
color: var(--headings-color);
}
[data-tm-layout=dark] .contact-content-style-3 .contact-list li .icon img {
-webkit-filter: invert(1);
filter: invert(1);
}
.contact-content-style-3 .contact-list li .content span {
display: inline-block;
margin-bottom: 5px;
}
.contact-content-style-3 .contact-list li .content h3 {
font-size: 27px;
font-weight: 600;
font-family: var(--body-font);
}
.contact-box-style-3 {
text-align: center;
background-color: var(--theme-color-white);
-webkit-box-shadow: 0px 7px 24px rgba(0, 0, 0, 0.06);
box-shadow: 0px 7px 24px rgba(0, 0, 0, 0.06);
border-radius: 5px;
padding: 40px 45px;
position: relative;
}
.contact-box-style-3 h3 {
font-size: 27px;
font-weight: bold;
}
.contact-box-style-3 p {
color: var(--headings-color);
}
.contact-box-style-3 form {
margin-top: 40px;
}
.contact-box-style-3 form .input {
position: relative;
z-index: 1;
}
.contact-box-style-3 form .input input {
padding: 12px 20px;
border-radius: 5px;
border: 1px solid #e4e4e4;
width: 100%;
}
[data-tm-layout=dark] .contact-box-style-3 form .input input {
background: transparent;
color: rgba(204, 204, 204, 0.8);
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.contact-box-style-3 form .input input:focus {
border: 1px solid var(--theme-color1);
}
.contact-box-style-3 form .input .icon {
position: absolute;
top: 13px;
right: 20px;
font-size: 18px;
}
.contact-box-style-3 form .nice-select {
z-index: 1;
}
[data-tm-layout=dark] .contact-box-style-3 form .nice-select {
background: var(--dark-color2);
color: rgba(204, 204, 204, 0.8);
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.contact-box-style-3 form textarea {
font-weight: 500;
height: 125px;
padding: 8px 20px;
border-radius: 5px;
border: 1px solid #e4e4e4;
width: 100%;
}
[data-tm-layout=dark] .contact-box-style-3 form textarea {
background: transparent;
color: rgba(204, 204, 204, 0.8);
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.contact-box-style-3 form textarea:focus {
border: 1px solid var(--theme-color1);
}
.contact-box-style-3 form .theme-btn {
position: relative;
}
.contact-box-style-3 form .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 30px;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .contact-box-style-3 form .theme-btn.btn-style-one {
color: var(--headings-color);
}
@media only screen and (max-width: 767px) {
.contact-box-style-3 form .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.contact-box-style-3 form .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.contact-box-style-3 form .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.contact-box-style-3 form .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.contact-box-style-3 form .theme-btn.btn-style-one:before {
display: none;
}
.contact-box-style-3 form .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.contact-box-style-3 form .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.contact-box-style-3 form .theme-btn .icon {
background-color: #fff;
border-radius: 50%;
bottom: 4px;
color: var(--theme-color-black);
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
width: 62px;
}
.contact-section-3 {
position: relative;
}
.contact-section-3 .contact-image {
position: absolute;
bottom: 0;
right: 30px;
z-index: -1;
}
@media (max-width: 1399.98px) {
.contact-section-3 .contact-image {
display: none;
}
}
.nice-select {
width: 100%;
border-radius: 5px;
height: 61px;
line-height: 61px;
border: 1px solid #e4e4e4;
padding-top: 0;
}
.nice-select::after {
display: none;
}
.nice-select::before {
font-family: "Font Awesome 6 pro";
content: "\f107";
font-weight: 900;
position: absolute;
top: 0;
right: 15px;
color: #696969;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.nice-select.open::before {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.nice-select:focus {
border: 1px solid #e4e4e4;
}
.nice-select .list {
width: 100%;
}
.nice-select .current {
font-size: 16px;
color: var(--text-color);
}
.contact-two-area {
position: relative;
z-index: 1;
background-color: var(--theme-color2);
}
.contact-two__form {
max-width: 590px;
width: 100%;
padding: 40px;
border-radius: 20px;
background-color: var(--theme-color-white);
}
[data-tm-layout=dark] .contact-two__form {
background-color: var(--dark-color2);
}
.contact-two__form form .form-title {
font-size: 32px;
font-weight: 600;
line-height: 40px;
vertical-align: middle;
margin-bottom: 20px;
color: var(--theme-color2);
}
[data-tm-layout=dark] .contact-two__form form .form-title {
color: #ffffff;
}
.contact-two__form form .input {
margin-bottom: 20px;
}
.contact-two__form form .input input {
width: 100%;
font-family: var(--body-font-family);
font-weight: 400;
font-size: 16px;
line-height: 30px;
padding-bottom: 20px;
color: #949494;
text-transform: capitalize;
border-bottom: 1px solid rgba(var(--theme-color-black-rgb), 0.2);
}
[data-tm-layout=dark] .contact-two__form form .input input {
color: rgba(204, 204, 204, 0.8);
background-color: transparent;
border-color: 1px solid rgba(var(--theme-color-white-rgb), 0.2);
}
.contact-two__form form .textarea {
margin-bottom: 30px;
}
.contact-two__form form .textarea textarea {
width: 100%;
border: none;
padding-bottom: 20px;
resize: none;
color: #949494;
border-bottom: 1px solid rgba(var(--theme-color-black-rgb), 0.2);
}
[data-tm-layout=dark] .contact-two__form form .textarea textarea {
color: rgba(204, 204, 204, 0.8);
background-color: transparent;
border-color: 1px solid rgba(var(--theme-color-white-rgb), 0.2);
}
.contact-two__form form .btn-style-two {
width: 100%;
padding: 22px 50px;
}
[data-tm-layout=dark] .contact-two__form form .btn-style-two {
color: #ffffff;
}
.contact-two_shape {
position: absolute;
top: 120px;
left: 0;
z-index: -1;
}
.contact-two__map {
position: absolute;
top: 150px;
right: 0;
max-width: 950px;
width: 100%;
height: 720px;
z-index: -1;
background-repeat: no-repeat;
background-size: contain;
background-position: center right;
}
@media (max-width: 1699.98px) {
.contact-two__map {
max-width: 700px;
}
}
.contact-two__map .location {
position: absolute;
top: 28%;
right: 33%;
}
@media (max-width: 1399.98px) {
.contact-two__map .location {
right: 10%;
max-width: 350px;
}
}
@media (max-width: 1199.98px) {
.contact-two__map .location {
right: 10%;
max-width: 250px;
}
}
@media (max-width: 991.98px) {
.contact-two__map .location {
display: none;
}
}
.contact-two__map .location img {
width: unset;
}
.contact-four-area {
position: relative;
z-index: 1;
}
.contact-four-area:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
background-color: rgba(var(--theme-color2-rgb), 0.95);
}
.contact-four-area .sec-title .text {
margin-top: 0px;
}
.contact-four__wrp {
max-width: 1550px;
margin: 0 auto;
position: relative;
z-index: 1;
}
.contact-four__wrp .contact-form {
-webkit-transform: translateY(-120px);
transform: translateY(-120px);
}
.contact-four__wrp .contact-form .contact-four__form {
background-color: var(--theme-color-white);
-webkit-box-shadow: -10px 0px 35px 0px rgba(var(--theme-color-black-rgb), 0.08);
box-shadow: -10px 0px 35px 0px rgba(var(--theme-color-black-rgb), 0.08);
}
.contact-four__form {
padding: 80px;
background-color: var(--theme-color-white);
}
.contact-four__form .section-header {
max-width: 380px;
}
.contact-four__form form input,
.contact-four__form form textarea {
width: 100%;
padding: 9px 20px;
border: 1px solid rgba(var(--theme-color-black-rgb), 0.1);
margin-bottom: 20px;
background-color: transparent;
}
[data-tm-layout=dark] .contact-four__form form input,
[data-tm-layout=dark] .contact-four__form form textarea {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
.contact-four__form form textarea {
height: 150px;
resize: none;
}
@media (max-width: 991.98px) {
.contact-four__form {
padding: 60px 15px;
}
}
.contact-four__image {
position: relative;
z-index: 1;
overflow: hidden;
height: 100%;
}
.contact-four__image::before {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background: -webkit-gradient(linear, left bottom, left top, color-stop(21.63%, rgba(0, 0, 0, 0.65)), color-stop(62.77%, rgba(0, 0, 0, 0)));
background: linear-gradient(360deg, rgba(0, 0, 0, 0.65) 21.63%, rgba(0, 0, 0, 0) 62.77%);
content: "";
}
.contact-four__image img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.contact-four__image .content {
position: absolute;
bottom: 50px;
left: 50px;
right: 50px;
}
.contact-four__image .content .title {
font-size: 32px;
line-height: 40px;
font-weight: 600;
font-family: var(--heading-font-family);
color: var(--theme-color-white);
}
[data-tm-layout=dark] .contact-four__image .content .title {
color: #ffffff;
}
.contact-four__image .info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: 50px;
gap: 10px;
}
@media (max-width: 991.98px) {
.contact-four__image .info {
margin-top: 20px;
}
}
.contact-four__image .info span {
font-size: 12px;
line-height: 28px;
font-weight: 400;
}
.contact-four__image .info .logo {
width: auto;
}
.contact-four__brand .marqueeSwiper-five-area {
overflow: hidden;
}
.contact-four__brand .marqueeSwiper-five__slider .swiper-wrapper {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition-timing-function: linear;
transition-timing-function: linear;
}
.contact-four__brand .brand-two__item {
text-align: center;
}
.contact-four__brand-text {
font-size: 18px;
line-height: 24px;
font-weight: 400;
color: var(--theme-color-white);
text-align: center;
margin-bottom: 0;
}
[data-tm-layout=dark] .contact-four__brand-text {
color: #ffffff;
}
.contact-four__brand-text .hover-link-light {
margin-left: 10px;
color: var(--theme-color1);
}
@media (max-width: 575.98px) {
.contact-four__brand-text .hover-link-light {
margin-left: 0;
display: block;
}
}
.contact-four__rectangle {
position: absolute;
z-index: -1;
width: 160px;
height: 160px;
bottom: 80px;
right: 0;
}
.contact-four__rectangle .item-one {
width: 80px;
height: 80px;
background-color: var(--theme-color-white);
width: 0;
-webkit-transition: all 0.3s ease-in-out 0.2s;
transition: all 0.3s ease-in-out 0.2s;
position: absolute;
bottom: 80px;
right: 0;
}
.contact-four__rectangle .item-one.animated {
width: 80px;
}
.contact-four__rectangle .item-two {
width: 80px;
height: 0px;
background-color: rgba(255, 255, 255, 0.3019607843);
backdrop-filter: blur(20px);
-webkit-transition: all 0.3s ease-in-out 0.5s;
transition: all 0.3s ease-in-out 0.5s;
position: absolute;
top: 80px;
left: 0px;
}
.contact-four__rectangle .item-two.animated {
height: 80px;
}
.contact-four__rectangle .item-three {
width: 80px;
height: 0px;
background-color: var(--theme-color-white);
backdrop-filter: blur(20px);
-webkit-transition: all 0.3s ease-in-out 0.8s;
transition: all 0.3s ease-in-out 0.8s;
position: absolute;
top: 160px;
left: 80px;
}
.contact-four__rectangle .item-three.animated {
height: 80px;
}
@media (max-width: 991.98px) {
.contact-four__rectangle {
display: none;
}
}
/***
====================================================================
News Section
====================================================================
***/
.news-box-items {
border-radius: 8px;
background: #FFF;
-webkit-box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 100px 0px rgba(0, 0, 0, 0.1);
padding: 25px;
}
.news-box-items .news-image {
position: relative;
z-index: 2;
overflow: hidden;
width: 100%;
height: 250px;
border-radius: 8px;
}
.news-box-items .news-image img {
-webkit-transition: 0.5s;
transition: 0.5s;
width: 100%;
}
.news-box-items .news-image img:nth-child(1) {
-webkit-transform: translatex(50%) scalex(2);
transform: translatex(50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
.news-box-items .news-image img:nth-child(2) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
-o-object-fit: cover;
object-fit: cover;
}
.news-box-items .news-image img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
border-radius: 8px;
}
.news-box-items .news-image .post-box {
position: absolute;
top: 20px;
left: 20px;
width: 70px;
height: 70px;
background: #144443;
text-align: center;
padding-top: 13px;
}
.news-box-items .news-image .post-box .date {
font-size: 24px;
font-family: var(--heading-font-family);
font-weight: 700;
color: var(--theme-color1);
line-height: 1;
}
.news-box-items .news-image .post-box .month {
display: block;
font-size: 12px;
font-weight: 400;
color: #fff;
font-family: var(--body-font);
line-height: 1;
}
.news-box-items .news-content {
margin-top: 20px;
}
.news-box-items .news-content .comments-list {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 8px;
background: #F5F5F5;
padding: 12px 17px;
line-height: 1;
margin-bottom: 10px;
}
@media (max-width: 1199.98px) {
.news-box-items .news-content .comments-list {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 18px;
}
}
.news-box-items .news-content .comments-list li {
font-size: 14px;
}
.news-box-items .news-content .comments-list li i {
color: var(--headings-color);
margin-right: 5px;
}
.news-box-items .news-content .comments-list svg {
margin-right: 5px;
}
[data-tm-layout=dark] .news-box-items .news-content .comments-list svg path {
fill: #fff;
}
.news-box-items .news-content h3 {
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
padding-bottom: 10px;
margin-bottom: 10px;
font-size: 18px;
line-height: 25px;
margin-top: 0;
}
[data-tm-layout=dark] .news-box-items .news-content h3 {
border-color: rgb(var(--theme-color-white-rgb), 0.1);
}
@media (max-width: 1199.98px) {
.news-box-items .news-content h3 {
font-size: 20px;
}
}
.news-box-items .news-content h3 a {
background-position: 0 95%;
background-repeat: no-repeat;
background-size: 0% 2px;
display: inline;
}
.news-box-items .news-content h3 a:hover {
background-size: 100% 2px;
background-image: -webkit-gradient(linear, left top, left bottom, from(var(--headings-color)), to(var(--headings-color)));
background-image: linear-gradient(180deg, var(--headings-color) 0%, var(--headings-color) 100%);
}
.news-box-items .news-content .link-btn {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #144443;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-family: var(--heading-font-family);
font-size: 16px;
font-weight: 600;
padding-top: 10px;
}
[data-tm-layout=dark] .news-box-items .news-content .link-btn {
color: var(--link-color);
}
.news-box-items .news-content .link-btn .icon {
background: linear-gradient(99deg, #f58a20 0%, #f06723 93.92%);
border-radius: 26px;
color: var(--theme-color-white);
display: inline-block;
height: 26px;
line-height: 28px;
margin-left: 5px;
text-align: center;
width: 26px;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.news-box-items .news-content .link-btn .icon i {
display: inline-block;
font-size: 14px;
}
.news-box-items .news-content .link-btn:hover .icon {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
.news-box-items:hover .news-image img:nth-child(1) {
-webkit-transform: translatex(0) scalex(1);
transform: translatex(0) scalex(1);
opacity: 1;
-webkit-filter: blur(0);
filter: blur(0);
}
.news-box-items:hover .news-image img:nth-child(2) {
-webkit-transform: translatex(-50%) scalex(2);
transform: translatex(-50%) scalex(2);
opacity: 0;
-webkit-filter: blur(10px);
filter: blur(10px);
}
/***
====================================================================
Clients Section
====================================================================
***/
.clients-section {
position: relative;
z-index: 1;
}
.clients-section.alternate {
border-top: 1px solid #e6e8ed;
}
.clients-section.border-bottom {
border-bottom: 1px solid #e6e8ed;
}
.clients-section.border-top {
border-top: 1px solid #e6e8ed;
}
.clients-section.border-top-bottom {
border-top: 1px solid #e6e8ed;
border-bottom: 1px solid #e6e8ed;
}
.clients-section.style-two {
background-color: #fff;
border-top: 1px solid rgba(171, 159, 159, 0.3);
}
.clients-carousel {
position: relative;
padding: 100px 0;
}
.clients-carousel .slide-item {
position: relative;
overflow: hidden;
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.clients-carousel .slide-item a {
position: relative;
display: block;
padding: 20px 20px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.clients-carousel .slide-item a:hover {
background-color: #f4f5f8;
}
.clients-carousel .slide-item a:hover img {
opacity: 1;
-webkit-filter: none;
filter: none;
}
.clients-carousel .slide-item img {
display: inline-block;
max-width: 100%;
width: auto;
height: auto;
opacity: 0.4;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.clients-carousel .owl-nav {
position: absolute;
left: 0;
top: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 25px;
background-color: #ffffff;
max-width: 110px;
right: 0;
margin: -13px auto 0;
}
.clients-carousel .owl-nav .owl-prev,
.clients-carousel .owl-nav .owl-next {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
height: 26px;
width: 26px;
background-color: var(--bg-theme-color3);
color: #7c858c;
font-size: 14px;
margin: 0 3px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.clients-carousel .owl-nav .owl-prev:hover,
.clients-carousel .owl-nav .owl-next:hover {
background-color: var(--bg-theme-color2);
color: #ffffff;
}
.clients-carousel .owl-dots {
display: none;
}
/***
====================================================================
Growth Section
====================================================================
***/
.growth-section {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
border-radius: 25px;
margin: 0 30px;
overflow: hidden;
position: relative;
z-index: 1;
}
@media (max-width: 1399.98px) {
.growth-section {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.growth-section {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.growth-section .sec-shape {
position: absolute;
bottom: 0;
left: 0;
z-index: 0;
}
.growth-section::after {
background: radial-gradient(95.51% 264.21% at 92.63% 41.85%, rgba(0, 7, 31, 0) 0%, rgba(4, 44, 42, 0.98) 99.98%, rgba(4, 44, 42, 0.98) 99.99%);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.growth-section .sec-title {
border-bottom: 1px solid rgba(230, 230, 230, 0.212);
padding-bottom: 50px;
margin-bottom: 30px;
}
.growth-section .theme-btn {
position: relative;
}
.growth-section .theme-btn.btn-style-one {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 100px;
color: var(--theme-color-white);
height: 70px;
padding: 26px 60px;
padding-right: 100px;
}
[data-tm-layout=dark] .growth-section .theme-btn.btn-style-one {
color: var(--headings-color);
}
@media only screen and (max-width: 767px) {
.growth-section .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.growth-section .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.growth-section .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.growth-section .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.growth-section .theme-btn.btn-style-one:before {
display: none;
}
.growth-section .theme-btn.btn-style-one:hover {
background-position: 100% 0;
}
.growth-section .theme-btn.btn-style-one:hover .icon {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.growth-section .theme-btn .icon {
background-color: var(--theme-color-white);
color: var(--theme-color-black);
border-radius: 50%;
bottom: 4px;
font-size: 50px;
height: 62px;
line-height: 72px;
position: absolute;
right: 4px;
top: 4px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 62px;
}
.growth-block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 30px;
}
.growth-block .pie-graph {
position: relative;
z-index: 1;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
height: 122px;
}
.growth-block .pie-graph .inner-text {
width: 80px;
height: 80px;
line-height: 80px;
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
font-weight: 700;
font-size: 20px;
color: var(--theme-color-white);
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
border-radius: 50%;
font-family: var(--heading-font-family);
}
[data-tm-layout=dark] .growth-block .pie-graph .inner-text {
color: var(--headings-color);
}
.growth-block .content-box .title {
font-size: 20px;
text-transform: capitalize;
color: var(--theme-color-white);
margin-bottom: 10px;
}
[data-tm-layout=dark] .growth-block .content-box .title {
color: var(--headings-color);
}
.growth-block .content-box .text {
font-size: 16px;
line-height: 28.8px;
color: #d1d5db;
margin-bottom: 0;
}
.growth-block:hover .pie-graph .inner-text {
background-position: 100% 0;
}
.growth-section-two {
position: relative;
z-index: 1;
overflow: hidden;
background-size: cover;
background-position: bottom;
background-repeat: no-repeat;
height: 710px;
}
@media (max-width: 1399.98px) {
.growth-section-two {
height: 600px;
}
}
@media (max-width: 1199.98px) {
.growth-section-two {
height: auto;
background-image: none !important;
background-color: var(--theme-color-gray2);
}
}
.growth-section-two .bg-shape {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: -1;
}
.growth-section-two .outer-box {
max-width: 1250px;
margin: 0 auto;
}
.growth-section-two .growth-block .pie-graph .inner-text {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.growth-section-two .growth-block .content-box .title {
color: var(--headings-color);
}
.growth-section-two .growth-block .content-box .text {
color: var(--body-font-family);
}
.feature-growth-box-items {
margin-top: 30px;
padding: 34px 25px;
padding-top: 0;
position: relative;
text-align: center;
z-index: 9;
}
.feature-growth-box-items::before {
background-color: var(--theme-color-white);
border-radius: 15px;
height: initial;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
top: 50px;
z-index: -1;
height: initial;
}
.feature-growth-box-items::after {
background-color: var(--headings-color);
border-radius: 15px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
content: "";
height: initial;
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transition: -webkit-transform 500ms ease;
transition: -webkit-transform 500ms ease;
transition: transform 500ms ease;
transition: transform 500ms ease, -webkit-transform 500ms ease;
-webkit-transform-origin: bottom center;
transform-origin: bottom center;
top: 50px;
z-index: -1;
}
[data-tm-layout=dark] .feature-growth-box-items::after {
opacity: 0.5;
background-color: var(--dark-color1);
}
.feature-growth-box-items .icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border-radius: 50%;
font-size: 40px;
color: var(--theme-color-white);
height: 103px;
line-height: 103px;
margin: 0 auto;
text-align: center;
width: 103px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.feature-growth-box-items .icon i {
-webkit-transition: all 900ms ease;
transition: all 900ms ease;
display: inline-block;
}
.feature-growth-box-items .content {
margin-top: 25px;
}
.feature-growth-box-items .content h3 {
margin-bottom: 15px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.feature-growth-box-items .content p {
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.feature-growth-box-items.style-top {
margin-top: 60px;
}
@media (max-width: 1199.98px) {
.feature-growth-box-items.style-top {
margin-top: 30px;
}
}
.feature-growth-box-items:hover::after {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
-webkit-transform-origin: top center;
transform-origin: top center;
}
.feature-growth-box-items:hover i {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.feature-growth-box-items:hover .icon {
background-position: 100% 0;
}
.feature-growth-box-items:hover .content h3 {
color: #fff;
}
.feature-growth-box-items:hover .content p {
color: #F5F5F5;
}
/***
====================================================================
Products details
====================================================================
***/
.product-details .bxslider .image-box {
position: relative;
display: block;
margin-right: 30px;
margin-bottom: 10px;
}
.product-details .bxslider .image-box img {
width: 100%;
}
.product-details .bxslider .thumb-box li {
position: relative;
display: inline-block;
float: left;
margin-right: 10px;
margin-bottom: 15px;
width: 100px;
height: 100px;
}
.product-details .bxslider .thumb-box li:last-child {
margin: 0px !important;
}
.product-details .bxslider .thumb-box li a {
position: relative;
display: inline-block;
}
.product-details .bxslider .thumb-box li a:before {
position: absolute;
content: "";
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.product-details .bxslider .thumb-box li a.active:before {
opacity: 1;
}
.product-details .bx-wrapper {
margin-bottom: 30px;
}
.product-details .product-info .product-details__top {
position: relative;
display: block;
margin-top: -8px;
}
.product-details .product-info .product-details__title {
font-size: 40px;
line-height: 44px;
font-weight: 700;
margin: 0;
}
.product-details .product-info .product-details__title span {
position: relative;
display: inline-block;
color: var(--theme-color2);
font-size: 20px;
line-height: 26px;
font-weight: 700;
margin-left: 20px;
letter-spacing: 0;
}
.product-details .product-info .product-details__reveiw {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 22px;
padding-bottom: 20px;
margin-bottom: 31px;
border-bottom: 1px solid #e0e4e8;
}
.product-details .product-info .product-details__reveiw i {
font-size: 16px;
color: #ffc737;
}
.product-details .product-info .product-details__reveiw i + i {
margin-left: 4px;
}
.product-details .product-info .product-details__reveiw span {
position: relative;
top: 1px;
line-height: 1;
font-size: 16px;
color: var(--theme-color2);
margin-left: 18px;
}
.product-details .product-info .product-details__quantity-title {
margin: 0;
color: #222;
font-size: 20px;
line-height: 30px;
font-weight: 700;
margin-right: 20px;
}
.product-details .product-info .product-details__buttons {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 30px;
margin-top: 40px;
}
@media only screen and (max-width: 767px) {
.product-details .product-info .product-details__buttons {
display: block;
}
}
.product-details .product-info .product-details__buttons-1 {
position: relative;
display: block;
}
@media only screen and (max-width: 767px) {
.product-details .product-info .product-details__buttons-1 {
margin-bottom: 10px;
margin-right: 10px;
}
}
.product-details .product-info .product-details__buttons-1 .btn-title {
color: var(--headings-color);
text-transform: capitalize;
font-weight: 500;
}
.product-details .product-info .product-details__buttons-2 {
position: relative;
display: block;
margin-left: 10px;
}
.product-details .product-info .product-details__buttons-2 .thm-btn {
background-color: var(--theme-color2);
}
.product-details .product-info .product-details__buttons-2 .thm-btn:before {
background-color: var(--theme-color1);
}
.product-details .product-info .product-details__buttons-2 .thm-btn:after {
background-color: var(--theme-color1);
}
@media only screen and (max-width: 767px) {
.product-details .product-info .product-details__buttons-2 {
margin-left: 0;
margin-top: 0;
}
}
.product-details .product-info .product-details__social {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.product-details .product-info .product-details__social .social-icon-one {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.product-details .product-info .product-details__social .social-icon-one li {
position: relative;
margin-left: 20px;
}
.product-details .product-info .product-details__social .social-icon-one li:first-child {
margin-left: 0;
}
.product-details .product-info .product-details__social .social-icon-one li a {
position: relative;
display: block;
font-size: 12px;
line-height: 30px;
color: var(--theme-color-dark);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-details .product-info .product-details__social .social-icon-one li a:hover {
color: var(--theme-color1);
}
.product-details .product-info .product-details__social .title {
position: relative;
display: block;
}
.product-details .product-info .product-details__social .title h3 {
color: #222;
font-size: 20px;
line-height: 20px;
font-weight: 700;
}
.product-details .product-info .product-details__social .social-icon-one {
margin-left: 30px;
}
@media only screen and (max-width: 767px) {
.product-details .product-info .product-details__social {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
}
.product-details .product-info .product-details__social .social-icon-one {
margin-left: 0;
}
}
.product-details__quantity {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-top: 20px;
position: relative;
}
.product-details__quantity .quantity-box {
border-radius: 10px;
height: 60px;
position: relative;
width: 98px;
}
.product-details__quantity .quantity-box input {
border: 1px solid #e0e4e8;
border-radius: 10px;
color: var(--theme-color2);
font-size: 18px;
font-weight: 500;
height: 60px;
outline: none;
padding-left: 30px;
-webkit-appearance: textfield;
-moz-appearance: textfield;
width: 98px;
}
.product-details__quantity .quantity-box button {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: none;
border-left: 1px solid #e0e4e8;
border-top-right-radius: 10px;
background-color: var(--theme-color2);
color: #fff;
font-size: 8px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 29px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
outline: none;
position: absolute;
right: 1px;
top: 1px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
width: 29px;
}
.product-details__quantity .quantity-box button:hover {
background-color: var(--theme-color1);
color: var(--headings-color);
}
.product-details__quantity .quantity-box button.sub {
bottom: 1px;
border-top-right-radius: 0px;
border-bottom-right-radius: 10px;
top: auto;
}
.product-discription {
display: block;
position: relative;
}
.product-discription .product-description__title {
font-size: 30px;
margin-bottom: 27px;
}
.product-discription .product-description__text1 {
font-size: 16px;
line-height: 30px;
margin: 0;
}
.product-discription .product-description__list {
display: block;
margin-top: 30px;
margin-bottom: 30px;
position: relative;
}
.product-discription .product-description__list ul {
display: block;
position: relative;
}
.product-discription .product-description__list ul li {
display: block;
margin-bottom: 2px;
position: relative;
}
.product-discription .product-description__list ul li:last-child {
margin-bottom: 0px;
}
.product-discription .product-description__list ul li p {
color: var(--headings-color);
font-weight: 600;
margin: 0;
}
.product-discription .product-description__list ul li p span:before {
color: var(--theme-color1);
display: inline-block;
font-size: 17px;
line-height: 17px;
margin-right: 11px;
position: relative;
top: 2px;
}
.product-discription .tabs-content .text p {
margin-bottom: 17px;
}
.product-discription .tabs-content .text p:last-child {
margin-bottom: 0px;
}
.product-discription .tab-btn-box {
position: relative;
display: block;
width: 100%;
margin-bottom: 60px;
}
.product-discription .tab-btn-box:before {
position: absolute;
content: "";
background-color: #e1e8e4;
width: 100%;
height: 1px;
left: 0px;
top: 28px;
}
.product-discription .tab-btn-box .tab-btns li {
position: relative;
display: inline-block;
font-size: 14px;
text-transform: uppercase;
color: #1e2434;
text-align: center;
padding: 14px 30px;
background-color: #fff;
border: 1px solid #e1e8e4;
cursor: pointer;
margin: 0px 8.5px;
margin-bottom: 15px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.product-discription .tab-btn-box .tab-btns li.active-btn {
background-color: var(--theme-color2);
color: #fff;
}
.product-discription .tab-btn-box .tab-btns li:last-child {
margin-bottom: 0;
}
.product-discription .single-comment-box .inner-box {
position: relative;
display: block;
background-color: #f4f5f4;
padding: 34px 30px 34px 125px;
}
.product-discription .single-comment-box .inner-box .comment-thumb {
position: absolute;
left: 30px;
top: 40px;
border-radius: 50%;
width: 80px;
}
.product-discription .single-comment-box .inner-box .comment-thumb img {
width: 100%;
border-radius: 50%;
}
.product-discription .single-comment-box .inner-box .rating {
position: relative;
display: block;
margin-bottom: 2px;
}
.product-discription .single-comment-box .inner-box .rating li {
position: relative;
display: inline-block;
font-size: 12px;
float: left;
margin-right: 4px;
color: #fdc009;
}
.product-discription .single-comment-box .inner-box .rating li:last-child {
margin: 0px !important;
}
.product-discription .single-comment-box .inner-box h5 {
display: block;
font-size: 16px;
line-height: 26px;
font-weight: 600;
text-transform: uppercase;
margin-bottom: 16px;
}
.product-discription .single-comment-box .inner-box h5 span {
font-weight: 400;
text-transform: capitalize;
}
.product-discription .customer-comment {
position: relative;
display: block;
margin-bottom: 60px;
}
.product-discription .comment-box {
position: relative;
display: block;
background-color: #fff;
padding: 51px 60px 60px 60px;
-webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1);
}
.product-discription .comment-box h3 {
display: block;
font-size: 24px;
line-height: 34px;
font-weight: 600;
text-transform: uppercase;
margin-bottom: 23px;
}
.product-discription .comment-box .form-group {
position: relative;
margin-bottom: 15px;
}
.product-discription .comment-box .form-group label {
position: relative;
display: block;
font-size: 18px;
line-height: 28px;
color: #707582;
margin-bottom: 8px;
}
.product-discription .comment-box .column:last-child .form-group {
margin-bottom: 0px;
}
.product-discription .comment-box .review-box {
position: relative;
display: block;
margin-top: 8px;
}
.product-discription .comment-box .review-box p {
position: relative;
float: left;
margin-right: 10px;
}
.product-discription .comment-box .review-box .rating {
position: relative;
float: left;
}
.product-discription .comment-box .review-box .rating li {
position: relative;
display: inline-block;
font-size: 14px;
line-height: 28px;
float: left;
margin-right: 4px;
color: #fdc009;
}
.product-discription .comment-box .review-box .rating li:last-child {
margin: 0px !important;
}
.product-discription .comment-box .custom-controls-stacked {
position: relative;
float: left;
}
.related-product h3 {
margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
.product-details__img {
margin-bottom: 50px;
}
.product-details__title span {
margin-left: 0;
display: block;
}
.product-details__buttons {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
}
.product-details__buttons-2 {
margin-left: 0;
margin-top: 10px;
}
.product-details__social-link {
margin-left: 0;
margin-top: 20px;
}
}
/***
====================================================================
Categories Section
====================================================================
***/
.categories-section {
position: relative;
padding: 100px 0 70px;
}
.categories-section .bg-pattern {
position: absolute;
left: 0;
top: -220px;
width: 100%;
height: 100%;
content: "";
background-image: url(../images/icons/pattern-7.png);
background-repeat: no-repeat;
background-position: left top;
z-index: -1;
}
.categories-section:before {
position: absolute;
left: 0;
bottom: 0;
height: 300px;
width: 100%;
background: var(--theme-color3);
content: "";
z-index: 1;
}
.categories-section:after {
position: absolute;
left: 0;
bottom: -50px;
height: 70px;
width: 100%;
z-index: 2;
content: "";
background-image: url(../images/icons/pattern-3.png);
background-repeat: no-repeat;
background-position: center bottom;
}
.category-block {
position: relative;
margin-bottom: 30px;
z-index: 9;
}
.category-block .inner-box {
position: relative;
text-align: center;
background: #ffffff;
padding: 40px 30px 30px;
border-radius: 10px;
-webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block .inner-box:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 190px;
background-repeat: no-repeat;
background-position: center bottom;
content: "";
}
.category-block .inner-box:hover {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
-webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.category-block .inner-box:hover .image img {
-webkit-transform: rotate(10deg) scale(1.2);
transform: rotate(10deg) scale(1.2);
}
.category-block .inner-box.cat-bg-1:before {
background-image: url(../images/icons/cat-1-bg.png);
}
.category-block .inner-box.cat-bg-2:before {
background-image: url(../images/icons/cat-2-bg.png);
}
.category-block .inner-box.cat-bg-3:before {
background-image: url(../images/icons/cat-3-bg.png);
}
.category-block .inner-box.cat-bg-4:before {
background-image: url(../images/icons/cat-4-bg.png);
}
.category-block .image {
position: relative;
display: inline-block;
height: 180px;
width: 180px;
overflow: hidden;
border-radius: 50%;
margin-bottom: 15px;
}
.category-block .image img {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block h4 {
font-size: 20px;
color: var(--theme-color3);
font-weight: 700;
margin-bottom: 10px;
}
.category-block h4 a {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block h4 a:hover {
color: var(--theme-color1);
}
.category-block p {
font-size: 14px;
color: #797f7d;
line-height: 26px;
margin-bottom: 0px;
}
/***
====================================================================
Categories Section Two
====================================================================
***/
.categories-section-two {
position: relative;
padding: 120px 0 90px;
}
.category-block-two {
position: relative;
padding-top: 70px;
margin-bottom: 30px;
z-index: 9;
}
.category-block-two .inner-box {
position: relative;
text-align: center;
background: #ffffff;
border-radius: 10px;
margin: 0 auto;
padding: 18px;
}
.category-block-two .inner-box:before {
position: absolute;
left: 0;
top: 0;
bottom: 60px;
width: 100%;
border-radius: 10px;
background: #e3eee5;
content: "";
}
.category-block-two .inner-box:hover .image:before {
left: 100%;
-webkit-transition: all 1000ms ease;
transition: all 1000ms ease;
}
.category-block-two .inner-box:hover .image img {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
.category-block-two .inner-box:hover h4 a {
color: var(--theme-color1);
}
.category-block-two .content {
position: relative;
background: #ffffff;
border-radius: 10px;
padding: 0 40px 40px;
z-index: 1;
-webkit-box-shadow: 0 10px 60px rgba(0, 0, 0, 0.07);
box-shadow: 0 10px 60px rgba(0, 0, 0, 0.07);
}
.category-block-two .content:before {
position: absolute;
top: -88px;
left: 0;
width: 180px;
height: 180px;
right: 0;
margin: 0 auto;
border-radius: 50%;
background: #e3eee5;
content: "";
}
.category-block-two .content:after {
position: absolute;
left: 0;
bottom: 0px;
width: 100%;
font-size: 30px;
line-height: 1em;
color: #e8f3ea;
height: 15px;
overflow: hidden;
text-transform: uppercase;
letter-spacing: 0.1em;
content: attr(data-text);
}
.category-block-two .image {
position: relative;
display: inline-block;
overflow: hidden;
margin-bottom: 25px;
margin-top: -70px;
}
.category-block-two .image img {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block-two .image:before {
position: absolute;
left: 0;
top: 0;
height: 120%;
width: 100%;
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgb(255, 255, 255)));
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#00ffffff",GradientType=1 );
content: "";
opacity: 0.3;
left: -100%;
pointer-events: none;
z-index: 1;
}
.category-block-two h4 {
font-size: 22px;
color: var(--theme-color3);
font-weight: 700;
margin-bottom: 15px;
}
.category-block-two h4 a {
color: var(--theme-color3);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block-two p {
font-size: 16px;
color: #797f7d;
line-height: 26px;
margin-bottom: 0px;
}
.category-block-two .link {
position: relative;
display: inline-block;
height: 50px;
width: 50px;
background: #e8f3ea;
border-radius: 50%;
line-height: 50px;
margin-top: 25px;
color: #608174;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.category-block-two .link:hover {
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
.category-block-two.child-two .link {
background: #f0e2e3;
}
.category-block-two.child-two .inner-box:before {
background: #f0e2e3;
}
.category-block-two.child-two .inner-box:hover h4 a {
color: #e69da2;
}
.category-block-two.child-two .content:before {
background: #f0e2e3;
}
.category-block-two.child-two .content:after {
color: #f0e2e3;
}
.category-block-two.child-three .link {
background: #f1ede1;
}
.category-block-two.child-three .inner-box:before {
background: #f1ede1;
}
.category-block-two.child-three .inner-box:hover h4 a {
color: #c9b579;
}
.category-block-two.child-three .content:before {
background: #f1ede1;
}
.category-block-two.child-three .content:after {
color: #f1ede1;
}
/***
====================================================================
Products Section
====================================================================
***/
.products-section {
position: relative;
padding: 120px 0;
}
.products-section .bg-image {
position: absolute;
left: 0;
top: 0;
height: 670px;
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
background-attachment: fixed;
}
.products-section .bg-image:before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: #113629;
opacity: 0.7;
content: "";
}
.products-section .bg-image:after {
position: absolute;
left: 0;
bottom: 0;
height: 50px;
width: 100%;
background-position: center bottom;
content: "";
}
.products-section .sec-title h2 {
font-size: 60px;
}
.products-section .sec-title .theme-btn {
margin-top: 30px;
}
.products-box {
max-width: 1530px;
position: relative;
padding: 120px 60px 90px;
margin: 120px auto 0;
background-color: #f7f5ee;
overflow: hidden;
border-radius: 10px;
}
.products-box:before {
position: absolute;
left: -90px;
bottom: 0;
height: 70%;
width: 100%;
background: url(../images/icons/shape-7.png) top left no-repeat;
content: "";
}
.products-box .sec-title {
margin-bottom: 30px;
}
.products-box .outer-box {
position: relative;
padding-right: 400px;
}
.products-box .outer-box .banner-box-two {
position: absolute;
right: 0;
top: 0;
}
.banner-box-two {
position: relative;
}
.banner-box-two .inner-box:before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: -webkit-gradient(linear, left top, left bottom, from(rgb(22, 67, 51)), to(rgba(229, 229, 229, 0)));
background: linear-gradient(to bottom, rgb(22, 67, 51) 0%, rgba(229, 229, 229, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="var(--theme-color3)", endColorstr="#00e5e5e5",GradientType=0 );
content: "";
}
.banner-box-two .inner-box {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
max-width: 370px;
background: var(--theme-color3);
border-radius: 10px;
min-height: 440px;
text-align: center;
overflow: hidden;
padding: 20px 20px;
}
.banner-box-two .title {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
font-size: 20px;
color: #ffffff;
text-transform: uppercase;
margin-bottom: 20px;
}
.banner-box-two .title strong {
font-size: 60px;
line-height: 1em;
color: var(--theme-color2);
font-weight: 400;
}
.banner-box-two h4 {
font-size: 30px;
line-height: 1.2em;
color: #ffffff;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
margin-bottom: 30px;
}
.product-block-two {
position: relative;
margin-bottom: 30px;
}
.product-block-two .inner-box {
position: relative;
border: 2px solid transparent;
border-radius: 10px;
background: #ffffff;
padding: 20px 20px;
padding-left: 150px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-height: 150px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block-two .inner-box:hover {
border: 2px solid var(--theme-color1);
}
.product-block-two .image {
position: absolute;
left: 20px;
top: 20px;
border-radius: 50%;
overflow: hidden;
height: 110px;
width: 110px;
border: 1px solid #e4e1d6;
margin-bottom: 0px;
}
.product-block-two .image img {
width: auto;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block-two .inner-box:hover .image img {
-webkit-transform: scale(-1) rotate(180deg);
transform: scale(-1) rotate(180deg);
}
.product-block-two h4 {
display: block;
font-size: 22px;
color: var(--theme-color3);
font-weight: 700;
margin-bottom: 5px;
}
.product-block-two h4 a {
color: var(--theme-color3);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block-two .price {
display: block;
font-size: 16px;
line-height: 26px;
color: var(--theme-color1);
font-weight: 600;
}
.product-block-two .price del {
display: inline-block;
margin-left: 15px;
font-size: 16px;
color: #ff0000;
line-height: 27px;
opacity: 0.3;
}
.product-block-two .rating {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 14px;
color: #ffc737;
}
.products-carousel .owl-nav {
display: none;
}
.products-carousel .owl-dots {
position: absolute;
right: 0;
top: -80px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
z-index: 8;
}
.products-carousel .owl-dot {
position: relative;
height: 7px;
width: 7px;
display: block;
background: #879d91;
margin-right: 5px;
border-radius: 5px;
display: block;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.products-carousel .owl-dot.active {
background: var(--theme-color3);
}
/***
====================================================================
Featured Products
====================================================================
***/
.featured-products {
position: relative;
padding: 120px 0 90px;
}
.featured-products .bg-shape {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: url(../images/icons/pattern-7.png) left bottom no-repeat;
background-size: 700px;
}
/*=== Mixitup Gallery ===*/
.featured-products .filters {
margin-bottom: 40px;
text-align: center;
}
.featured-products .filters .filter-tabs {
position: relative;
display: inline-block;
}
.featured-products .filters li {
position: relative;
display: inline-block;
line-height: 24px;
padding: 0px 2px 10px;
cursor: pointer;
color: #797f7d;
font-weight: 500;
font-size: 18px;
margin: 0 5px 0;
padding: 5px 12px 10px;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.featured-products .filters li:last-child {
margin-right: 0;
}
.featured-products .filters .filter.active,
.featured-products .filters .filter:hover {
background-color: var(--theme-color2);
color: #fff;
}
.featured-products .filters li:before {
position: absolute;
left: 0;
bottom: 8px;
height: 2px;
width: 100%;
content: "";
background-color: #fff;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: top right;
transform-origin: top right;
-webkit-transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); /* easeInOutQuint */
-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); /* easeInOutQuint */
}
.featured-products .filters li.active:before,
.featured-products .filters li:hover:before {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
}
.product-block {
position: relative;
margin-bottom: 30px;
}
.product-block.mix {
display: none;
}
.product-block .inner-box {
position: relative;
border: 1px solid var(--theme-color2);
border-radius: 10px;
text-align: center;
background: #ffffff;
overflow: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block .inner-box:hover {
border: 1px solid var(--theme-color1);
-webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
}
.product-block .image {
position: relative;
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;
overflow: hidden;
margin-bottom: 0px;
}
.product-block .image:before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgb(255, 255, 255)));
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#00ffffff",GradientType=1 );
content: "";
opacity: 0.3;
left: -100%;
pointer-events: none;
z-index: 1;
}
.product-block .inner-box:hover .image:before {
left: 100%;
-webkit-transition: all 1000ms ease;
transition: all 1000ms ease;
}
.product-block .image img {
width: auto;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block .inner-box:hover .image img {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
.product-block .content {
position: relative;
padding: 30px 30px 30px;
}
.product-block h4 {
display: block;
font-size: 22px;
color: var(--theme-color2);
font-weight: 700;
margin-bottom: 5px;
}
.product-block h4 a {
color: var(--theme-color2);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block h4 a:hover {
color: var(--theme-color1);
}
.product-block .price {
display: block;
font-size: 16px;
line-height: 26px;
color: var(--text-gray-silver);
font-weight: 600;
}
.product-block .price del {
display: inline-block;
margin-left: 15px;
font-size: 16px;
color: #ff0000;
line-height: 27px;
opacity: 0.3;
}
.product-block .rating {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font-size: 14px;
color: #ffc737;
}
.product-block .tag {
position: absolute;
top: 30px;
left: 20px;
font-size: 14px;
line-height: 23px;
color: #ffffff;
background: #FD5F5C;
font-weight: 400;
padding: 0 12px;
border-radius: 3px;
z-index: 9;
font-style: italic;
text-transform: uppercase;
}
.product-block .icon-box {
position: absolute;
right: 20px;
top: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
opacity: 0;
visibility: hidden;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block .inner-box:hover .icon-box {
top: 20px;
opacity: 1;
visibility: visible;
-webkit-transition-delay: 300ms;
transition-delay: 300ms;
}
.product-block .ui-btn {
background-color: var(--theme-color2);
border-radius: 50px;
color: #ffffff;
cursor: pointer;
display: block;
height: 40px;
font-size: 14px;
line-height: 40px;
margin-bottom: 10px;
position: relative;
text-align: center;
width: 40px;
z-index: 9;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.product-block .ui-btn:hover {
background-color: var(--theme-color1);
color: var(--theme-color1-text-color);
}
.product-block .cat {
display: block;
font-size: 18px;
color: #707070;
font-style: italic;
font-family: "Jost", sans-serif;
margin-bottom: 5px;
}
/*
* shop-catalog-layouts.scss
* -----------------------------------------------
*/
table.tbl-shopping-cart .product-thumbnail, table.cart-total .product-thumbnail {
min-width: 64px;
}
table.tbl-shopping-cart img, table.cart-total img {
width: 64px;
-webkit-box-shadow: none;
box-shadow: none;
}
table.tbl-shopping-cart th,
table.tbl-shopping-cart td, table.cart-total th,
table.cart-total td {
vertical-align: middle;
border-left: 1px solid #e3e3e3;
padding: 20px 30px;
}
table.tbl-shopping-cart .product-name a, table.cart-total .product-name a {
color: var(--headings-color);
}
table.tbl-shopping-cart .product-name .variation, table.cart-total .product-name .variation {
font-size: 0.9rem;
list-style: none;
}
table.tbl-shopping-cart .product-remove a, table.cart-total .product-remove a {
display: inline-block;
width: 24px;
height: 24px;
line-height: 24px;
border-radius: 24px;
-webkit-transition: all 300ms ease-out;
transition: all 300ms ease-out;
background-color: #757575;
color: #ffffff;
text-align: center;
}
table.tbl-shopping-cart .coupon-form .apply-button, table.cart-total .coupon-form .apply-button {
position: relative;
display: inline-block;
color: #1e2434;
background: #f4f5f4;
padding: 15px 29px;
cursor: pointer;
text-transform: uppercase;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
table.tbl-shopping-cart .coupon-form .apply-button:hover, table.cart-total .coupon-form .apply-button:hover {
background-color: var(--theme-color2);
}
table.tbl-shopping-cart .coupon-form .apply-button:hover span, table.cart-total .coupon-form .apply-button:hover span {
color: var(--theme-color-white);
}
table.tbl-shopping-cart > thead > tr > th,
table.tbl-shopping-cart > tbody > tr > th,
table.tbl-shopping-cart > tfoot > tr > th {
color: #444;
}
.payment-method .accordion-box .block {
background: #f4f5f4;
-webkit-box-shadow: none;
box-shadow: none;
margin-bottom: 20px;
}
.payment-method .accordion-box .block .acc-content .payment-info {
position: relative;
display: block;
background-color: #fff;
padding: 30px 30px 10px 30px;
}
.payment-method .accordion-box .block:last-child {
margin-bottom: 0px;
}
.payment-method .accordion-box .block .acc-btn {
padding: 19px 30px 22px 30px;
}
.payment-method .accordion-box .block .acc-btn .icon-outer {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
position: absolute;
top: 50%;
right: 30px;
height: auto;
/* line-height: 65px; */
font-size: 28px;
color: #1e2434;
}
.payment-method .accordion-box .block .acc-btn.active .icon-outer {
color: var(--theme-color2-text-color);
}
.payment-method .payment-method h3 {
margin-bottom: 32px;
}
.checkout-faq-box .accordion-box {
position: relative;
}
.checkout-faq-box .accordion-box .block .acc-btn {
position: relative;
color: var(--headings-color);
font-family: var(--heading-font-family);
font-weight: var(--h4-font-weight);
font-size: 20px;
cursor: pointer;
padding: 20px 30px;
padding-right: 70px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
border-bottom: 1px solid rgba(4, 18, 31, 0.08);
}
.checkout-faq-box .accordion-box .block .acc-btn .icon {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: var(--headings-color);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 18px;
height: 35px;
line-height: 2;
position: absolute;
right: 30px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.checkout-faq-box .accordion-box .block .acc-btn.active .icon {
color: var(--theme-color2);
}
.checkout-faq-box .accordion-box .block .acc-btn.active .icon:before {
content: "\f068";
}
.checkout-faq-box .accordion-box .block .acc-content {
display: none;
position: relative;
}
.checkout-faq-box .accordion-box .block .acc-content .content {
padding: 25px 30px;
position: relative;
}
.checkout-faq-box .accordion-box .block .acc-content .content .text {
display: block;
font-family: var(--body-font-family);
font-size: 16px;
font-weight: 500;
line-height: 28px;
color: #6B7280;
margin-bottom: 0;
}
.checkout-faq-box .accordion-box .block .acc-content.current {
display: block;
}
.shop-sidebar {
display: block;
position: relative;
}
.shop-sidebar .sidebar-search {
margin-bottom: 30px;
}
.shop-sidebar .sidebar-search .search-form .form-group {
margin: 0px;
position: relative;
}
.shop-sidebar .sidebar-search .search-form .form-group input[type=search] {
background-color: var(--theme-color-gray);
border: 1px solid var(--theme-light-background);
border-radius: 5px;
color: #646578;
height: 52px;
padding: 10px 60px 10px 20px;
position: relative;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 100%;
}
.shop-sidebar .sidebar-search .search-form .form-group button {
background-color: var(--theme-color2);
border-radius: 3px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 18px;
height: 42px;
line-height: 42px;
position: absolute;
right: 5px;
text-align: center;
top: 5px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 42px;
}
.shop-sidebar .sidebar-search .search-form .form-group button:hover {
background-color: var(--theme-color1);
color: var(--theme-color1-text-color);
}
.shop-sidebar .sidebar-widget {
background-color: var(--theme-color-gray);
border-radius: 5px;
display: block;
margin-bottom: 30px;
padding: 35px 30px 37px 30px;
position: relative;
}
.shop-sidebar .sidebar-widget:last-child {
margin-bottom: 0px;
}
.shop-sidebar .sidebar-widget .widget-title {
display: block;
margin-bottom: 16px;
position: relative;
}
.shop-sidebar .category-widget .category-list li {
display: block;
margin-bottom: 14px;
position: relative;
}
.shop-sidebar .category-widget .category-list li:last-child {
margin-bottom: 0px;
}
.shop-sidebar .category-widget .category-list li a {
color: #646578;
display: inline-block;
font-weight: 400;
padding-left: 20px;
position: relative;
}
.shop-sidebar .category-widget .category-list li a:before {
position: absolute;
content: "\f0da";
font-family: "Font Awesome 6 Pro";
left: 0px;
top: 0px;
font-size: 16px;
font-weight: 600;
color: var(--theme-color2);
}
.shop-sidebar .category-widget .category-list li a:hover {
color: var(--theme-color2);
}
.shop-sidebar .price-filters .widget-title {
margin-bottom: 28px;
}
.shop-sidebar .post-widget {
padding-bottom: 9px;
}
.shop-sidebar .post-widget .post {
border-bottom: 1px solid #e1e1e1;
margin-bottom: 23px;
min-height: 108px;
padding-left: 90px;
padding-bottom: 24px;
position: relative;
}
.shop-sidebar .post-widget .post:last-child {
margin-bottom: 0px;
border-bottom: none;
}
.shop-sidebar .post-widget .post .post-thumb {
border: 1px solid #d0d4dd;
border-radius: 5px;
height: 70px;
left: 0px;
position: absolute;
top: 7px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 70px;
}
.shop-sidebar .post-widget .post .post-thumb img {
width: 100%;
border-radius: 5px;
}
.shop-sidebar .post-widget .post a {
color: #646578;
display: inline-block;
font-size: 16px;
line-height: 26px;
margin-bottom: 7px;
position: relative;
}
.shop-sidebar .post-widget .post .price {
color: #0a267a;
display: block;
font-size: 14px;
font-weight: 600;
line-height: 24px;
position: relative;
}
.shop-sidebar .post-widget .post:hover .post-thumb {
border-color: var(--theme-color1);
}
.shop-sidebar .post-widget .post:hover a {
color: var(--theme-color1);
}
.range-slider {
position: relative;
}
.range-slider .title {
display: inline-block;
line-height: 26px;
margin-right: 4px;
position: relative;
}
.range-slider .title:before {
color: #646578;
content: "$";
font-size: 18px;
left: -5px;
position: absolute;
top: -19px;
}
.range-slider p {
color: #646578;
display: inline-block;
margin-right: 10px !important;
position: relative;
}
.range-slider .input {
color: #646578;
display: inline-block;
font-size: 18px;
margin-top: 5px;
max-width: 75px;
position: relative;
}
.range-slider .input input {
background: none;
color: #646578;
font-size: 15px;
text-align: left;
}
.range-slider .ui-widget.ui-widget-content {
background-color: #d0d4dd;
border-radius: 2px;
border: none;
height: 4px;
margin-bottom: 14px;
}
.range-slider .ui-slider .ui-slider-range {
background-color: var(--theme-color2);
top: 0px;
height: 4px;
}
.range-slider .ui-state-default {
background-color: var(--theme-color2);
border: none;
border-radius: 50%;
cursor: pointer;
height: 14px;
margin-left: 0px;
position: absolute;
top: -5px;
width: 14px;
}
.range-slider .ui-state-default:before {
background-color: #ffffff;
border-radius: 50%;
content: "";
height: 6px;
left: 4px;
position: absolute;
top: 4px;
width: 6px;
}
.range-slider .ui-widget-content .ui-state-default {
background-color: var(--theme-color2);
border: none;
border-radius: 50%;
cursor: pointer;
height: 14px;
margin-left: 0px;
top: -5px;
width: 14px;
}
.range-slider .ui-widget-content .ui-state-default:before {
background-color: #ffffff;
border-radius: 50%;
content: "";
position: absolute;
height: 6px;
left: 4px;
top: 4px;
width: 6px;
}
.range-slider input[type=submit] {
background: var(--theme-color2);
border: none;
border-radius: 10px;
color: #ffffff;
cursor: pointer;
display: block;
float: right;
font-size: 14px;
font-weight: 500;
margin-top: 0;
padding: 7px 20px;
position: relative;
text-align: center;
text-transform: capitalize;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.range-slider input[type=submit]:hover {
background-color: var(--theme-color1);
color: var(--theme-color1-text-color);
}
/***
====================================================================
Page Title
====================================================================
***/
/***
====================================================================
Page Title
====================================================================
***/
.page-title {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
overflow: hidden;
padding: 120px 0 20px;
position: relative;
}
.page-title:before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: #052221;
content: "";
mix-blend-mode: normal;
}
.page-title .title {
font-size: 64px;
color: #ffffff;
margin-top: 15px;
}
.page-title .text {
position: relative;
color: #ffffff;
font-size: 16px;
line-height: 26px;
letter-spacing: 0.05em;
max-width: 520px;
}
.page-title .circle-shape {
display: inline-block;
background: linear-gradient(48deg, rgba(8, 44, 43, 0.3) 13.25%, rgba(128, 167, 82, 0.3) 83.21%);
width: 300px;
height: 292px;
border-radius: 89%;
position: absolute;
top: 0;
right: -7%;
}
.page-title .circle-shape-2 {
display: inline-block;
background: transparent;
width: 300px;
height: 300px;
border-radius: 50%;
position: absolute;
top: 0;
left: -10%;
border: 5px solid #ed6e2d;
opacity: 0.4;
}
.page-breadcrumb {
position: relative;
margin-top: 5px;
}
.page-breadcrumb li {
position: relative;
display: inline-block;
margin-right: 12px;
padding-right: 13px;
color: #ffffff;
font-size: 16px;
font-weight: 400;
}
.page-breadcrumb li:after {
position: absolute;
content: "\f105";
right: -6px;
top: 1px;
color: #ffffff;
font-size: 14px;
font-weight: 900;
font-family: "Font Awesome 6 Pro";
color: #ffffff;
}
.page-breadcrumb li:last-child {
padding-right: 0px;
margin-right: 0px;
}
.page-breadcrumb li:last-child::after {
display: none;
}
.page-breadcrumb li a {
color: var(--theme-color1);
font-weight: 500;
text-transform: capitalize;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.page-breadcrumb li a:hover {
color: #ffffff;
}
.page-title.style-two {
background-position: center center;
}
.page-title.style-two .page-breadcrumb-outer {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
padding: 10px 0;
-webkit-transform: translateY(100%);
transform: translateY(100%);
z-index: 8;
}
.page-title.style-two .page-breadcrumb li {
color: rgb(7, 7, 16);
font-weight: 600;
}
.page-title.style-two .page-breadcrumb li:after {
color: rgb(7, 7, 16);
}
.page-title.style-two .page-breadcrumb li a {
color: rgba(7, 7, 16, 0.6);
}
.page-title.style-two .page-breadcrumb li a:hover {
color: rgb(7, 7, 16);
}
.background-image {
background-position: center;
background-repeat: repeat;
background-size: cover;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.error-page__inner {
position: relative;
display: block;
text-align: center;
}
.error-page__inner .error-page__title-box {
position: relative;
display: block;
}
.error-page__inner .error-page__title {
position: relative;
display: inline-block;
font-size: 280px;
line-height: 280px;
margin-bottom: 0;
color: var(--theme-color1);
}
.error-page__inner .error-page__sub-title {
font-size: 40px;
letter-spacing: 0.1em;
text-transform: uppercase;
line-height: 50px;
margin-top: -16px;
}
.error-page__inner .error-page__text {
font-size: 20px;
line-height: 30px;
text-align: center;
}
.error-page__inner .error-page__form {
position: relative;
display: block;
margin: 42px auto 20px;
}
.error-page__inner .error-page__form input[type=search] {
height: 60px;
width: 100%;
border: none;
outline: none;
background-color: #f5f5f5;
font-size: 14px;
color: #333;
padding-left: 50px;
padding-right: 75px;
border-radius: 7px;
}
.error-page__inner .error-page__form button[type=submit] {
background-color: transparent;
font-size: 22px;
position: absolute;
top: 0;
right: 0px;
bottom: 0;
width: 72px;
outline: none;
border: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
}
.error-page__inner .error-page__form-input {
position: relative;
display: block;
max-width: 570px;
width: 100%;
margin: 0 auto;
}
.error-page__inner .theme-btn {
position: relative;
}
.error-page__inner .theme-btn.btn-style-one {
padding: 26px 60px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-right: 100px;
height: 70px;
border-radius: 100px;
background: -webkit-gradient(linear, left top, right top, from(#BEEC6B), to(#169C92));
background: linear-gradient(90deg, #BEEC6B 0%, #169C92 100%);
color: var(--theme-color-white);
}
@media only screen and (max-width: 767px) {
.error-page__inner .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.error-page__inner .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.error-page__inner .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.error-page__inner .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.error-page__inner .theme-btn.btn-style-one:hover {
color: var(--headings-color);
}
.error-page__inner .theme-btn .icon {
width: 62px;
height: 62px;
line-height: 72px;
border-radius: 50%;
background-color: #fff;
position: absolute;
right: 4px;
top: 4px;
bottom: 4px;
font-size: 50px;
color: var(--headings-color);
}
/***
=============================================
Services Details
=============================================
***/
.service-sidebar {
position: relative;
display: block;
max-width: 365px;
width: 100%;
}
.service-sidebar .service-sidebar-single {
position: relative;
display: block;
margin-bottom: 30px;
}
.service-sidebar .service-sidebar-single-services {
position: relative;
display: block;
background: #f6f4ec;
border-radius: 10px;
padding: 35px 30px 25px;
}
.service-sidebar .service-sidebar-single-services .title {
position: relative;
display: block;
margin-bottom: 12px;
padding-left: 20px;
}
.service-sidebar .service-sidebar-single-services .title h3 {
color: var(--headings-color);
font-size: 20px;
line-height: 30px;
letter-spacing: -0.02em;
}
.service-sidebar .service-sidebar-single-services ul {
position: relative;
display: block;
margin-top: 10px;
}
.service-sidebar .service-sidebar-single-services ul li {
position: relative;
display: block;
margin-bottom: 5px;
margin-top: -10px;
}
.service-sidebar .service-sidebar-single-services ul li:last-child {
margin-bottom: 0;
}
.service-sidebar .service-sidebar-single-services ul li a {
position: relative;
display: block;
color: var(--agriox-color-1, #687469);
font-size: 18px;
padding: 22px 20px 22px;
border-radius: 10px;
background: transparent;
-webkit-transition: all 300ms linear;
transition: all 300ms linear;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.service-sidebar .service-sidebar-single-services ul li a:hover {
color: var(--headings-color);
}
.service-sidebar .service-sidebar-single-services ul li a:hover::before {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
-webkit-transition: all 300ms linear;
transition: all 300ms linear;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
.service-sidebar .service-sidebar-single-services ul li a:hover i {
color: var(--theme-color1);
}
.service-sidebar .service-sidebar-single-services ul li a::before {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
content: "";
z-index: -1;
opacity: 1;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
-webkit-transform-origin: bottom;
transform-origin: bottom;
-webkit-transition: all 300ms linear;
transition: all 300ms linear;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
background: #ffffff;
-webkit-box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
border-radius: 10px;
}
.service-sidebar .service-sidebar-single-services ul li a i {
font-size: 16px;
}
.service-sidebar .service-sidebar-single-services ul li.current a::before {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
-webkit-transition: all 300ms linear;
transition: all 300ms linear;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
.service-sidebar .service-sidebar-single-services ul li.current a i {
color: var(--theme-color1);
}
.service-sidebar .service-sidebar-single-services ul li.current:first-child {
margin-top: 20px;
}
.service-sidebar .service-sidebar-single-services ul li.current:last-child {
margin-bottom: 35px;
}
.service-sidebar .service-sidebar-single-contact-box {
position: relative;
display: block;
background-attachment: scroll;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 10px;
padding: 50px 0px 44px;
z-index: 1;
}
.service-sidebar .service-sidebar-single-contact-box::before {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(109, 140, 84, 0.93);
border-radius: 10px;
content: "";
z-index: -1;
}
.service-sidebar .service-sidebar-single-contact-box .icon {
position: relative;
display: inline-block;
width: 60px;
height: 60px;
text-align: center;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
border-radius: 50%;
background: var(--theme-color2);
}
.service-sidebar .service-sidebar-single-contact-box .icon:hover {
background-color: var(--headings-color);
}
.service-sidebar .service-sidebar-single-contact-box .icon:hover span::before {
color: #fff;
}
.service-sidebar .service-sidebar-single-contact-box .icon span::before {
position: relative;
display: inline-block;
color: var(--headings-color);
font-size: 30px;
line-height: 60px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.service-sidebar .service-sidebar-single-contact-box .title {
position: relative;
display: block;
margin-top: 20px;
margin-bottom: 42px;
}
.service-sidebar .service-sidebar-single-contact-box .title h2 {
color: #ffffff;
font-size: 36px;
}
.service-sidebar .service-sidebar-single-contact-box .phone {
font-size: 24px;
line-height: 34px;
}
.service-sidebar .service-sidebar-single-contact-box .phone a {
color: #ffffff;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.service-sidebar .service-sidebar-single-contact-box .phone a:hover {
color: var(--theme-color1);
}
.service-sidebar .service-sidebar-single-contact-box p {
color: #ffffff;
font-size: 14px;
line-height: 22px;
}
.service-sidebar .service-sidebar-single-btn {
position: relative;
display: block;
}
.service-sidebar .service-sidebar-single-btn .thm-btn {
font-size: 16px;
padding: 13px 50px 28px;
}
.service-sidebar .service-sidebar-single-btn .thm-btn span::before {
position: relative;
display: inline-block;
top: 13px;
color: #334b35;
font-size: 40px;
padding-right: 25px;
-webkit-transition: all 600ms ease;
transition: all 600ms ease;
font-weight: 500;
}
.service-sidebar .service-sidebar-single-btn .thm-btn:hover span::before {
color: #ffffff;
}
.service-sidebar .banner-widget {
position: relative;
display: block;
background: #fff;
border-radius: 10px;
overflow: hidden;
-webkit-box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.08);
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.08);
}
.service-sidebar .banner-widget .widget-content {
position: relative;
display: block;
width: 100%;
padding: 45px 30px 40px 30px;
background-size: cover;
background-repeat: no-repeat;
}
.service-sidebar .banner-widget .widget-content .shape {
position: absolute;
left: 0px;
top: 0px;
height: 100%;
width: 278px;
background-repeat: no-repeat;
background-size: cover;
}
.service-sidebar .banner-widget .content-box {
position: relative;
max-width: 200px;
width: 100%;
}
.service-sidebar .banner-widget .content-box .icon-box {
position: relative;
display: inline-block;
width: 60px;
height: 60px;
line-height: 60px;
font-size: 40px;
background-color: var(--theme-color2);
color: var(--theme-color2-text-color);
text-align: center;
border-radius: 5px;
margin-bottom: 23px;
}
.service-sidebar .banner-widget .content-box .icon-box .icon-shape {
position: absolute;
top: -15px;
right: -38px;
width: 32px;
height: 32px;
background-repeat: no-repeat;
}
.service-sidebar .banner-widget .content-box h3 {
display: block;
font-size: 24px;
line-height: 32px;
color: #ffffff;
font-weight: 600;
text-transform: uppercase;
margin-bottom: 22px;
}
.service-sidebar .banner-widget .content-box .theme-btn-two:hover {
background: #0a267a;
}
.service-sidebar .service-sidebar-single-btn .theme-btn {
padding: 20px 50px;
}
.service-sidebar .service-sidebar-single-btn .theme-btn .btn-title {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.service-sidebar .service-sidebar-single-btn .theme-btn span::before {
position: relative;
display: inline-block;
font-size: 36px;
padding-right: 25px;
margin-top: 7px;
-webkit-transition: all 600ms ease;
transition: all 600ms ease;
font-weight: 500;
}
.services-details__content .feature-list .single-item {
position: relative;
display: block;
border: 1px solid #e1e8e4;
padding: 16px 30px 16px 53px;
margin-bottom: 20px;
-webkit-transition: all 600ms ease;
transition: all 600ms ease;
}
.services-details__content .feature-list .single-item .icon-box {
color: var(--theme-color1);
position: absolute;
left: 20px;
top: 16px;
font-size: 18px;
-webkit-transition: all 600ms ease;
transition: all 600ms ease;
}
.services-details__content .feature-list .single-item .title {
display: block;
margin: 0;
font-size: 16px;
line-height: 32px;
font-weight: 600;
text-transform: uppercase;
}
.services-details__content .feature-list .single-item:hover {
background-color: var(--theme-color2);
color: var(--theme-color2-text-color);
}
.services-details__content .feature-list .single-item:hover .icon-box {
color: var(--theme-color2-text-color);
}
.services-details__content .video-btn {
background-color: var(--theme-color-white);
border-radius: 50%;
color: var(--headings-color);
display: inline-block;
font-size: 20px;
height: 100px;
left: 0;
line-height: 100px;
margin: 0 auto;
position: absolute;
right: 0;
text-align: center;
top: 38%;
width: 100px;
}
.services-details__content .video-btn:before {
border: 1px solid rgba(255, 255, 255, 0.8);
}
.services-details__content .video-btn:after {
border: 1px solid rgba(255, 255, 255, 0.8);
}
.sidebar-service-list {
background-color: var(--theme-color-gray);
padding: 45px 40px 30px;
margin: 0;
}
.sidebar-service-list .title {
color: #0A1222;
font-weight: 700;
line-height: 34px;
position: relative;
margin-bottom: 30px;
}
.sidebar-service-list .title:before {
background-color: #C6D936;
bottom: 0;
content: "";
height: 1px;
position: absolute;
-webkit-transform: matrix(1, 0.01, -0.01, 1, 0, 0);
transform: matrix(1, 0.01, -0.01, 1, 0, 0);
width: 100px;
}
.sidebar-service-list li + li {
margin-top: 10px;
}
.sidebar-service-list li {
margin-bottom: 20px;
}
.sidebar-service-list li a {
color: #0A1222;
display: block;
font-family: var(--body-font-family);
font-size: 18px;
font-weight: 500;
line-height: 32px;
position: relative;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.sidebar-service-list li a:hover {
color: var(--theme-color2);
}
.sidebar-service-list li a:hover i {
color: var(--theme-color2);
-webkit-transform: translateY(-50%) rotate(-45deg) scale(1.5);
transform: translateY(-50%) rotate(-45deg) scale(1.5);
}
.sidebar-service-list li a i {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 15px;
color: #191825;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 16px;
height: 32px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: absolute;
right: 20px;
text-align: center;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 45px;
}
.sidebar-service-list li.current a {
color: var(--theme-color2);
}
.sidebar-service-list .form-control {
background-color: var(--theme-color-white);
}
.sidebar-service-list .address li {
color: #0A1222;
font-family: var(--body-font-family);
font-weight: 500;
line-height: 44px;
}
.service-details-help {
position: relative;
display: block;
padding: 57px 55px 50px;
margin-top: 30px;
text-align: center;
z-index: 1;
background-color: var(--theme-color1);
border-radius: 15px;
overflow: hidden;
}
.help-shape-1 {
position: absolute;
bottom: -215px;
left: -95px;
width: 220px;
height: 500px;
background-color: #303030;
mix-blend-mode: soft-light;
border-radius: 150px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
z-index: -1;
}
.help-shape-2 {
position: absolute;
top: -118px;
right: -130px;
width: 180px;
height: 350px;
background-color: #fff;
mix-blend-mode: soft-light;
border-radius: 186px;
-webkit-transform: rotate(48deg);
transform: rotate(48deg);
}
.help-icon {
height: 73px;
width: 73px;
background-color: #fff;
color: #191825;
font-size: 32px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border-radius: 50%;
margin: 0 auto 0;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.help-icon:hover {
background-color: var(--theme-color-dark);
color: var(--theme-color1);
}
.help-title {
font-size: 38px;
color: #fff;
line-height: 40px;
margin-bottom: 21px;
font-weight: 700;
}
.help-contact {
position: relative;
display: block;
margin-top: 21px;
}
.help-contact p {
font-size: 14px;
color: #fff;
margin: 0;
line-height: 32px;
font-weight: 600;
opacity: 0.7;
}
.help-contact a {
font-size: 30px;
color: #fff;
font-weight: 600;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.help-contact a:hover {
color: #fff;
}
.nr-list {
position: relative;
}
.nr-list .title {
font-style: normal;
font-family: var(--heading-font-family);
font-size: 18px;
line-height: 28px;
}
.nr-list .title span {
color: transparent;
font-size: 34px;
margin-right: 25px;
-webkit-text-stroke: 1px rgba(10, 18, 34, 0.3);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.nr-list .title:hover span {
color: #d9d9d9;
}
.outcome-list li {
color: #6B7280;
font-family: var(--body-font-family);
font-weight: 400;
font-size: 18px;
line-height: 29px;
margin-bottom: 10px;
margin-right: 10px;
}
.outcome-list li i {
color: var(--theme-color2);
font-size: 22px;
}
/*--------------------------------------------------------------
# Project Details
--------------------------------------------------------------*/
.project-details__img {
display: block;
position: relative;
}
.project-details__img img {
border-radius: 10px;
width: 100%;
}
.project-details__content {
display: block;
position: relative;
}
.project-details__content-left {
display: block;
margin-top: 31px;
position: relative;
}
.project-details__content-right {
display: block;
margin-top: 40px;
position: relative;
}
.project-details__details-box {
background-color: #F5F5F5;
border-radius: 10px;
padding: 43px 50px 50px;
position: relative;
z-index: 1;
}
.project-details__details-list {
display: block;
position: relative;
}
.project-details__details-list li {
display: block;
position: relative;
}
.project-details__details-list li + li {
margin-top: 24px;
}
.project-details-btn .theme-btn {
position: relative;
}
.project-details-btn .theme-btn.btn-style-one {
padding: 26px 60px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-right: 100px;
height: 70px;
border-radius: 100px;
background: -webkit-gradient(linear, left top, right top, from(#BEEC6B), to(#169C92));
background: linear-gradient(90deg, #BEEC6B 0%, #169C92 100%);
color: var(--theme-color-white);
}
@media only screen and (max-width: 767px) {
.project-details-btn .theme-btn.btn-style-one {
height: 60px;
padding-right: 80px;
}
.project-details-btn .theme-btn.btn-style-one .icon {
width: 40px;
height: 40px;
line-height: 40px;
right: 10px;
top: 8px;
}
.project-details-btn .theme-btn.btn-style-one .icon svg {
width: 15px;
height: 15px;
}
}
@media (max-width: 575.98px) {
.project-details-btn .theme-btn.btn-style-one {
padding: 26px 42px;
padding-right: 42px;
padding-right: 88px;
height: 57px;
}
}
.project-details-btn .theme-btn.btn-style-one:hover {
color: var(--headings-color);
}
.project-details-btn .theme-btn .icon {
width: 62px;
height: 62px;
line-height: 72px;
border-radius: 50%;
background-color: #fff;
position: absolute;
font-size: 50px;
color: var(--headings-color);
right: 4px;
top: 4px;
bottom: 4px;
}
.project-details__client {
color: #838d9e;
font-size: 16px;
line-height: 24px;
margin: 0;
}
.project-details__client a {
text-decoration: underline;
}
.project-details__client a:hover {
color: var(--link-color);
}
.project-details__name {
font-size: 16px;
line-height: 24px;
}
.project-details__social {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.project-details__social a {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background-color: var(--theme-color2);
border-radius: 50%;
color: var(--theme-color1-text-color);
font-size: 15px;
height: 40px;
justify-content: center;
overflow: hidden;
position: relative;
text-align: center;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 40px;
z-index: 1;
}
.project-details__social a:hover {
background-color: var(--theme-color2);
color: var(--theme-color2-text-color);
}
.project-details__social a + a {
margin-left: 10px;
}
.project-details__pagination-box {
display: block;
padding: 40px 0;
position: relative;
text-align: center;
}
.project-details__pagination {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: relative;
}
.project-details__pagination li a {
font-size: 16px;
color: #696969;
font-family: var(--body-font-family);
font-size: 16px;
font-weight: 400;
line-height: 19px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.project-details__pagination li a:hover {
color: var(--theme-color1);
}
.project-details__pagination li a:hover i {
background-color: var(--theme-color2);
color: var(--theme-color2-text-color);
border: 2px solid var(--theme-color2);
}
.project-details__pagination li .content {
position: relative;
display: block;
}
.project-details__pagination li .title,
.project-details__pagination li .title a {
color: #0A1222;
font-family: var(--body-font-family);
font-style: normal;
font-weight: 600;
font-size: 22px;
line-height: 30px;
letter-spacing: -0.03em;
-webkit-transition: all 400ms ease;
transition: all 400ms ease;
}
.project-details__pagination li .title:hover,
.project-details__pagination li .title a:hover {
text-decoration-line: underline;
}
.project-details__pagination li.next {
float: left;
position: relative;
}
.project-details__pagination li.next .content {
text-align: left;
font-weight: var(--body-font-weight-bold);
}
.project-details__pagination li.previous {
position: relative;
float: right;
}
.project-details__pagination li.previous .content {
text-align: right;
}
.room-facility-list {
position: relative;
}
.room-facility-list .icon {
border: 1px solid var(--theme-color1);
border-radius: 50%;
display: block;
font-size: 22px;
height: 64px;
line-height: 64px;
text-align: center;
width: 64px;
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.room-facility-list .list-one:hover .icon {
background-color: var(--theme-color1);
color: #fff;
}
.room-details__content-right {
position: relative;
display: block;
margin-top: 40px;
}
.room-details__details-box {
background-color: #f5f6f7;
border: 1px solid var(--theme-color1);
border-radius: 10px;
padding: 43px 50px 30px 50px;
position: relative;
z-index: 1;
}
.product-details.rd-page .bx-wrapper {
margin-bottom: 30px;
}
.product-details.rd-page .bx-wrapper .thumb-box li {
height: auto;
}
@media only screen and (max-width: 480px) {
.room-block .inner-box .box-caption .book-btn {
padding: 0 10px;
margin-right: 10px;
}
.room-block.col-lg-3 .inner-box .box-caption .bx-links li {
margin-right: 10px;
}
.rooms-section {
padding: 80px 0;
}
}
.project-list {
display: -ms-grid;
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.project-list li {
color: #0A1222;
font-size: 16px;
font-weight: 600;
letter-spacing: -0.03em;
line-height: 19px;
margin-bottom: 30px;
}
.project-list i {
color: var(--theme-color2);
margin-right: 10px;
}
.project-list-item .icon {
color: var(--theme-color2);
font-size: 26px;
}
.project-list-item .title {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: var(--headings-color);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-family: var(--heading-font-family);
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 30px;
letter-spacing: -0.03em;
}
.project-list-item .text {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: var(--text-color2);
font-family: var(--body-font-family);
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 30px;
}
/***
====================================================================
Blog Details
====================================================================
***/
.blog-details {
position: relative;
display: block;
padding: 40px 0;
}
.blog-details__left {
position: relative;
display: block;
}
.blog-details__img {
position: relative;
display: block;
border-radius: 10px;
overflow: hidden;
}
.blog-details__img img {
width: 100%;
border-radius: 10px;
}
.blog-details__date {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: var(--theme-color2);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 21px 24px 20px;
position: absolute;
right: 0;
text-align: center;
top: 0;
}
.blog-details__date .day {
color: #fff;
font-size: 16px;
font-weight: var(--body-font-weight-bold);
line-height: 16px;
}
.blog-details__date .month {
color: #fff;
display: block;
font-size: 10px;
font-weight: var(--body-font-weight-bold);
line-height: 12px;
position: relative;
text-transform: uppercase;
}
.blog-details__content {
display: block;
margin-top: 22px;
position: relative;
}
.blog-details__meta {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
}
.blog-details__meta li + li {
margin-left: 18px;
}
.blog-details__meta li a {
color: #777;
font-size: 15px;
font-weight: 500;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.blog-details__meta li a:hover {
color: var(--theme-color1);
}
.blog-details__meta li a i {
color: var(--theme-color2);
margin-right: 6px;
}
.blog-details__title {
font-size: 24px;
line-height: 30px;
margin-top: 15px;
margin-bottom: 20px;
}
.blog-details__bottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 20px 0;
margin-top: 20px;
border-top: 1px solid #ece9e0;
}
.blog-details__content p{font-size: 16px;line-height: 25px;font-weight: 400;color: #0B3130}
@media only screen and (max-width: 767px) {
.blog-details__bottom {
gap: 30px;
}
}
.blog-details__bottom p {
margin: 0;
}
.blog-details__tags span {
color: #0e2207;
font-size: 20px;
margin-right: 14px;
}
.blog-details__tags a {
background-color: var(--theme-color2);
border-radius: 35px;
color: var(--theme-color-white);
display: inline-block;
font-size: 14px;
padding: 8px 30px;
position: relative;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
text-decoration: none;
}
.blog-details__tags a:hover {
background-color: var(--theme-color2);
color: var(--theme-color-white);
}
.blog-details__tags a + a {
margin-left: 6px;
}
.blog-details__social-list {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.blog-details__social-list a {
background-color: #f06723;
border-radius: 50%;
color: var(--theme-color-white);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
font-size: 15px;
height: 43px;
justify-content: center;
overflow: hidden;
position: relative;
text-align: center;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 43px;
z-index: 1;
}
.blog-details__social-list a:hover {
background-color: var(--theme-color1);
color: var(--theme-color-white);
}
.blog-details__social-list a:hover:after {
opacity: 1;
-webkit-transform: scaleY(1);
transform: scaleY(1);
}
.news-section{padding: 40px 0}
.blog-details__social-list a:after {
position: absolute;
content: "";
top: 0;
left: 0;
right: 0;
height: 100%;
background-color: var(--theme-color2);
-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.4s;
transition-duration: 0.4s;
-webkit-transition-property: all;
transition-property: all;
opacity: 1;
-webkit-transform-origin: top;
transform-origin: top;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: scaleY(0);
transform: scaleY(0);
z-index: -1;
}
.blog-details__social-list a + a {
margin-left: 10px;
}
.blog-details__pagenation-box {
display: block;
margin-bottom: 53px;
overflow: hidden;
position: relative;
}
.blog-details__pagenation {
display: block;
position: relative;
}
.blog-details__pagenation li {
position: relative;
float: left;
font-size: 20px;
color: #0e2207;
font-weight: var(--body-font-weight-bold);
color: var(--theme-light-background-text-color);
background-color: var(--theme-light-background);
line-height: 30px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
max-width: 370px;
width: 100%;
padding-left: 60px;
padding-right: 60px;
padding-top: 52px;
padding-bottom: 52px;
border-radius: 10px;
}
.blog-details__pagenation li:hover {
background-color: var(--theme-color2);
color: var(--theme-color2-text-color);
}
.blog-details__pagenation li + li {
margin-left: 30px;
}
/* Nav Links */
.nav-links {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 53px;
}
@media only screen and (max-width: 767px) {
.nav-links {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 20px;
}
}
.nav-links .prev {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 100%;
margin-right: 30px;
width: calc(50% - 15px);
}
@media only screen and (max-width: 767px) {
.nav-links .prev {
width: 100%;
}
}
.nav-links .prev .thumb {
margin-right: 20px;
}
.nav-links .next {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
height: 100%;
width: calc(50% - 15px);
}
@media only screen and (max-width: 767px) {
.nav-links .next {
width: 100%;
}
}
.nav-links .next .thumb {
margin-left: 20px;
}
.nav-links > div {
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.nav-links > div .thumb {
display: inline-block;
height: 60px;
min-width: 60px;
overflow: hidden;
width: 60px;
}
.nav-links > div .thumb a {
display: inline-block;
}
.nav-links > div > a {
background-color: var(--theme-color-gray);
border-radius: 10px;
color: var(--theme-light-background-text-color);
display: inline-block;
font-size: 20px;
font-weight: var(--body-font-weight-bold);
line-height: 1.637;
padding: 52px 50px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
word-wrap: break-word;
white-space: -moz-pre-wrap;
white-space: pre-wrap;
width: 100%;
}
@media only screen and (max-width: 767px) {
.nav-links > div > a {
padding: 30px;
}
}
.nav-links > div > a:hover {
background-color: var(--theme-color2);
color: var(--theme-color-light);
}
/***
====================================================================
Sidebar
====================================================================
***/
@media (max-width: 991px) {
.sidebar {
margin-top: 50px;
}
}
.sidebar__single + .sidebar__single {
margin-top: 30px;
}
.sidebar__title {
font-size: 20px;
font-weight: var(--h4-font-weight);
margin: 0;
margin-bottom: 5px;
margin-left: 15px;
}
.sidebar__search {
position: relative;
display: block;
}
.sidebar__search-form {
position: relative;
}
.sidebar__search-form input[type=search] {
background-color: var(--theme-color2);
border: none;
border-radius: 10px;
color: var(--theme-color-white);
display: block;
font-size: 16px;
font-weight: 500;
height: 74px;
outline: none;
padding-left: 50px;
padding-right: 80px;
width: 100%;
}
.sidebar__search-form input[type=search]::-webkit-input-placeholder {
color: var(--theme-color-white);
opacity: 1;
}
.sidebar__search-form input[type=search]::-webkit-input-placeholder, .sidebar__search-form input[type=search]:-ms-input-placeholder, .sidebar__search-form input[type=search]::-ms-input-placeholder, .sidebar__search-form input[type=search]::placeholder {
color: var(--theme-color-white);
opacity: 1;
}
@media only screen and (max-width: 767px) {
.sidebar__search-form input[type=search] {
padding-left: 30px;
}
}
.sidebar__search-form button[type=submit] {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: transparent;
bottom: 0;
border: none;
color: #fff;
font-size: 22px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
outline: none;
padding: 0;
position: absolute;
right: 0;
top: 0;
width: 72px;
}
@media only screen and (max-width: 767px) {
.sidebar__search-form button[type=submit] {
width: 42px;
}
}
.sidebar__post {
position: relative;
display: block;
padding: 40px 20px;
color: var(--bg-theme-color1);
background-color: var(--theme-color-gray);
border-radius: 10px;
overflow: hidden;
z-index: 1;
}
@media only screen and (max-width: 767px) {
.sidebar__post {
padding: 30px;
}
}
.sidebar__post .sidebar__title {
}
@media only screen and (max-width: 767px) {
.sidebar__post .sidebar__title {
margin-left: 0;
}
}
.sidebar__post .sidebar__post-list {
margin: 0;
}
.sidebar__post .sidebar__post-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 15px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
@media only screen and (max-width: 767px) {
.sidebar__post .sidebar__post-list li {
padding: 16px 0;
}
}
.sidebar__post .sidebar__post-list li:hover {
background-color: #ffffff;
border-radius: 10px;
}
.sidebar__post .sidebar__post-list li + li {
margin-top: 11px;
}
.sidebar__post .sidebar__post-list .sidebar__post-image {
margin-right: 15px;
-webkit-box-flex: 70px;
-ms-flex: 70px 0 0px;
flex: 70px 0 0;
}
.sidebar__post .sidebar__post-list .sidebar__post-image > img {
width: 80px;
border-radius: 10px;
}
.sidebar__post .sidebar__post-list .sidebar__post-content {
position: relative;
}
.sidebar__post .sidebar__post-list .sidebar__post-content h3 {
font-size: 18px;
margin: 0;
line-height: 26px;
}
.sidebar__post .sidebar__post-list .sidebar__post-content h3 a {
color: #0e2207;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
display: block;
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
.sidebar__post .sidebar__post-list .sidebar__post-content-meta {
font-size: 14px;
font-weight: 500;
color: #757873 !important;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.sidebar__post .sidebar__post-list .sidebar__post-content-meta i {
color: var(--theme-color2);
font-size: 13px;
padding-right: 5px;
}
.sidebar__category {
position: relative;
display: block;
color: var(--theme-light-background-text-color);
background-color: var(--theme-color-gray);
border-radius: 10px;
padding: 45px 30px 38px;
overflow: hidden;
z-index: 1;
}
@media only screen and (max-width: 767px) {
.sidebar__category {
padding: 30px 15px 30px;
}
}
.sidebar__category .sidebar__title {
padding-left: 20px;
margin-bottom: 9px;
}
.sidebar__category-list {
margin: 0;
}
.sidebar__category-list li + li {
margin-top: 4px;
}
.sidebar__category-list li a {
color: #757873;
font-size: 16px;
position: relative;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
display: block;
background: none;
padding: 12px 20px;
font-weight: 500;
border-radius: 10px;
}
.sidebar__category-list li a:hover {
background-color: rgb(255, 255, 255);
-webkit-box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
color: #0e2207;
text-shadow: 1px 0 0 rgba(14, 34, 7, 0.5);
}
.sidebar__category-list li a:hover span {
color: #ffcd1e;
-webkit-transform: translateY(-50%) scale(1);
transform: translateY(-50%) scale(1);
}
.sidebar__category-list li a span {
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%) scale(0);
transform: translateY(-50%) scale(0);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
color: var(--theme-color2);
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
font-size: 16px;
}
.sidebar__category-list li.active a {
background-color: rgb(255, 255, 255);
-webkit-box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.05);
color: #0e2207;
border-radius: 10px;
text-shadow: 1px 0 0 rgba(14, 34, 7, 0.5);
}
.sidebar__category-list li.active a span {
-webkit-transform: translateY(-50%) scale(1);
transform: translateY(-50%) scale(1);
color: #ffcd1e;
}
.sidebar__tags {
background-color: var(--theme-color-gray);
border-radius: 10px;
color: var(--theme-light-background-text-color);
display: block;
overflow: hidden;
padding: 46px 45px 50px;
position: relative;
z-index: 1;
}
@media only screen and (max-width: 767px) {
.sidebar__tags {
padding: 30px;
}
}
.sidebar__tags .sidebar__title {
margin-bottom: 25px;
margin-left: 5px;
}
.sidebar__tags-list {
margin-top: -10px;
}
.sidebar__tags-list a {
background: var(--theme-color-white);
border-radius: 30px;
color: #0e2207;
display: inline-block;
font-size: 14px;
margin-left: 5px;
padding: 5px 28px 5px;
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.sidebar__tags-list a:hover {
color: var(--theme-color-white);
background: var(--theme-color2);
}
.sidebar__tags-list a + a {
margin-left: 5px;
margin-top: 10px;
}
.sidebar__comments {
position: relative;
display: block;
color: var(--theme-light-background-text-color);
background-color: var(--theme-color-gray);
padding: 46px 50px 43px;
border-radius: 10px;
overflow: hidden;
z-index: 1;
}
@media only screen and (max-width: 767px) {
.sidebar__comments {
padding: 30px;
}
}
.sidebar__comments .sidebar__title {
margin-bottom: 25px;
}
.sidebar__comments-list {
position: relative;
display: block;
}
.sidebar__comments-list li {
position: relative;
display: block;
padding-left: 65px;
}
.sidebar__comments-list li:hover .sidebar__comments-icon {
background-color: var(--theme-color1);
color: var(--theme-color-dark);
}
.sidebar__comments-list li + li {
margin-top: 23px;
}
.sidebar__comments-icon {
height: 45px;
width: 45px;
background-color: var(--theme-color2);
border-radius: 50%;
font-size: 15px;
color: var(--theme-color-light);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.sidebar__comments-text-box p {
font-size: 15px;
margin: 0;
line-height: 26px;
font-weight: 500;
}
.sidebar__comments-text-box p span {
color: #0e2207;
}
.sidebar__comments-text-box h5 {
font-size: 15px;
margin: 0;
line-height: 26px;
color: #757873;
font-weight: 500;
letter-spacing: 0;
}
/***
====================================================================
Comments
====================================================================
***/
.comment-one .comment-one__title {
margin-bottom: 30px;
}
.comment-one .comment-one__single {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
border-bottom: 1px solid #ece9e0;
padding-bottom: 60px;
margin-bottom: 60px;
-webkit-box-align: top;
-ms-flex-align: top;
align-items: top;
}
@media only screen and (max-width: 767px) {
.comment-one .comment-one__single {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.comment-one .comment-one__content {
position: relative;
margin-left: 45px;
}
@media only screen and (max-width: 767px) {
.comment-one .comment-one__content {
margin-top: 20px;
margin-left: 0;
}
}
.comment-one .comment-one__content h3 {
margin: 0;
font-size: 20px;
color: var(--theme-color-dark);
margin-bottom: 24px;
}
.comment-one .comment-one__content p {
font-size: 16px;
}
.comment-one .comment-one__btn {
background-color: var(--theme-color2);
border-radius: 35px;
color: var(--theme-color-white);
font-size: 12px;
padding: 5px 30px;
position: absolute;
right: 0;
top: 0;
}
.comment-one .comment-one__image {
position: relative;
display: block;
border-radius: 50%;
-webkit-box-flex: 100px;
-ms-flex: 100px 0 0px;
flex: 100px 0 0;
}
.comment-one .comment-one__image img {
border-radius: 50%;
}
.comment-form .comment-form__title {
margin-top: -7px;
}
/*--------------------------------------------------------------
# Team Details
--------------------------------------------------------------*/
.team-details {
position: relative;
display: block;
}
.team-details__top {
padding: 0 0 120px;
}
.team-details-shape-1 {
position: absolute;
bottom: -270px;
right: 0;
opacity: 0.5;
z-index: 2;
}
.team-details-shape-1 img {
width: auto;
}
.team-details__top-left {
position: relative;
display: block;
margin-right: 20px;
}
.team-details__top-img {
position: relative;
display: block;
border-radius: 30px;
}
.team-details__top-img img {
width: 100%;
border-radius: 30px;
}
.team-details__big-text {
font-size: 80px;
line-height: 80px;
text-transform: uppercase;
color: #eef0f6;
letter-spacing: 0.35em;
font-weight: 400;
position: absolute;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
top: 209px;
left: -325px;
}
.team-details__top-right {
position: relative;
display: block;
margin-left: 70px;
}
@media only screen and (max-width: 991px) {
.team-details__top-right {
margin-top: 70px;
margin-left: 0;
}
}
.team-details__top-content {
position: relative;
display: block;
margin-top: -11px;
}
.team-details__top-name {
font-size: 40px;
font-weight: 700;
line-height: 50px;
margin-bottom: 3px;
}
.team-details__top-title {
color: var(--theme-color2);
font-size: 16px;
}
.team-details__social {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 20px;
margin-bottom: 28px;
}
.team-details__social a {
position: relative;
height: 40px;
width: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
background-color: var(--theme-color2);
border-radius: 50%;
color: var(--theme-color-light);
font-size: 15px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-details__social a:hover {
background-color: var(--theme-color1);
color: var(--theme-color-dark);
}
.team-details__social a + a {
margin-left: 10px;
}
.team-details__top-text-1 {
color: var(--theme-color2);
font-size: 30px;
font-weight: 400;
line-height: 45px;
margin-bottom: 30px;
}
.team-details__top-text-2 {
padding-top: 23px;
padding-bottom: 35px;
}
.team-details__bottom {
border-top: 1px solid #e4e5ea;
display: block;
padding-top: 110px;
position: relative;
}
.team-details__bottom-left {
display: block;
margin-right: 70px;
position: relative;
}
.team-details__bottom-left-title {
font-size: 36px;
font-weight: 700;
line-height: 46px;
}
.team-details__bottom-left-text {
padding-top: 30px;
}
.team-details__bottom-right {
display: block;
margin-left: 70px;
margin-top: 1px;
position: relative;
}
@media only screen and (max-width: 991px) {
.team-details__bottom-right {
margin-left: 0;
}
}
.team-details__progress {
display: block;
position: relative;
width: 100%;
}
.team-details__progress .bar {
background-color: #eef0f6;
border-radius: 7px;
height: 13px;
margin-bottom: 22px;
position: relative;
width: 100%;
}
.team-details__progress .bar-inner {
background-color: var(--theme-color1);
border-radius: 7px;
display: block;
height: 13px;
position: relative;
-webkit-transition: all 1500ms ease;
transition: all 1500ms ease;
width: 0px;
}
.team-details__progress .count-text {
bottom: 21px;
color: var(--theme-color2);
font-size: 14px;
font-weight: 500;
line-height: 24px;
opacity: 0;
position: absolute;
right: 0px;
text-align: center;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.team-details__progress .bar-inner.counted .count-text {
opacity: 1;
}
.team-details__progress .bar.marb-0 {
margin-bottom: 0;
}
.team-details__progress-single {
display: block;
position: relative;
}
.team-details__progress-title {
color: var(--theme-color2);
font-size: 16px;
font-weight: 700;
line-height: 28px;
margin-bottom: 6px;
}
.team-contact-form {
background-color: #eef0f6;
}
.team-contact-form input[type=text],
.team-contact-form input[type=email] {
background-color: #fff;
}
.team-contact-form textarea {
background-color: #fff;
height: 180px;
}
.team-details-form .theme-btn {
min-width: 220px;
}
.team-details-form .theme-btn.theme-btn-2 {
background: var(--theme-color1);
color: #144443;
}
.team-details-form .theme-btn.theme-btn-2::before {
background-color: #144443;
}
.team-details-form .theme-btn.theme-btn-2:hover {
color: var(--theme-color1);
}
/***
====================================================================
Contact
====================================================================
***/
.contact-details-block {
background-color: var(--theme-color-white);
-webkit-box-shadow: 0px 15px 10px 0px rgba(188, 194, 198, 0.1803921569);
box-shadow: 0px 15px 10px 0px rgba(188, 194, 198, 0.1803921569);
border-radius: 8px;
padding: 65px 20px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
text-align: center;
}
.contact-details-block .inner-box {
max-width: 260px;
margin: 0 auto;
}
.contact-details-block .icon {
margin-bottom: 20px;
-webkit-transition: all 700ms ease;
transition: all 700ms ease;
font-size: 50px;
line-height: 1;
color: var(--headings-color);
}
.contact-details-block .icon svg,
.contact-details-block .icon i {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-details-block .icon svg path,
.contact-details-block .icon i path {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-details-block .title {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
margin-bottom: 20px;
text-transform: capitalize;
}
.contact-details-block .text {
margin-bottom: 0;
color: var(--text-color2);
font-weight: 500;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
line-height: 28px;
font-size: 18px;
}
.contact-details-block:hover {
background-color: var(--theme-color2);
}
.contact-details-block:hover .icon {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
.contact-details-block:hover .icon svg,
.contact-details-block:hover .icon i {
color: var(--theme-color-white);
}
.contact-details-block:hover .icon svg path,
.contact-details-block:hover .icon i path {
fill: var(--theme-color-white);
}
.contact-details-block:hover .title {
color: var(--theme-color-white);
}
.contact-details-block:hover .text {
color: var(--theme-color-white);
}
.contact-six-aera {
overflow: hidden;
}
.contact-six__wrp {
position: relative;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
padding: 130px 100px;
margin-right: -20px;
}
@media (max-width: 1199.98px) {
.contact-six__wrp {
padding: 60px 30px;
}
}
.contact-six__wrp:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
background-color: rgba(6, 50, 50, 0.8);
}
.contact-six__image {
position: relative;
z-index: 1;
height: 100%;
margin-left: 20px;
}
.contact-six__image img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.contact-six__image .circle-btn {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 200px;
height: 200px;
line-height: 200px;
text-align: center;
border-radius: 50%;
-webkit-transition: all 700ms ease;
transition: all 700ms ease;
backdrop-filter: blur(20px);
background-color: rgba(255, 255, 255, 0.2);
padding-top: 70px;
}
@media (max-width: 767.98px) {
.contact-six__image .circle-btn {
padding-top: 40px;
}
}
.contact-six__image .circle-btn span {
display: block;
color: var(--theme-color-white);
font-size: 16px;
line-height: 24px;
font-weight: 500;
}
.contact-six__image .circle-btn span i {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.contact-six__image .circle-btn:hover span i {
-webkit-transform: rotate(0);
transform: rotate(0);
}
.contact-six__item .section-header {
max-width: 860px;
}
.contact-six__item .section-header .title {
font-size: 80px;
line-height: 90px;
font-weight: 600;
}
@media (max-width: 767.98px) {
.contact-six__item .section-header .title {
font-size: 30px;
line-height: 40px;
}
}
.contact-six__item .section-header .text {
font-size: 16px;
}
.contact-six__item .wrp {
max-width: 640px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 80px;
padding-top: 60px;
margin-top: 60px;
border-top: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 767.98px) {
.contact-six__item .wrp {
gap: 20px;
}
}
.contact-details {
overflow: hidden;
}
.contact-details .content-column .inner-column .google-map iframe {
width: 100%;
height: 350px;
}
.contact-details .content-column .inner-column form .type-feild {
position: relative;
z-index: 1;
margin-bottom: 45px;
}
.contact-details .content-column .inner-column form .type-feild input {
padding-bottom: 15px;
padding-left: 35px;
width: 100%;
border-bottom: 1px solid rgba(92, 92, 91, 0.3);
}
.contact-details .content-column .inner-column form .type-feild textarea {
padding-bottom: 15px;
padding-left: 35px;
width: 100%;
border-bottom: 1px solid rgba(92, 92, 91, 0.3);
height: 130px;
}
.contact-details .content-column .inner-column form .type-feild i {
position: absolute;
top: 0;
left: 0;
}
.contact-details .content-column .inner-column.right-column {
max-width: 590px;
margin-left: auto;
}
.contact-details .content-column .inner-column.right-column .sec-title {
margin-bottom: 55px !important;
}
/***
==================================================================
Main Footer
==================================================================
***/
.footer-newsletter-wrapper {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 60px 0;
}
@media (max-width: 991.98px) {
.footer-newsletter-wrapper {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 25px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.footer-newsletter-wrapper .footer-newsletter-left {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 35px;
}
.footer-newsletter-wrapper .footer-newsletter-left .icon {
width: 80px;
height: 80px;
line-height: 80px;
text-align: center;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.2);
text-align: center;
font-size: 36px;
color: var(--theme-color1);
}
.footer-newsletter-wrapper form {
max-width: 760px;
width: 100%;
}
.footer-newsletter-wrapper .form-clt {
position: relative;
max-width: 525px;
width: 100%;
margin: 0 auto;
margin-right: 0;
}
@media (max-width: 991.98px) {
.footer-newsletter-wrapper .form-clt {
max-width: initial;
}
}
.footer-newsletter-wrapper .form-clt input {
width: 100%;
border: none;
border-radius: 50px;
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(20px);
padding: 27px 40px;
padding-right: 20px;
line-height: 1;
text-transform: capitalize;
color: var(--theme-color-white);
}
.footer-newsletter-wrapper .form-clt input::-webkit-input-placeholder {
color: var(--theme-color-white);
}
.footer-newsletter-wrapper .form-clt input::-moz-placeholder {
color: var(--theme-color-white);
}
.footer-newsletter-wrapper .form-clt input:-ms-input-placeholder {
color: var(--theme-color-white);
}
.footer-newsletter-wrapper .form-clt input::-ms-input-placeholder {
color: var(--theme-color-white);
}
.footer-newsletter-wrapper .form-clt input::placeholder {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-newsletter-wrapper .form-clt input::-webkit-input-placeholder {
color: var(--headings-color);
}
[data-tm-layout=dark] .footer-newsletter-wrapper .form-clt input::-moz-placeholder {
color: var(--headings-color);
}
[data-tm-layout=dark] .footer-newsletter-wrapper .form-clt input:-ms-input-placeholder {
color: var(--headings-color);
}
[data-tm-layout=dark] .footer-newsletter-wrapper .form-clt input::-ms-input-placeholder {
color: var(--headings-color);
}
[data-tm-layout=dark] .footer-newsletter-wrapper .form-clt input::placeholder {
color: var(--headings-color);
}
.footer-newsletter-wrapper .form-clt .arrow-icon {
background-image: -webkit-gradient(linear, right top, left top, from(var(--theme-color1)), color-stop(50%, var(--theme-color7)), to(var(--theme-color1)));
background-image: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
background-size: 200%;
border: none;
border-radius: 50%;
height: 52px;
line-height: 58px;
outline: none;
position: absolute;
right: 15px;
text-align: center;
top: 14px;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
font-size: 25px;
color: var(--theme-color-white);
width: 52px;
}
@media (max-width: 1199.98px) {
.footer-newsletter-wrapper .form-clt .arrow-icon {
right: 15px;
}
}
.footer-newsletter-wrapper .form-clt .arrow-icon:hover {
background-position: 100% 0;
}
.footer-widget-wrapper {
padding: 30px 0 60px;
}
.footer-widget-wrapper .footer-widget-items .footer-content p {
color: #B4B4B4;
max-width: 270px;
}
.footer-widget-wrapper .footer-widget-items .footer-content .social-icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
margin-top: 30px;
}
.footer-widget-wrapper .footer-widget-items .footer-content .social-icon a {
display: inline-block;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.2);
text-align: center;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-widget-wrapper .footer-widget-items .footer-content .social-icon a {
color: var(--link-color);
}
.footer-widget-wrapper .footer-widget-items .footer-content .social-icon a:hover {
background: var(--gradient-1);
}
.footer-widget-wrapper .footer-widget-items .user-links {
position: relative;
}
.footer-widget-wrapper .footer-widget-items .user-links li {
position: relative;
font-size: 16px;
font-weight: 400;
}
.footer-widget-wrapper .footer-widget-items .user-links li:not(:last-child) {
margin-bottom: 15px;
}
.footer-widget-wrapper .footer-widget-items .user-links li a {
color: #B8B8B8;
position: relative;
}
[data-tm-layout=dark] .footer-widget-wrapper .footer-widget-items .user-links li a {
color: #ffffff;
}
.footer-widget-wrapper .footer-widget-items .user-links li a::before {
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 1px;
background: var(--gradient-1);
content: "";
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.footer-widget-wrapper .footer-widget-items .user-links li:hover a {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-widget-wrapper .footer-widget-items .user-links li:hover a {
color: #ffffff;
}
.footer-widget-wrapper .footer-widget-items .user-links li:hover a::before {
width: 100%;
}
.footer-widget-wrapper .footer-widget-items .contact-list li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 10px;
}
.footer-widget-wrapper .footer-widget-items .contact-list li i {
font-size: 22px;
color: #f06723;
}
.footer-widget-wrapper .footer-widget-items .contact-list li:not(:last-child) {
margin-bottom: 22px;
}
.footer-widget-wrapper .footer-widget-items .contact-list li p {
color: #B8B8B8;
line-height: 1.5;
}
.footer-widget-wrapper .footer-widget-items .contact-list li p a {
color: #B8B8B8;
}
.footer-widget-wrapper.style-2 {
padding: 20px 0 50px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 991.98px) {
.footer-widget-wrapper.style-2 {
padding: 50px 0 80px;
}
}
.footer-widget-wrapper.style-2 .footer-content .contact-list-2 {
margin-top: 20px;
}
.footer-widget-wrapper.style-2 .footer-content .contact-list-2 li {
background: rgba(242, 241, 246, 0.1);
padding: 10px 30px;
display: inline-block;
font-family: var(--heading-font-family);
font-size: 18px;
}
@media (max-width: 1199.98px) {
.footer-widget-wrapper.style-2 .footer-content .contact-list-2 li {
font-size: 16px;
padding: 10px 20px;
}
}
.footer-widget-wrapper.style-2 .footer-content .contact-list-2 li a {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-widget-wrapper.style-2 .footer-content .contact-list-2 li a {
color: #ffffff;
}
.footer-widget-wrapper.style-2 .footer-content .contact-list-2 li:not(:last-child) {
margin-bottom: 20px;
}
.footer-widget-wrapper.style-2 .user-links {
position: relative;
}
.footer-widget-wrapper.style-2 .user-links li {
position: relative;
font-size: 16px;
font-weight: 400;
}
.footer-widget-wrapper.style-2 .user-links li:not(:last-child) {
margin-bottom: 15px;
}
.footer-widget-wrapper.style-2 .user-links li a {
color: var(--theme-color-white);
position: relative;
}
[data-tm-layout=dark] .footer-widget-wrapper.style-2 .user-links li a {
color: #ffffff;
}
.footer-widget-wrapper.style-2 .user-links li a::before {
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 1px;
background: var(--gradient-1);
content: "";
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.footer-widget-wrapper.style-2 .user-links li:hover a {
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-widget-wrapper.style-2 .user-links li:hover a {
color: #ffffff;
}
.footer-widget-wrapper.style-2 .user-links li:hover a::before {
width: 100%;
}
.footer-widget-wrapper.style-2 .user-links-area {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 80px;
}
@media (max-width: 1199.98px) {
.footer-widget-wrapper.style-2 .user-links-area {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 30px;
}
}
.footer-bottom {
background: #183130;
padding: 30px 0;
}
.footer-bottom p {
text-align: left;
color: #fff;
}
.footer-section-2 {
margin: 0 30px 30px;
border-radius: 50px;
position: relative;
z-index: 9;
}
@media (max-width: 1399.98px) {
.footer-section-2 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (max-width: 767.98px) {
.footer-section-2 {
margin: 0 20px;
padding-left: 18px;
padding-right: 18px;
}
}
.footer-section-2 .bg-color {
position: absolute;
right: 0;
top: -500px;
bottom: 0;
z-index: -1;
}
.footer-section-2 .bg-color img {
height: 100%;
}
.footer-top-wrapper {
padding: 90px 0 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
padding-bottom: 40px;
}
@media (max-width: 991.98px) {
.footer-top-wrapper {
padding-top: 80px;
}
}
@media (max-width: 575.98px) {
.footer-top-wrapper {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 30px;
}
}
.footer-top-wrapper .social-icon {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
}
.footer-top-wrapper .social-icon a {
display: inline-block;
width: 50px;
height: 50px;
line-height: 50px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.1);
text-align: center;
color: var(--theme-color-white);
}
[data-tm-layout=dark] .footer-top-wrapper .social-icon a {
color: var(--headings-color);
}
.footer-top-wrapper .social-icon a:hover {
background: var(--theme-color1);
color: var(--headings-color);
}
.footer-text {
text-align: center;
font-size: 16px;
font-weight: 400;
color: var(--theme-color-white);
padding-bottom: 50px;
padding-top: 24px;
}
[data-tm-layout=dark] .footer-text {
color: #ffffff;
}
.footer-text-2 {
text-align: center;
font-size: 16px;
font-weight: 400;
color: var(--theme-color-white);
padding: 24px 0;
}
.footer-section-1 {
position: relative;
z-index: 9;
}
.footer-section-1 .circle-shape {
display: inline-block;
border-radius: 592px;
background: linear-gradient(48deg, rgba(8, 44, 43, 0.3) 13.25%, rgba(128, 167, 82, 0.3) 83.21%);
width: 592px;
height: 592px;
border-radius: 50%;
position: absolute;
top: -20%;
right: -10%;
z-index: -1;
}
@media (max-width: 1199.98px) {
.footer-section-1 .circle-shape {
display: none;
}
}
.footer-section-1 .circle-shape-2 {
display: inline-block;
border-radius: 592px;
background: transparent;
width: 592px;
height: 592px;
border-radius: 50%;
position: absolute;
top: 0;
left: -20%;
z-index: -1;
border: 5px solid #ed6e2d;
opacity: 0.2;
}
@media (max-width: 1199.98px) {
.footer-section-1 .circle-shape-2 {
display: none;
}
}
.footer-section-2 {
position: relative;
z-index: 9;
}
.footer-section-2 .footer-left-shape {
position: absolute;
top: 60px;
left: 0;
z-index: -1;
}
@media (max-width: 1199.98px) {
.footer-section-2 .footer-left-shape {
display: none;
}
}
.footer-section-2 .footer-right-shape {
position: absolute;
bottom: 60px;
right: 0;
z-index: -1;
}
@media (max-width: 1199.98px) {
.footer-section-2 .footer-right-shape {
display: none;
}
}
.footer-section-2 .footer-shape {
position: absolute;
top: 30px;
left: 40%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 1199.98px) {
.footer-section-2 .footer-shape {
display: none;
}
}
.footer-section-4 {
position: relative;
}
.footer-section-4 .footer-left-shape {
position: absolute;
top: 50px;
left: 0;
z-index: -1;
}
@media (max-width: 1199.98px) {
.footer-section-4 .footer-left-shape {
display: none;
}
}
.footer-section-4 .footer-right-shape {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 0;
z-index: -1;
}
@media (max-width: 1199.98px) {
.footer-section-4 .footer-right-shape {
display: none;
}
}
.logo{width: 200px}
.footer-logo{width: 250px;display: block;}
.footer-iso{display: flex;align-items: center;margin-top: 15px}
.footer-iso-img{width: 90px}
.footer-iso-img:first-child{margin-right: 20px}
.footer-iso-img:first-child img{border-radius: 10px}
.footer-link{text-align: right}
.footer-link a{color: #fff}
.news-section{padding: 60px 0;background-color: #efefef}
.sticky-social {position: fixed;top: 25%;right: 20px;width: 100%;padding-right: 0;z-index: 100;pointer-events: none;}
.social-wrapper {overflow: hidden;margin-left: auto;width: max-content;height: max-content;padding: 10px 0;pointer-events: fill;box-shadow: 0px 10px 20px 11px rgb(116 48 10 / 20%);background-color: #fff;border-radius: 8px}
.sticky-social__s {color: #f06723;font-size: 26px;display: inline-block;transition: transform 1s ease-in-out;}
.sticky-social__wrapper {display: flex;align-items: center;justify-content: center;width: 50px;height: 50px;}
.sticky-social__wrapper .sticky_text {position: absolute;transform: translateX(10px);text-align: start;width: max-content;display: flex;opacity: 0;justify-content: start;z-index: -1;transition: ease-in-out .3s;color: #fff;right: 50px;padding: 5px 8px;align-items: center;height: 25px;font-weight: 400;border-radius: 4px;background: #000;box-shadow: 0px 0px 4px 0px rgb(0 0 0 / 8%);line-height: normal;font-size: 14px}
.sticky-social__wrapper:hover .sticky_text {opacity: 1;transform: translateX(-25px);transition: ease-in-out .3s}
.sticky-social__wrapper:hover .sticky-social__s{transform: scale(1.3);transition: transform 1s ease-in-out;color: #f58a20}
.home-sidebar-article__stories {display: block;height: 480px;overflow: auto;position: relative;}
.sidebar-article {display: -ms-flexbox;display: flex;-ms-flex-align: start;align-items: flex-start;margin-bottom: 10px;padding: 20px;background: #fff;border-radius: 8px;}
.sidebar-article__img {width: 110px;height: 90px;border-radius: 8px;}
.sidebar-article__img img {width: 100%;height: 100%;object-fit: cover;border-radius: 8px;object-position: center}
.sidebar-article__info {flex: 1;-ms-flex: 1;margin-left: 10px;}
.news-item__title {font-size: 16px;line-height: 20px;display: block;font-weight: 400;color: #1b262c;font-family: Roboto, sans-serif;transition: .2s all;}
.news-item__date > span {color: #909090;font-size: 14px;display: inline-block;}
.page-view{padding: 40px 0}
.sub-title {font-size: 20px;font-weight: 600;color: #0E121D;text-transform: uppercase;margin-bottom: 25px;position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;gap: 5px;}
.sub-title .shape {display: inline-block;height: 3px;width: 50px;background-color: #f58a20;border-radius: 12px;position: relative;}
.sub-title .shape.right .dots {right: -6px;}
.sub-title .dots {display: inline-block;width: 3px;height: 3px;background-color: inherit;border-radius: 99px;position: absolute;top: 0;}
.sub-title .shape.right .dots:before {right: -6px;}
.sub-title .shape.right .dots:after {right: -12px;}
.sub-title .dots:before, .sub-title .dots:after {content: "";height: inherit;width: inherit;background-color: inherit;border-radius: inherit;display: inline-block;position: absolute;top: 0;}
.content-text p{margin-bottom: 10px;font-size: 16px;line-height: 25px;color: #0E121D}
/*calculator*/
.calc-input {display: flex;padding: 30px 0;}
.loanCalculator {padding: 0 20px}
.loanCalculator > div {margin-bottom: 25px;}
.loanCalculator .ranger {position: relative; padding: 5px 0}
.loanCalculator .ranger div.value {padding-bottom: 10px}
.loanCalculator select {background-color: transparent; border: 1px solid #0000000d; color: #088408}
.loanCalculator select:focus {background-color: #ffffff50}
.uk-grid-small>.uk-grid-margin{margin-top: 0px;}
.nest {}
.nest .right {margin-left: auto}
.nest .title {display: flex; padding-bottom: 10px; margin-top: 10px;}
.nest .title input {border: none; background-color: transparent; font-size: 14px; color: #000000}
.tile-wrapper-loan {margin-bottom: 20px}
.ui-state-default, .ui-widget-content .ui-state-default {top: -7px !important; height: 20px; width: 20px; border-radius: 50%;border: 1px solid #0092cb}
.ui-widget.ui-widget-content {border: 0 !important;height: 2px;}
.ui-slider-handle:before{content: "\f0da";display: block; margin-top: 0;position: absolute;left: 9px;font-size: 10px;font-family: 'Font Awesome 5 Free';font-weight: 900;color: #0092cb}
.ui-slider-handle:after{content: "\f0d9";display: block; margin-top: 0;position: absolute;right: 9px;font-size: 10px;font-family: 'Font Awesome 5 Free';font-weight: 900;color: #0092cb}
.ui-state-active{background-color: transparent;}
.uk-select:focus{border-color: #E5E5E5}
.uk-table th {padding: 10px 12px;text-align: left;vertical-align: bottom;font-size: 16px;font-weight: 600;color: #f06723;border: 1px solid #ededed;text-transform: uppercase;border-radius: 10px;}
.uk-table td {padding: 10px 12px;vertical-align: top;border: 1px solid #ededed;color: #000;}
.terms-box{ margin: 15px 0;background: #fff;border-radius: 10px;}
.requirements-box{position: relative;padding: 20px;margin-bottom: 20px;background: #fff;border-radius: 10px;}
.requirements-box
.requirements-head{font-size: 16px;font-weight: 600;color: #f06723;text-transform: uppercase;}
.requirements-item-list{border-top: 1px solid #efefef;margin-top: 5px;padding-top: 5px;}
.requirements-item{color: #000;font-size: 16px;line-height: 25px;}
.requirements-item i{margin-right: 5px;color: #f06723;font-size: 18px;}
.loan-view{padding: 30px 0;background: #F6F5EF}
.loan-back{padding: 20px;}
.loan-text{margin-top: 20px}
.loan-text p{font-size: 16px;line-height: 25px;color: #000;margin-bottom: 10px}
.loan-info{margin-bottom: 40px}
.highlight {color: #f06723;font-weight: bold;}
.loan-info * {font-size: 16px;}
.basic{color: #000}
.color.gcp {color: #000;caption-side:top;}
.loan-info .sub-info div, .loan-info .sub-info span {color: #f06723;font-size: 24px;line-height: 35px;}
.loan-info .sub-info input {border: 0;font-size: 24px;color: #f06723;background: none;}
table.payment-table {border: 1px solid #EAEEF7;box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);}
table.payment-table th:not(.numeric), table.payment-table td:not(.numeric) {text-align: right;}
.uk-table-divider>:first-child>tr:not(:first-child), .uk-table-divider>:not(:first-child)>tr, .uk-table-divider>tr:not(:first-child) {border-top: 1px solid #EAEEF7 !important;}
.uk-table-striped tbody tr:nth-of-type(odd), .uk-table-striped>tr:nth-of-type(odd) {background: #F5F6FA !important;border-top: 1px solid #EAEEF7 !important;border-bottom: 1px solid #EAEEF7 !important;}
table.payment-table * {font-size: 16px;color: #555;caption-side:top;}
table.payment-table th {color: #000;text-transform: none;}
.input-calc .icon-holder {position: relative;padding: 0 20px;height: 40px;background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);}
.input-calc .icon-holder span{color: #fff;font-size: 22px;}
.input-calc span.desc {display: inline-block;margin-bottom: 10px;font-size: 16px;color: #000;}
.ui-widget.ui-widget-content {border: 0 !important;height: 2px;}
.ui-widget-content {background-color: #0092cb;}
.ui-slider-horizontal .ui-slider-range-min {background-color: #f06723;}
.calc-list-item{border-bottom: 1px solid #ededed;padding-bottom: 10px;margin-bottom: 10px;}
.calc-item-price{font-size: 18px;line-height: 25px;font-weight: 600;color: #f06723;margin-bottom: 5px;}
.calc-item-desc{font-size: 16px;color: #222;line-height: 20px;font-weight: 400;}
.alert p{font-size: 16px;line-height: 25px;color: #000}
.branch-description{margin-top: 20px;padding: 15px;background: #fff;border-radius: 10px;}
.branch-description p{font-size: 16px;line-height: 25px;text-transform: uppercase;font-weight: 500;color: #000;}
.faq-back{padding: 40px 0}
.branch-back{padding: 40px 0;background: #f5f5f5}
.feedback-back{padding: 40px 0;background: #f5f5f5}
.request-back{padding: 40px 0;background: #f5f5f5}
.form-select{padding: 12px 20px}
.juram-box{border: 2px solid #183130;padding: 30px 20px;border-radius: 10px;background: #fff;margin-bottom: 20px;height: 160px}
.juram-name{font-size: 16px;line-height: 25px;font-weight: 600;margin-bottom: 10px;color: #000;}
.juram-attack{border: 1px solid #f06723;border-radius: 10px;text-align: center;line-height: 36px;font-size: 20px;text-transform: uppercase;color: #f06723;}
.juram-attack a{color: #f06723;}
/* sidebar for*/
.sidebar-loan{margin-top: 30px}
.sidebar-loan-list li{margin-bottom: 10px;border: 1px solid #ededed;padding: 10px 20px;border-radius: 10px;}
.sidebar-loan-list li a{font-size: 18px;line-height: 25px;}
.sidebar-loan-list .current a{color: #f06723}
.language-box{display: flex;align-items: center;}
.language-item-icon{margin-right: 8px;font-size: 20px;color: #fff;line-height: 35px;}
.language-item-sel{font-size: 18px;text-transform: uppercase;color: #fff;font-weight: 600;line-height: 20px;}
.language-item-sel a{color: #fff}
/* branch for*/
.branch-box{position: relative;background-color: #fff;-webkit-box-shadow: 0px 7px 24px rgba(0, 0, 0, 0.06);box-shadow: 0px 7px 24px rgba(0, 0, 0, 0.06);border-radius: 10px;padding: 20px;}
.branch-image{height: 250px;width: 100%;border-radius: 10px;border: 1px solid #fca12a;padding: 5px;}
.branch-image img{width: 100%;height: 100%;object-fit: cover;border-radius: 10px;transition: 1s ease-in-out}
.branch-name{font-size: 18px;font-weight: 600;color: #0B3130;line-height: 25px;margin-bottom: 10px;padding-bottom: 10px;border-bottom: 1px solid #0B3130;}
.branch-info{margin-top: 10px}
.branch-item{display: flex;align-items: stretch;}
.branch-item-br{border-bottom: 1px solid #ededed;padding-bottom: 10px;margin-bottom: 10px;}
.branch-item-icon{width: 30px;min-width: 30px;height: 30px;background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);border-radius: 8px;display: flex;justify-content: center;align-items: center;margin-right: 10px;font-size: 14px;color: #fff;}
.branch-item-txt{font-size: 16px;line-height: 25px;color: #0B3130;font-weight: 500;}
.branch-item-txt p{font-size: 16px;line-height: 25px;color: #0B3130;font-weight: 500;}
.branch-box:hover .branch-image img{transform: scale(1.1);transition: 1s ease-in-out}
.timeline-back{padding: 40px 0;background-color: #f5f5f5}
/* ---------- TIMELINE WRAPPER ---------- */
.timeline {
position: relative;
}
.timeline::after {
content: '';
position: absolute;
width: 3px;
background: #f06723;
top: 0;
bottom: 0;
left: 50%;
transform: translateX(-50%);
opacity: 0.2;
}
.timeline-item {
position: relative;
width: 50%;
padding: 20px 40px;
opacity: 0;
transform: translateY(40px);
transition: all 0.8s ease-out;
}
.timeline-item.visible {
opacity: 1;
transform: translateY(0);
}
.timeline-item:nth-child(odd) {
left: 0;
text-align: right;
}
.timeline-item:nth-child(even) {
left: 50%;
text-align: left;
}
.timeline-item::before {
content: '';
position: absolute;
top: 30px;
width: 16px;
height: 16px;
background: #f06723;
border-radius: 50%;
border: 3px solid #fff;
box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.2);
z-index: 1;
animation: pulse 1.8s infinite ease-in-out,
rotate 3s infinite linear,
flash 2.5s infinite ease-in-out;
}
.timeline-item:nth-child(odd)::before {
right: -8px;
}
.timeline-item:nth-child(even)::before {
left: -8px;
}
@keyframes pulse {
0% {
transform: scale(1);
box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.2);
}
50% {
transform: scale(1.4);
box-shadow: 0 0 0 8px rgba(79, 70, 229, 0.1);
}
100% {
transform: scale(1);
box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.2);
}
}
@keyframes rotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes flash {
0%, 100% {
background: #f06723;
}
50% {
background: #ca551a;
}
}
.timeline-content {
background: #ffffff;
padding: 20px;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,0.05);
position: relative;
max-width: 90%;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.timeline-content:hover {
transform: translateY(-3px);
box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}
.timeline-content h3 {
margin-bottom: 12px;
font-size: 1.3rem;
font-weight: 600;
color: #111827;
}
.year-label {
position: absolute;
top: -20px;
background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);
color: white;
padding: 4px 12px;
border-radius: 10px;
font-size: 16px;
font-weight: 500;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
.timeline-item:nth-child(odd) .year-label {
right: 25px;
}
.timeline-item:nth-child(even) .year-label {
left: 25px;
}
.task-list {
list-style: none;
margin-top: 10px;
}
.task-list li {
display: flex;
align-items: baseline;
margin-bottom: 10px;
padding: 8px 12px;
border-radius: 8px;
background: #f3f4f6;
transition: background 0.3s ease;
}
.task-list li:hover {
background: #e0e7ff;
}
/* Check icon */
.check-icon {
width: 20px;
height: 20px;
background: #f06723;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 14px;
margin-right: 10px;
flex-shrink: 0;
}
.task-text {
font-size: 14px;
color: #374151;
line-height: 24px;
text-align: start;
}
@media screen and (max-width: 900px) {
.timeline::after {
left: 25px;
}
.timeline-item {
width: 100%;
padding-left: 60px;
padding-right: 25px;
text-align: left !important;
}
.timeline-item::before {
left: 18px !important;
}
.year-label {
left: 60px !important;
}
.timeline-item:nth-child(even){left: 0}
}
/* request for*/
.loan-request-body{background: #fff;padding: 20px;border-radius: 10px;}
.loan-request-head{font-size: 16px;line-height: 25px;font-weight: 600;color: #343434;text-align: center;margin-bottom: 10px;border-bottom: 1px solid #ededed;padding-bottom: 10px;}
.control-label{font-size: 16px;color: #000;line-height: 20px;}
.request-bottom-info{margin: 0}
.request-bottom-item{display: flex;align-items: baseline;margin-bottom: 10px}
.request-bottom-item-icon{margin-right: 10px;width: 20px;height: 20px;border-radius: 50%;background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);display: flex;justify-content: center;align-items: center;color: #fff;}
.request-bottom-item-name{font-size: 16px;line-height: 25px;font-weight: 500;color: #000}
.form-group select {border: 1px solid #e3e3e3;box-shadow: inset 4px 4px 4px rgba(0, 0, 0, 0.05);max-height: 50px;}
.form-group input {border: 1px solid #e3e3e3;box-shadow: inset 4px 4px 4px rgba(0, 0, 0, 0.05);max-height: 50px;}
.check-terms{font-size: 15px;line-height: 20px;font-weight: 400;color: #000}
.loan-box button:disabled{opacity: .6;cursor: no-drop}
.form-field__image {position: absolute;border: 1px solid #cecece;left: 0;right: 0;bottom: 0;top: 0;background-position: center center;background-repeat: no-repeat;background-size: cover;background-color: #efefef}
.form-field__image-remove {color: #ff0000;position: absolute;top: 4px;right: 4px;cursor: pointer;text-shadow: 0 0 5px rgba(0, 0, 0, .5);z-index: 10;}
.form-field__upload {position: relative;margin-right: 10px;margin-bottom: 10px;width: 100%;height: 0;padding-bottom: 41.2%;overflow: hidden;text-align: center;border: 1px dashed #cecece;background-position: center center;background-repeat: no-repeat;background-size: cover;display: flex;justify-content: center;align-items: center;flex-direction: column;box-shadow: inset 4px 4px 4px rgba(0, 0, 0, 0.05)}
.form-field__upload-icon {margin-bottom: 12px;font-size: 24px;color: #999}
.form-field__upload-label {font-size: 14px;color: #999}
.form-field__upload-file {position: absolute !important;top: 0 !important;left: 0 !important;width: 100% !important;height: 100% !important;min-height: 100%;cursor: pointer;opacity: 0}
.form-field__upload-item{position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; flex-direction: column;}
/*mobile sticky menu for */
.share-mobile{display: none}
.share-mobile {max-width: 55px;width: 100%;overflow: hidden;position: fixed;bottom: 20%;right: 15px;background: rgb(240 103 35 / 21%);border-radius: 10px;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);transition: height 0.4s ease;height: 55px;z-index: 100;}
.share__header {padding: 12px;display: flex;justify-content: space-between;align-items: center;}
.plus {background: #f06723;display: inline-block;border-radius: 50%;width: 28px;height: 28px;cursor: pointer;position: relative;transition: transform 0.4s cubic-bezier(0.87, -0.41, 0.19, 1.44);}
.v-cross, .h-cross {position: absolute;background: #fff;left: 50%;top: 50%;transform: translate(-50%, -50%);transition: 0.3s;}
.v-cross {width: 2px;height: 14px;}
.h-cross {width: 14px;height: 2px;}
.plus.rotate {transform: rotate(45deg);}
.share__content {padding: 0 10px 10px;transition: all 0.3s ease;}
.sticky-item {display: flex;align-items: center;opacity: 0;width: 35px;height: 35px;transform: translateX(-150%);transition: all 0.4s ease;margin-bottom: 10px;border-radius: 50%;justify-content: center;background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%);}
.sticky-item i{font-size: 20px;color: #fff;line-height: 35px;}
.sticky-item.reveal {opacity: 1;transform: translateX(0);}
/* for tel-num*/
.tell-num {position: fixed; z-index: 100;overflow: hidden; right: 75px; bottom: 15px; height: 50px; min-width: 50px; display: flex; align-items: center; background: linear-gradient(to left, var(--theme-color1) 0%, var(--theme-color7) 50%, var(--theme-color1) 100%); box-shadow: 0 3px 4px rgba(0, 0, 0, 0.25); border-radius: 10px;}
.tel-box{display: flex;align-items: center}
.phone-icon {margin: 10px; border-radius: 50%; background-color: #ffffff}
.phone-icon i {font-size: 18px; margin: 8px; color: #f06723}
.phone-num a{visibility: visible;margin: 0 15px 0 5px;line-height: 50px;transition: 0.5s;font-size: 18px;font-weight: bold;color: #ffffff;}
.phone-num:hover {color: #fff}
/* end of tel-num*/
@media (max-width: 900px){
.hero-5 .banner-outer .hero-content .banner-title{width: 100%}
.swiper-dot-main .dot2 {position: absolute;bottom: 15px;left: 30px;}
.news-box-items{margin-bottom: 15px}
.home-sidebar-article__stories{height: 250px;touch-action: none}
.benifit-box-items-style-2 .nav{padding: 8px;justify-content: space-between}
.share-mobile{display: block}
.sticky-social{display: none}
.sub-title{font-size: 16px;}
.contact-box-style-3{padding: 20px}
.tell-num{display: none}
.benifit-box-items-style-2 .why-choose-list p{text-align: left}
.footer-widget-wrapper .footer-widget-items .footer-content p {color: #fff;max-width: 100%;font-size: 18px;}
.request-section .nav .nav-link{padding: 13px 30px;}
.footer-link{text-align: left}
.footer-link a{font-size: 13px}
}