:root {
--font: "Teko", sans-serif;
--font2: "Roboto", sans-serif;
--liner: linear-gradient(180deg,
rgba(255, 255, 255, 0.15),
rgba(255, 255, 255, 0));
--pri: #2A4DBB;
--sec: #6B8FD8;
--text-color: #222;
--text-light: #8c8c8c;
--para-color: #444;
--border-color: rgba(0, 0, 0, 0.1);
--white: #fff;
--off-white: #f9f9f9;
--black: #111;
}
body {
background: var(--white);
font-family: var(--font2);
color: var(--para-color);
font-size: 15px;
margin: 0;
padding: 0;
font-weight: 400;
line-height: 1.3;
min-height: 100vh;
overflow-x: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font);
}
img {
max-width: 100%;
width: auto;
height: auto;
}
p {
color: #444;
font-size: 15px;
font-weight: 400;
margin-bottom: 10px;
font-family: var(--font2);
line-height: 1.6;
}
a {
display: block;
text-decoration: none;
}
p a {
display: inline;
}
.head-sec2 {
text-align: center;
position: relative;
z-index: 1;
}
.head-sec2 .sub-tt {
font-size: 15px;
font-style: italic;
color: var(--pri);
font-weight: 500;
}
.head-sec2 .tt {
color: var(--text-color);
font-weight: 600;
font-size: 25px;
text-transform: capitalize;
display: inline-block;
background-color: var(--white);
padding-inline: 20px;
}
.head-sec2 .tt::before {
content: "";
position: absolute;
left: 0;
top: 42px;
width: 100%;
height: 1px;
background-color: var(--border-color);
z-index: -1;
}
.head-sec {
text-align: center;
max-width: 950px;
margin: 0 auto 35px;
}
.head-sec.text-start {
max-width: 100%;
}
.head-sec .sub-tt {
font-size: 14px;
font-weight: 600;
color: var(--pri);
align-content: center;
text-transform: uppercase;
margin-bottom: 5px;
}
.head-sec .sub-tt img {
width: 25px;
}
.head-sec .tt {
font-family: var(--font);
color: var(--text-color);
font-weight: 400;
font-size: 40px;
line-height: 1;
margin-bottom: 7px;
position: relative;
/* text-transform: capitalize; */
}
.head-sec .tt svg {
color: var(--para-color);
}
.head-sec .tt span {
color: var(--pri);
}
.head-sec p {
font-size: 15px;
color: var(--para-color);
font-weight: 400;
margin-bottom: 0;
}
.head-sec.text-white .tt,
.head-sec.text-white .sub-tt,
.head-sec.text-white p {
color: white;
}
.w-btn {
padding: 11px 15px;
border-radius: 4px;
color: white;
border: 1px solid #00c966;
display: inline-flex;
gap: 5px;
align-items: center;
font-size: 15px;
font-weight: 500;
font-family: var(--font);
text-transform: capitalize;
white-space: nowrap;
background-color: #00c966;
outline: none;
transition: 0.2s ease-in-out;
line-height: 1;
}
.w-btn:hover {
border-color: #00c966;
background-color: #00b95d;
}
.main-btn {
padding: 15px 22px;
color: var(--white);
border: 1px solid var(--sec);
background-color: var(--sec);
display: inline-flex;
gap: 5px;
align-items: center;
justify-content: center;
font-size: 15px;
font-weight: 400;
font-family: var(--font2);
text-transform: capitalize;
white-space: nowrap;
outline: none;
transition: 0.2s ease-in-out;
justify-content: center;
border-radius: 0px;
/* line-height: 1; */
}
.main-btn.sm {
padding: 10px 13px;
font-size: 14px;
font-weight: 400;
}
.main-btn:hover {
background: var(--pri);
color: var(--white);
border-color: var(--pri);
}
.main-btn2 {
color: var(--white);
background-color: var(--pri);
border-color: var(--pri);
}
.main-btn2:hover {
background-color: var(--white);
border-color: var(--pri);
color: var(--pri);
}
.social {
display: flex;
justify-content: end;
list-style: none;
gap: 20px;
margin-bottom: 0;
padding: 0;
}
.social li a {
color: var(--white);
background-color: var(--sec);
}
.social li a svg {
width: 16px;
height: 16px;
}
.social li a:hover {
color: var(--pri);
}
.form-label {
font-size: 15px;
color: var(--text-color);
font-family: var(--font);
font-weight: 500;
margin-bottom: 4px;
}
.SumoSelect>.CaptionCont>span.placeholder {
background-color: transparent;
color: var(--text-color);
opacity: 0.8;
font-style: normal;
}
.SumoSelect {
display: block;
width: 100%;
}
.SumoSelect.open .search-txt {
font-weight: 500;
border-radius: 4px;
font-size: 15px;
padding: 8px 12px;
color: var(--text-color);
font-family: var(--font);
border-color: var(--border-color);
height: 43px;
}
.SumoSelect.open>.CaptionCont,
.SumoSelect:focus>.CaptionCont,
.SumoSelect:hover>.CaptionCont {
box-shadow: none;
border-color: var(--text-light);
}
.SumoSelect.open>.optWrapper {
top: 43px;
}
.form-group {
position: relative;
margin-bottom: 13px;
}
.form-control,
.form-select,
.SumoSelect>.CaptionCont {
font-weight: 400;
border-radius: 0px;
font-size: 15px;
padding: 8px 12px;
color: var(--text-color);
font-family: var(--font2);
border-color: #e3e3e3;
height: 40px;
align-content: center;
}
textarea.form-control {
min-height: 100px;
resize: none;
align-content: start;
}
.form-control:focus,
.form-select:focus {
border-color: var(--text-light);
box-shadow: none;
}
header {
position: relative;
z-index: 999;
}
header.stricky-fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
background: #fff;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
animation-name: fadeInDown;
animation-duration: 0.6s;
animation-fill-mode: both;
}
.logo img {
max-width: 205px;
width: auto;
height: auto;
}
.menubar {
position: relative;
background-color: var(--sec);
z-index: 1;
}
.menubar.stricky-fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
/* background: ; */
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
animation-name: fadeInDown;
animation-duration: 600ms;
animation-fill-mode: both;
}
@keyframes fadeInDown {
from {
opacity: 0;
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
transform: none;
}
}
.top-bar {
background-color: var(--white);
padding-block: 8px;
position: relative;
z-index: 1;
}
.call-now {
display: flex;
border-right: 1px solid var(--border-color);
padding-right: 25px;
margin-right: 25px;
align-items: center;
}
.top-bar .call-now:last-child {
border-right: 0;
padding-right: 0;
margin-right: 0;
}
.call-now .icon-bx {
margin-right: 14px;
color: var(--para-color);
}
.call-now .con-bx {
text-align: left;
}
.call-now .con-bx span {
font-size: 13px;
font-weight: 400;
line-height: 22px;
color: var(--para-color);
}
.call-now .con-bx span a,
.call-now .con-bx span p {
font-size: 15px;
font-weight: 600;
color: var(--text-color);
font-family: var(--font2);
margin-bottom: 0;
}
.call-now .con-bx span a:hover {
color: var(--pri);
opacity: 1;
}
.search-bx {
display: flex;
align-items: center;
}
.search-bx input {
background-color: transparent;
border: 0;
outline: 0;
color: white;
height: 50px;
}
.search-bx input::placeholder {
color: white;
opacity: 0.5;
}
.search-bx button {
background-color: transparent;
border: 0;
outline: 0;
color: white;
padding: 5px 8px;
}
.search-bx button:hover {
color: var(--pri);
}
.navigation .nav-header {
display: none;
padding: 12px 20px;
}
.navigation .navbar button {
width: 40px;
height: 40px;
background: var(--pri);
border: 0;
outline: 0;
color: #fff;
font-size: 25px;
border-radius: 0;
display: inline-block;
text-align: center;
line-height: 40px;
position: relative;
z-index: 99;
padding: 5px;
position: relative;
transform: rotate(0deg);
transition: 0.5s ease-in-out;
cursor: pointer;
}
.navigation .navbar button span {
display: block;
position: absolute;
height: 3px;
width: 70%;
background: #fff;
border-radius: 9px;
opacity: 1;
left: 15%;
transform: rotate(0deg);
transition: 0.25s ease-in-out;
}
.navigation .navbar button span:nth-child(1) {
top: 8px;
}
.navigation .navbar button span:nth-child(2),
.navigation .navbar button span:nth-child(3) {
top: 18px;
}
.navigation .navbar button span:nth-child(4) {
top: 28px;
}
.navigation .navbar button.open span:nth-child(1) {
top: 18px;
width: 0%;
left: 50%;
}
.navigation .navbar button.open span:nth-child(2) {
transform: rotate(45deg);
}
.navigation .navbar button.open span:nth-child(3) {
transform: rotate(-45deg);
}
.navigation .navbar button.open span:nth-child(4) {
top: 18px;
width: 0%;
left: 50%;
}
.navigation .menu {
display: block;
}
.navigation .menu ul {
width: 100%;
margin: 0;
padding: 0;
display: block;
}
.navigation .menu ul li {
display: inline-block;
position: relative;
}
.navigation .menu ul li a {
padding: 14px 15px;
display: block;
color: var(--white);
transition: all 0.3s ease;
font-size: 15px;
font-family: var(--font2);
background: transparent;
font-weight: 500;
/* text-transform: uppercase; */
}
.navigation .menu ul li.active a,
.navigation .menu ul li:hover a {
color: var(--pri);
background: transparent;
}
.navigation .menu ul li ul.ls-dropdown {
top: 100%;
left: 0;
text-align: left;
}
.navigation .menu ul li ul.ls-dropdown li:last-child {
border: 0;
}
.navigation .menu ul li ul.ls-dropdown li ul.ls-dropdown {
left: 100%;
margin-top: -36px;
}
.navigation .menu ul li ul.ls-dropdown li ul.ls-dropdown li ul.ls-dropdown {
left: -100%;
margin-top: -31px;
}
.navigation .menu ul li ul.ls-dropdown {
position: absolute;
width: 285px;
display: none;
z-index: 99999;
box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.4);
background: #fff;
margin: 0;
padding: 0;
transition: all 0.3s ease;
}
.navigation .menu ul li:hover ul.ls-dropdown {
display: block;
}
.navigation .menu ul li:hover ul.ls-dropdown li ul.ls-dropdown {
display: none;
transition: all 0.3s ease;
width: max-content;
min-width: 190px;
}
.navigation .menu ul li ul.ls-dropdown li:hover ul.ls-dropdown {
display: block;
}
.navigation .menu ul li ul.ls-dropdown li {
display: block;
padding: 0;
width: 100%;
}
.navigation .menu ul li ul.ls-dropdown li:last-child a:after {
display: none;
}
.navigation .menu ul li ul.ls-dropdown li a:hover {
color: white;
background-color: var(--pri);
}
.navigation .menu ul li ul.ls-dropdown li:hover a {
color: white;
background-color: var(--pri);
}
.navigation .menu ul li ul.ls-dropdown li:hover ul.ls-dropdown li a {
background: #fff;
color: #333;
}
.navigation .menu ul li ul.ls-dropdown li:hover ul.ls-dropdown li a:hover {
color: #fff;
background: var(--pri);
}
.navigation .menu ul li ul.ls-dropdown li a {
color: var(--text-color);
font-size: 14px;
padding: 8px 15px;
position: relative;
display: block;
text-transform: capitalize;
transition: all 0.2s;
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
font-weight: 400;
}
.navigation ul li.ls-submenu a button {
border: 0;
background: transparent;
outline: 0;
padding: 0;
margin: 0 0 0 3px;
color: var(--white);
}
.navigation ul li.ls-submenu a button svg {
width: 14px;
height: 14px;
}
.navigation ul li.ls-submenu:hover svg {
transform: rotateZ(180deg);
color: var(--pri);
}
.navigation ul li.ls-submenu:hover ul.ls-dropdown li.ls-submenu svg {
color: #242424;
}
.navigation ul li.ls-submenu ul.ls-dropdown li a button {
float: right;
color: #333;
}
.navigation ul li.ls-submenu ul.ls-dropdown li a button svg {
transform: rotateZ(-90deg);
}
.navigation ul li.ls-submenu ul.ls-dropdown li.ls-submenu:hover svg {
color: #fff;
}
.navigation .navbar {
display: none;
padding: 12px 0;
margin: 0;
}
.navigation .menu ul>li:hover>ul.ls-dropdown {
visibility: visible;
opacity: 1;
}
.navigation .menu ul>li>ul.ls-dropdown>li>ul.ls-dropdown {
left: 100%;
margin-top: -36px;
}
.navigation .menu ul>li>ul.ls-dropdown>li>ul.ls-dropdown>li>ul.ls-dropdown {
left: -100%;
margin-top: -31px;
}
.navigation .menu ul>li>ul.ls-dropdown>li:hover>ul.ls-dropdown {
visibility: visible;
opacity: 1;
}
.navigation .menu ul>li ul.ls-dropdown {
position: absolute;
min-width: 190px;
width: max-content;
max-width: 390px;
opacity: 0;
visibility: hidden;
z-index: 99999;
transition: all 0.3s ease;
box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2);
background: #fff;
margin: 0;
padding: 0;
text-align: left;
}
.navigation .menu ul>li ul.ls-dropdown li {
display: block;
padding: 0;
width: 100%;
}
/* ################### main ###################### */
main {
overflow: hidden;
display: block;
width: 100%;
position: relative;
}
.carousel-control-next,
.carousel-control-prev {
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 38px;
height: 38px;
padding: 0;
transform: translate(0, -50%);
cursor: pointer;
color: #fff;
border: 0;
outline: 0;
background-color: rgba(0, 0, 0, 0.2);
backdrop-filter: blur(2px);
border-radius: 100%;
z-index: 9;
opacity: 1;
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
height: 16px;
width: 16px;
}
.carousel-control-next:hover,
.carousel-control-prev:hover {
background-color: var(--pri);
opacity: 1;
}
.carousel-control-prev {
left: 30px;
}
.carousel-control-next {
right: 30px;
}
@media (max-width: 980px) {
.carousel-control-next,
.carousel-control-prev {
width: 20px;
height: 35px;
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
height: 15px;
width: 15px;
}
.carousel-control-prev {
left: 0px;
border-radius: 0 3px 3px 0;
}
.carousel-control-next {
right: 0px;
border-radius: 3px 0px 0px 3px;
}
}
.swiper_wrap {
position: relative;
}
.cate-next,
.cate-prev {
width: 45px;
height: 45px;
background-color: #fdfff8;
border: 1px solid var(--border-color);
border-radius: 100%;
color: var(--para-color);
align-content: center;
text-align: center;
position: absolute;
top: 0;
right: 0;
}
.cate-prev {
right: 50px;
}
.cate-next svg,
.cate-prev svg {
width: 25px;
height: 25px;
}
.cate-next:hover,
.cate-prev:hover {
background-color: var(--pri);
color: var(--white);
}
.web-lead-sec {
padding: 60px 0;
overflow: hidden;
position: relative;
z-index: 1;
}
.bg-sec {
background: linear-gradient(90deg,
rgba(255, 255, 255, 0.95) 0%,
rgba(255, 255, 255, 0.95) 100%) !important;
background-color: var(--pri) !important;
}
.bg-pri {
background-color: var(--pri);
align-content: center;
}
.bg-pri.content-sec h1,
.bg-pri.content-sec h2,
.bg-pri.content-sec h3,
.bg-pri.content-sec h4,
.bg-pri.content-sec p,
.bg-pri.content-sec ul li {
color: white;
}
.bg-pri.content-sec p,
.bg-pri.content-sec ul li {
opacity: 0.8;
}
.bg-light {
background-color: #f9f9f9 !important;
}
.text-sec {
color: var(--sec) !important;
}
.feature-container {
display: flex;
box-shadow: 0 3px 63px 0 rgba(40, 40, 40, 0.11);
background-color: #fff;
margin-top: -100px;
position: relative;
z-index: 1;
border-radius: 10px;
}
.feature-container .feature-bx {
padding: 35px 25px;
}
.feature-container .feature-bx:first-child {
border-right: 2px solid var(--border-color);
}
.feature-container .feature-bx .tt {
font-family: var(--font);
margin-bottom: 10px;
font-size: 25px;
color: var(--text-color);
}
.feature-container .feature-bx p {
margin-bottom: 0;
}
.h-cate-bx {
text-align: center;
}
.h-cate-bx .img {
overflow: hidden;
aspect-ratio: 1 / 1;
}
.h-cate-bx .img img {
aspect-ratio: 1 / 1;
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
transition: 0.2s ease-in-out;
}
.h-cate-bx .img:hover img {
transform: scale(1.05);
}
.h-cate-bx .tt a {
margin-top: 18px;
font-family: var(--font);
font-size: 22px;
color: var(--text-color);
}
.h-cate-bx:hover .tt a {
color: var(--pri);
}
.imgCate-bx {
position: relative;
overflow: hidden;
}
.imgCate-bx img {
width: 100%;
height: 100%;
object-fit: cover;
aspect-ratio: 111 / 46;
object-position: right;
}
.imgCate-bx .tx-bx {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 50px;
}
.imgCate-bx .tx-bx .sub-tt {
font-size: 16px;
font-weight: 400;
color: var(--text-color);
margin-bottom: 3px;
}
.imgCate-bx .tx-bx .tt {
font-family: var(--font);
color: var(--text-color);
font-size: 35px;
margin-bottom: 12px;
}
.imgCate-bx:before {
background: rgba(255, 255, 255, 0.41);
content: "";
height: 0;
left: 0;
margin: auto;
opacity: 1;
position: absolute;
top: 0;
width: 0;
pointer-events: none;
z-index: 1;
}
.imgCate-bx:after {
background: rgba(255, 255, 255, 0.41);
bottom: 0;
content: "";
height: 0;
opacity: 1;
position: absolute;
right: 0;
width: 0;
pointer-events: none;
z-index: 1;
}
.imgCate-bx:hover:before {
height: 100%;
opacity: 0;
-webkit-transition-duration: 1.3s;
-o-transition-duration: 1.3s;
transition-duration: 1.3s;
width: 100%;
}
.imgCate-bx:hover:after {
height: 100%;
opacity: 0;
-webkit-transition-duration: 1.3s;
-o-transition-duration: 1.3s;
transition-duration: 1.3s;
width: 100%;
}
.vid-bx {
position: relative;
}
.vid-bx .vid-btn {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 50px;
height: 50px;
text-align: center;
align-content: center;
border-radius: 100%;
background-color: var(--white);
color: var(--pri);
}
.counter-bx .img img {
margin-bottom: 15px;
width: 70px;
}
.counter-bx .title {
font-family: var(--font);
color: white;
font-weight: 600;
font-size: 30px;
line-height: 1.3;
margin-bottom: 15px;
}
.counter-bx .sub-tt {
opacity: 0.8;
display: inline;
}
.counter-bx p {
color: #fff;
opacity: 0.8;
font-weight: 400;
}
.read-mr {
font-size: 15px;
color: var(--pri);
font-weight: 400;
transition: 0.2s;
display: inline-block;
padding: 0;
background-color: transparent;
border: 0;
}
.read-mr.text-decoration:hover {
text-decoration: underline;
}
.read-mr:hover {
color: var(--sec);
}
.read-mr:hover svg {
transition: 0.2s;
transform: translateX(2px);
}
.pr_slider .swiper-slide,
.faq_slider .swiper-slide {
width: auto;
}
.filter-button-grp {
position: relative;
padding-inline: 40px;
}
.filter-button-grp .swiper-button-next,
.filter-button-grp .swiper-button-prev,
.faq-sec .swiper-button-next,
.faq-sec .swiper-button-prev {
background: var(--sec);
color: var(--white);
width: 28px;
height: 28px;
border-radius: 0;
text-align: center;
}
.faq-sec .swiper-button-next,
.faq-sec .swiper-button-prev {
background: var(--pri);
}
.faq-sec .swiper-button-next,
.faq-sec .swiper-button-prev {
top: 68%;
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-size: 10px;
}
.filter-button-grp .swiper-button-next,
.faq-sec .swiper-button-next {
right: 0;
}
.filter-button-grp .swiper-button-prev,
.faq-sec .swiper-button-prev {
left: 0;
}
/* .swiper-button-disabled{
display: none;
} */
.filter-pro-button {
border: 0;
width: auto;
text-align: left;
border-radius: 0;
color: var(--text-color);
font-size: 14px;
padding: 10px 15px;
position: relative;
background-color: var(--white);
margin-bottom: 15px;
align-content: center;
display: block;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}
.filter-pro-button:hover {
color: var(--sec);
}
.filter-pro-button.active {
background-color: var(--pri);
color: var(--white);
}
.filter-pro-button img {
width: 22px;
margin-right: 2px;
}
.filter-pro-button.active img {
filter: brightness(0) invert(1);
}
.cate-bx {
background-color: white;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
border-bottom: 2px solid var(--para-color);
}
.cate-bx .img {
aspect-ratio: 1 / 1;
overflow: hidden;
position: relative;
margin-bottom: 10px;
}
.cate-bx .img::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: black;
opacity: 0;
z-index: 1;
transition: 1s cubic-bezier(0.22, 1, 0.36, 1);
}
.cate-bx .img:hover::before {
opacity: 0.3;
}
.cate-bx .img img {
transition: 1s cubic-bezier(0.22, 1, 0.36, 1);
aspect-ratio: 1 / 1;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}
.cate-bx .img:hover img {
transform: scale(1.1);
}
.cate-bx .tx-bx {
padding: 20px;
}
.cate-bx .tx-bx .tt {
font-size: 24px;
margin-bottom: 0px;
font-weight: 400;
font-family: var(--font2);
}
.cate-bx .tx-bx .tt a {
color: var(--text-color);
font-family: var(--font);
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: normal;
-webkit-line-clamp: 2;
overflow: hidden;
}
.cate-bx .tx-bx .tt:hover a {
color: var(--pri);
}
.cate-bx .tx-bx p {
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: normal;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 15px;
margin-bottom: 15px;
}
.pro-bx {
position: relative;
overflow: hidden;
aspect-ratio: 1 / 1;
}
.pro-bx img {
display: block;
width: 100%;
height: auto;
-webkit-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
.pro-bx .proHover {
visibility: hidden;
opacity: 0;
position: absolute;
left: 0px;
bottom: 30px;
z-index: 3;
transition: all ease 600ms;
-moz-transition: all ease 600ms;
-webkit-transition: all ease 600ms;
-o-transition: all ease 600ms;
color: white;
}
.pro-bx:hover .proHover {
visibility: visible;
opacity: 1;
left: 30px;
}
.pro-bx .proHover p {
font-size: 15px;
margin-bottom: 0;
color: white;
opacity: 0.8;
}
.pro-bx .proHover .tt {
font-family: var(--font);
font-size: 20px;
color: white;
font-weight: 600;
}
.pro-bx:after {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: var(--pri);
opacity: 0.8;
overflow: hidden;
width: 0;
height: 100%;
content: "";
transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
}
.pro-bx:hover:after {
width: 100%;
}
.pro-bx img {
aspect-ratio: 1 / 1;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.pro-bx:hover img {
transform: scale(1.1) rotate(2deg);
-moz-transform: scale(1.1) rotate(2deg);
-webkit-transform: scale(1.1) rotate(2deg);
-ms-transform: scale(1.1) rotate(2deg);
-o-transform: scale(1.1) rotate(2deg);
-webkit-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
.map-wrapper {
height: 400px;
width: 100%;
position: relative;
}
#indiaMap {
width: 100%;
height: 100%;
border-radius: 12px;
overflow: hidden;
}
.blinking-marker {
width: 14px;
height: 14px;
border-radius: 50%;
background: var(--pri);
border: 2px solid white;
animation: blink 1.4s infinite;
box-shadow: 0 0 10px var(--pri);
}
.leaflet-bottom.leaflet-right {
display: none;
}
@keyframes blink {
0% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(1.6);
opacity: 0.3;
}
100% {
transform: scale(1);
opacity: 1;
}
}
.map-wrapper img {
display: block;
width: 100%;
}
.map-wrapper .tag {
position: absolute;
background-color: #ffffff;
color: var(--pri);
font-size: 13px;
border-radius: 4px;
padding: 5px 7px;
line-height: 1;
font-weight: 600;
transition: all 0.1s linear;
border: 1px solid var(--pri);
/* pointer-events: none; */
z-index: 1;
}
.map-wrapper .tag:hover {
z-index: 2;
animation: pulse 1s ease-in-out;
}
.map-wrapper .tag.anim-main {
animation: pulse 1s ease-in-out infinite;
}
.map-wrapper .tag::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: white transparent transparent transparent;
}
.map-wrapper .tag::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -3px;
margin-top: 6px;
border-width: 3px;
border-style: solid;
border-color: white;
border-radius: 100%;
}
.home-content .content-sec .cmTitle,
.home-content .content-sec h1,
.home-content .content-sec h2,
.home-content .content-sec h3,
.home-content .content-sec h4,
.home-content .content-sec h5 {
color: var(--pri);
}
.home-content .content-sec li,
.home-content .content-sec p {
color: white;
opacity: 0.8;
}
.home-content .content-sec .scroll-bx {
max-height: 400px;
overflow-y: auto;
padding-right: 10px;
}
.home-content .content-sec .scroll-bx::-webkit-scrollbar {
background-color: transparent;
width: 0px;
}
.home-content .content-sec .scroll-bx:hover::-webkit-scrollbar {
width: 5px;
}
.home-content .content-sec .scroll-bx:hover::-webkit-scrollbar-thumb {
background-color: rgba(148, 148, 148, 0.8);
border-radius: 5px;
}
@media (hover: none) {
.home-content .content-sec .scroll-bx::-webkit-scrollbar {
width: 5px;
}
.home-content .content-sec .scroll-bx::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2);
}
}
.blog-bx .img-bx {
aspect-ratio: 16 / 9;
overflow: hidden;
}
.blog-bx .img-bx img {
aspect-ratio: 16 / 9;
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
transition: transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}
.blog-bx .img-bx:hover img {
transform: scale(1.03);
}
.blog-sec .main-tt {
padding-left: 13px;
padding-block: 3px;
font-weight: 500;
border-left: 5px solid var(--pri);
font-size: 30px;
color: var(--text-color);
margin-bottom: 20px;
}
.blog-sec .img-bx {
margin: 20px auto;
text-align: center;
max-width: 700px;
}
.blog-sec .img-bx img {
width: 100%;
height: 100%;
max-height: 500px;
aspect-ratio: 16 / 9;
object-fit: cover;
object-position: center;
}
.blog-date {
padding-left: 0;
list-style: none;
display: flex;
align-items: center;
gap: 30px;
font-size: 14px;
margin-block: 25px 10px;
}
.blog-date li {
position: relative;
color: var(--sec);
}
.blog-bx .tx-bx .tt a,
.blog-bx .tx-bx a.tt {
color: var(--text-color);
font-family: var(--font);
font-weight: 400;
font-size: 27px;
line-height: 1.3;
margin-bottom: 5px;
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: normal;
-webkit-line-clamp: 2;
overflow: hidden;
}
.blog-bx .tx-bx .tt a:hover,
.blog-bx .tx-bx a.tt:hover {
color: var(--pri);
}
.blog-bx .tx-bx p {
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
white-space: normal;
-webkit-line-clamp: 3;
overflow: hidden;
margin-bottom: 20px;
}
.blog-bx.blog-card {
display: flex;
border: 1px solid var(--border-color);
background-color: var(--off-white);
}
.blog-bx.blog-card .img-bx {
min-width: 120px;
width: 120px;
}
.blog-bx.blog-card .tt a {
font-size: 24px;
margin-bottom: 10px;
}
.cta-sec {
background: url(../images/banner/category-banner.jpg);
background-position: right;
background-size: cover;
position: relative;
z-index: 1;
overflow: hidden;
}
.cta-sec::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--sec);
z-index: -1;
opacity: 0.5;
}
.cta-content {
display: flex;
gap: 10px;
align-items: center;
padding: 60px 0;
}
.cta-content::before {
position: absolute;
width: calc(100% / 12 * 8 + 50px);
height: 100%;
content: "";
background: var(--pri);
right: -48px;
top: 0;
transform: skew(-24deg, 0deg);
z-index: -1;
}
.cta-content .main-btn:hover {
background-color: white;
color: var(--pri);
border-color: var(--pri);
}
.contact-container {
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
border-radius: 3px;
overflow: hidden;
padding: 30px 25px;
}
.contact-bx .head-sec {
margin-bottom: 30px;
}
.contact-bx .head-sec .tt {
font-size: 28px;
line-height: 28px;
}
.contact-bx .head-sec .tt::before {
top: 40px;
}
.contact-bx .main-btn {
padding: 13px 15px;
font-size: 15px;
}
.contact-bx .con-bx {
display: flex;
align-items: center;
margin-bottom: 10px;
gap: 10px;
}
.contact-bx .con-bx .ic-bx {
min-width: 35px;
width: 35px;
height: 35px;
border-radius: 100%;
display: inline-flex;
align-items: center;
justify-content: center;
background-color: white;
box-shadow: 0 1px 1px 0px rgba(0, 0, 0, 0.05);
}
.contact-bx .con-bx .ic-bx svg {
min-width: 15px;
width: 15px;
height: 15px;
color: var(--pri);
}
.contact-bx .con-bx a,
.contact-bx .con-bx p {
font-family: var(--font2);
font-weight: 400;
font-size: 15px;
line-height: 24px;
color: var(--text-color);
margin-bottom: 0px;
}
.contact-bx .con-bx a {
font-weight: 500;
}
.contact-bx .con-bx a:hover {
color: var(--pri);
}
.map-bx {
width: 100%;
display: block;
}
.you_may {
font-family: var(--font);
font-weight: 400;
font-size: 35px;
color: var(--text-color);
text-transform: capitalize;
margin-bottom: 35px;
position: relative;
}
.you_may span {
color: var(--pri);
}
.you_may::before {
content: "";
position: absolute;
bottom: -8px;
left: 0px;
width: 45px;
height: 2px;
background: var(--pri);
}
.pr-li {
border: 1px solid var(--off-white);
transition: 0.2s;
background: white;
height: 100%;
border-radius: 4px;
overflow: hidden;
}
.pr-li:hover {
border: 1px solid var(--border-color);
}
.pr-li .img_bx {
padding: 0;
border-right: 1px solid var(--off-white);
height: 100%;
}
.pr-li:hover .img_bx {
border-color: var(--border-color);
}
.pr-li .img_bx img {
aspect-ratio: 1 / 1;
object-fit: contain;
object-position: center;
width: 100%;
}
.pr-li .g_100 .img_bx {
border: 0;
}
.pr-li .tx-bx {
padding: 15px 20px;
}
.grid.pr_view .pr-li .tx-bx {
padding-top: 0;
}
.pr-li .tx-bx .title {
color: var(--pri);
padding: 0;
text-align: left;
border-bottom: 1px solid var(--off-white);
font-weight: 700;
padding-bottom: 10px;
margin-bottom: 10px;
font-size: 20px;
}
.pr-li:hover .tx-bx .title {
border-color: var(--border-color);
}
.grid.pr_view .pr-li .tx-bx .title {
text-align: center;
border: none;
margin: 0;
}
.grid.pr_view .pr-li .tx-bx .bt_bx {
text-align: center;
}
.pr-li .tx-bx .title a {
font-size: 20px;
color: var(--black);
transition: 0.4s;
}
.pr-li:hover .tx-bx .title a {
color: var(--pri);
}
.pr-li .tx-bx .info {
max-height: 280px;
overflow-y: auto;
padding-right: 10px;
margin-bottom: 0px;
}
.pr-li .tx-bx .info table {
width: 100%;
overflow: hidden;
}
.pr-li .tx-bx .info table thead {
background-color: var(--pri);
color: white;
text-align: center;
}
.grid.pr_view .pr-li .tx-bx .info {
display: none;
}
.pr-li .tx-bx .info::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
background-color: #f5f5f5;
}
.pr-li .bt_bx {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 7px;
margin-top: 15px;
}
.pr-li .tx-bx .info::-webkit-scrollbar {
width: 7px;
background-color: #f5f5f5;
}
.pr-li .tx-bx .info::-webkit-scrollbar-thumb {
background-color: #c5c5c5;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
}
.multi-imgs {
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
margin-top: 10px;
margin-bottom: 10px;
}
.multi-imgs .imgs {
border: 1px solid #e3e3e3;
width: 55px;
height: 55px;
cursor: pointer;
overflow: hidden;
border-radius: 4px;
}
.multi-imgs .imgs.youTube a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background-color: #f70000;
}
.multi-imgs .imgs.youTube a svg {
width: 30px;
height: 30px;
color: white;
}
.multi-imgs .imgs.active {
border: 1px solid var(--pri);
}
.multi-imgs .imgs img {
object-fit: contain;
object-position: center;
}
.productBrochureandvideo a {
display: inline-flex;
justify-content: center;
align-items: center;
border: 1px dashed #cdcdcd;
padding: 5px 8px;
font-weight: 500;
transition: 0.3s;
font-size: 15px;
color: var(--text-color);
}
.productBrochureandvideo a svg {
color: #b90000;
width: 20px;
height: 20px;
margin-right: 5px;
}
.productBrochureandvideo a:hover {
color: #444;
border: 1px dashed #444;
}
.v-btn svg {
width: 42px;
}
tbody,
td,
tfoot,
th,
thead,
tr {
border-color: var(--off-white);
border-style: solid;
border-width: 1px;
padding: 5px 10px;
font-size: 15px;
}
.clientSlider .swiper-wrapper {
transition-timing-function: linear;
}
.clients-bx img {
aspect-ratio: 25 / 14;
object-fit: contain;
border-radius: 1px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
margin-block: 3px;
}
.enq-shape {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-image: url(../images/enq-shape.webp);
background-position: right;
background-size: contain;
background-repeat: no-repeat;
z-index: -1;
pointer-events: none;
}
.custom-from-row {
padding: 35px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
background-color: var(--white);
max-width: 600px;
}
.custom-from-row .form-control {
border-radius: 4px;
height: 45px;
font-size: 15px;
color: var(--black);
font-weight: 400;
box-shadow: none !important;
}
.custom-from-row textarea {
padding: 12px 15px;
}
.custom-from-row .iti--allow-dropdown .iti__flag-container,
.custom-from-row .iti--separate-dial-code .iti__flag-container {
height: 45px;
}
.custom-from-row .main-btn {
padding-block: 14px;
font-size: 15px;
}
.map-shape {
background-image: url(../images/map-shape.webp);
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-attachment: scroll;
background-position: top center;
background-repeat: no-repeat;
background-size: auto;
opacity: 0.05;
z-index: -1;
pointer-events: none;
}
.industries-bx .img {
overflow: hidden;
position: relative;
z-index: 1;
}
.industries-bx .img::before {
position: absolute;
top: 50%;
left: 50%;
display: block;
content: "";
width: 0;
height: 0;
background: rgba(255, 255, 255, 0.5);
border-radius: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
z-index: 10;
}
.industries-bx:hover .img::before {
-webkit-animation: circle 0.75s;
animation: circle 0.75s;
}
@-webkit-keyframes circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}
@keyframes circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}
.industries-bx .img img {
aspect-ratio: 1/ 1;
object-fit: cover;
object-position: center;
height: 100%;
width: 100%;
transition: all 700ms ease;
}
.industries-bx:hover .img img {
transform: scale(1.2);
}
.industries-bx .tx-bx {
box-shadow: 0px 0px 13.5px 1.5px rgba(0, 0, 0, 0.05);
display: flex;
position: relative;
top: -30px;
z-index: 1;
background-color: var(--white);
margin: 0 auto;
max-width: calc(100% - 40px);
}
.industries-bx .tx-bx .icon {
width: 70px;
min-width: 70px;
padding: 10px;
color: var(--white);
background-color: var(--pri);
align-content: center;
}
.industries-bx .tx-bx .tt {
padding: 10px 15px;
align-content: center;
font-size: 20px;
font-weight: 400;
color: var(--text-color);
font-family: var(--font);
transition: 0.5s ease;
}
.industries-bx:hover .tx-bx .tt {
color: var(--pri);
}
.breadcum-sec {
background: url(../images/banner/category-banner.jpg);
background-position: center;
padding: 60px 0;
background-size: cover;
position: relative;
z-index: 1;
font-family: var(--font);
}
.breadcum-sec.breadcum-sec2 {
background: #f1f1f1;
padding: 10px 0;
border-bottom: 1px solid var(--border-color);
}
.breadcum-sec::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(90deg,
rgb(18 18 18 / 55%) 20%,
rgba(255, 255, 255, 0) 100%);
z-index: -1;
transition: 0.3s ease-in-out;
}
.breadcum-sec.breadcum-sec2::before {
content: none;
}
.breadcum-sec .main-tt {
font-size: 35px;
color: white;
font-weight: 500;
margin-bottom: 5px;
}
.breadcum-sec .main-tt span {
color: var(--pri);
}
.breadcum-sec ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
gap: 4px 20px;
flex-wrap: wrap;
}
.breadcum-sec ul li {
color: white;
font-weight: 400;
font-size: 15px;
position: relative;
font-family: var(--font2);
}
.breadcum-sec.breadcum-sec2 ul li {
color: var(--pri);
font-size: 14px;
}
.breadcum-sec ul li::before {
content: url('data:image/svg+xml;charset=utf-8,');
position: absolute;
top: -3px;
right: -19px;
width: 20px;
height: 20px;
}
.breadcum-sec.breadcum-sec2 ul li::before {
content: url('data:image/svg+xml;charset=utf-8,');
}
.breadcum-sec ul li:last-child:before {
content: none;
}
.breadcum-sec ul li a {
color: #ffffffcc;
}
.breadcum-sec.breadcum-sec2 ul li a {
color: var(--text-color);
}
.breadcum-sec ul li a:hover {
color: var(--pri);
}
.breadcum-sec.breadcum-sec2 ul li a:hover {
color: var(--pri);
}
.abt-img-bx {
float: right;
max-width: 600px;
width: 100%;
margin-left: 30px;
margin-bottom: 30px;
border-radius: 4px;
overflow: hidden;
}
.abt-sec {
position: relative;
padding-left: 40px;
}
.abt-sec .img1 {
aspect-ratio: 1 / 1;
}
.abt-sec .img1 img {
width: 100%;
aspect-ratio: 1 / 1;
}
.experience-box {
position: absolute;
display: flex;
align-items: center;
bottom: 30px;
left: 10px;
background-color: var(--white);
border-bottom: 1px solid var(--sec);
box-shadow: 0px 0px 13.5px 1.5px rgba(0, 0, 0, 0.05);
padding: 25px 30px;
padding-right: 20px;
gap: 15px;
}
.experience-box .left .counting {
color: var(--pri);
font-size: 50px;
font-family: var(--font);
font-weight: 800;
line-height: 1;
margin-bottom: 5px;
}
.experience-box .left p {
color: var(--text-color);
margin-bottom: 0;
font-weight: 600;
}
.experience-box .right {
color: var(--pri);
opacity: 0.2;
}
.counter-bx .img img {
margin-bottom: 15px;
width: 70px;
}
.counter-bx .title {
font-family: var(--font);
color: white;
font-weight: 600;
font-size: 30px;
line-height: 1.2;
margin-bottom: 7px;
}
.counter-bx .sub-tt {
display: inline;
opacity: 0.8;
}
.counter-bx p {
color: #fff;
opacity: 0.8;
font-weight: 400;
font-size: 17px;
margin-bottom: 0;
}
.mis-vis-sec {
overflow: unset;
}
.mis-vis-bx {
background: linear-gradient(90deg,
rgba(255, 255, 255, 0.9) 0%,
rgba(255, 255, 255, 0.9) 100%);
background-color: var(--pri);
height: calc(100% - 75px);
position: relative;
z-index: 1;
padding: 30px;
text-align: center;
padding-top: 100px;
margin-top: 75px;
}
.mis-vis-bx::before,
.mis-vis-bx::after {
content: "";
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-attachment: scroll;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
transform: perspective(400px) scaleY(0);
transform-origin: bottom;
transform-style: preserve-3d;
transition: all 0.7s cubic-bezier(0.62, 0.21, 0.45, 1.52);
background-image: url(../images/banner/1.jpg);
z-index: -1;
}
.mis-vis-bx::after {
background: rgb(21 21 21 / 70%);
/* opacity: 0.5; */
}
.mis-vis-bx:hover:before,
.mis-vis-bx:hover::after {
transform: perspective(400px) scaleY(1);
}
.mis-vis-sec .col:nth-child(even) .mis-vis-bx {
background: linear-gradient(90deg,
rgba(255, 255, 255, 0.8) 0%,
rgba(255, 255, 255, 0.8) 100%);
background-color: var(--pri);
}
.mis-vis-bx .img {
background-color: white;
width: 150px;
height: 150px;
border-radius: 50%;
margin: 0 auto;
position: absolute;
top: -75px;
left: 50%;
transform: translateX(-50%);
padding: 20px;
align-content: center;
}
.mis-vis-bx .img::before {
content: "";
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
border-radius: 100%;
border: 3px solid #fde7dc;
}
.mis-vis-bx .img svg {
width: 80px;
height: 80px;
color: var(--sec);
}
.mis-vis-bx .tx-bx .tt {
color: var(--sec);
font-weight: 500;
font-family: var(--font);
font-size: 25px;
margin-bottom: 5px;
transition: all 0.2s cubic-bezier(0.62, 0.21, 0.45, 1.52);
text-transform: uppercase;
}
.mis-vis-bx .tx-bx p {
color: var(--para-color);
transition: all 0.2s cubic-bezier(0.62, 0.21, 0.45, 1.52);
font-size: 17px;
font-weight: 400;
}
.mis-vis-bx:hover .tx-bx .tt,
.mis-vis-bx:hover .tx-bx p {
color: white;
}
.factsheet-bx {
background-color: var(--off-white);
border: 1px dashed var(--pri);
border-radius: 14px;
display: flex;
padding: 13px;
height: 100%;
align-items: center;
transition: 0.2s ease-in-out;
}
.factsheet-bx .icon {
padding-right: 5px;
min-width: 40px;
max-width: 40px;
}
.factsheet-bx .icon svg {
fill: var(--pri);
width: 100%;
height: 100%;
color: var(--pri);
}
.factsheet-bx .tx-bx .tt {
font-size: 16px;
line-height: 1.3;
font-weight: 500;
color: var(--text-color);
margin-bottom: 2px;
}
.factsheet-bx .tx-bx p {
color: var(--para-color);
font-size: 14px;
line-height: 1.4;
margin-bottom: 0;
opacity: 0.8;
font-weight: 500;
}
.factsheet-bx.why-bx {
flex-wrap: wrap;
padding: 20px;
gap: 10px 15px;
display: block;
}
.factsheet-bx.why-bx .icon {
padding-right: 0;
}
.factsheet-bx.why-bx .tx-bx .tt {
font-size: 18px;
}
.factsheet-bx.why-bx .body-tx {
font-size: 14px;
margin-top: 10px;
}
.cate-img {
max-width: 500px;
float: right;
width: 100%;
margin-left: 30px;
margin-bottom: 30px;
}
.cate-img img {
aspect-ratio: 1 / 1;
object-fit: contain;
object-position: center;
width: 100%;
height: 100%;
overflow: hidden;
border: 2px solid var(--border-color);
}
.vidBx .imgBx {
position: relative;
}
.vidBx .imgBx img {
aspect-ratio: 16 / 9;
width: 100%;
object-fit: contain;
object-position: center;
border-radius: 4px;
box-shadow: 0 1px 5px 0px rgba(0, 0, 0, 0.15);
}
.video-play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: transparent;
border: 0;
outline: 0;
transition: 0.3s;
}
.vidBx .imgBx:hover .video-play-icon {
transform: translate(-50%, -50%) scale(1.1);
}
.vidBx .tx-bx .tt {
font-size: 15px;
color: var(--text-color);
font-weight: 500;
margin-top: 10px;
margin-bottom: 1px;
text-transform: capitalize;
text-align: center;
}
.vidBx:hover .tx-bx .tt {
color: var(--pri);
}
.vidBx .tx-bx p {
text-align: center;
}
.faq-img-sec img {
padding-bottom: 30px;
width: 100%;
}
.faq-img-sec .box1 {
position: absolute;
background-color: var(--pri);
width: 350px;
height: 220px;
right: -58px;
bottom: 99px;
transform: skew(-20deg, 0deg);
}
.phone_number {
position: absolute;
display: flex;
align-items: center;
bottom: 150px;
right: 40px;
background-color: var(--white);
border-bottom: 1px solid var(--sec);
box-shadow: 0px 0px 13.5px 1.5px rgba(0, 0, 0, 0.05);
padding: 25px;
padding-right: 20px;
gap: 15px;
}
.phone_number .icon svg {
color: var(--pri);
width: 40px;
height: 40px;
}
.phone_number .text p {
color: var(--para-color);
margin-bottom: 0;
font-weight: 600;
}
.phone_number .text a {
font-size: 25px;
color: var(--text-color);
font-weight: 900;
}
.phone_number .text a:hover {
color: var(--pri);
}
.faq-sec .nav-pills .nav-link {
background-color: white;
color: var(--text-color);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
border-radius: 0;
border: 1px solid transparent;
text-align: start;
padding: 10px 13px;
border-left: 4px solid var(--pri);
}
.faq-sec .nav-pills .nav-link:hover {
color: var(--pri);
}
.faq-sec .nav-pills .nav-link.active,
.faq-sec .nav-pills .show>.nav-link {
color: var(--white);
background-color: var(--pri);
/* border: 1px solid var(--pri); */
}
.accordion-item,
.accordion-item:first-of-type,
.accordion-item:not(:first-of-type) {
margin-bottom: 15px;
background: #fff;
border: 0;
border-radius: 0;
padding: 0;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
}
.accordion-item:last-of-type {
margin-bottom: 0;
}
.accordion-button {
background: transparent;
font-weight: 400;
outline: 0 !important;
color: var(--text-color);
font-size: 22px;
padding: 16px 20px;
padding-right: 59px;
font-family: var(--font);
border-radius: 0 !important;
border: 1px solid transparent !important;
line-height: 1;
}
.accordion-body {
line-height: 1.5;
font-size: 15px;
color: var(--para-color);
padding: 16px 20px;
}
.accordion-button::after {
position: absolute;
right: 0;
top: 0;
width: 59px;
height: 100%;
background-size: 1.1rem;
background-position: center;
}
.accordion-button::before {
content: "";
position: absolute;
width: 1px;
height: 100%;
border-left: 1px solid var(--border-color);
right: 59px;
top: 0;
}
.accordion-button:not(.collapsed)::before {
border-left: 1px solid var(--pri);
}
.accordion-button:not(.collapsed) {
box-shadow: none !important;
background: transparent;
border: 0;
color: var(--pri);
border: 1px solid var(--pri) !important;
}
.accordion-button:focus {
box-shadow: none !important;
border: 0;
}
.accordion-button:not(.collapsed)::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23f5874f'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
transform: rotate(-180deg);
}
.iti {
width: 100%;
}
.iti--allow-dropdown .iti__flag-container,
.iti--separate-dial-code .iti__flag-container {
height: 40px;
}
.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag,
.iti--separate-dial-code .iti__selected-flag {
background-color: transparent;
}
.g-recaptcha {
transform: scale(0.8);
transform-origin: 0 0;
}
.business-enq {
position: fixed;
bottom: 48px;
right: 20px;
z-index: 9;
border: 0;
outline: 0;
background-color: var(--pri);
color: var(--white);
font-size: 15px;
padding: 5px;
padding-right: 15px;
border-radius: 24px;
transition: 0.2s ease-in-out;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
font-weight: 400;
}
.business-enq:hover {
transform: scale(1.03);
}
.business-enq .icon {
height: 32px;
width: 32px;
border-radius: 100%;
line-height: 32px;
text-align: center;
display: inline-block;
background: var(--white);
color: var(--pri);
}
.business-enq .icon svg {
height: 18px;
width: 18px;
}
.whatapp_btn {
background: #01e675;
width: 40px;
height: 40px;
color: var(--white);
position: fixed;
right: 20px;
bottom: 105px;
cursor: pointer;
z-index: 9;
border-radius: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: 0.2s ease-in-out;
box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.15);
border: 0;
}
.whatapp_btn svg {
width: 19px;
height: 19px;
}
.whatapp_btn:hover {
transform: scale(1.1);
}
.whatapp_btn:focus,
.whatapp_btn:hover {
background: #01e675;
color: var(--white);
}
.error {
font-size: 15px;
color: red;
}
.modal-header {
padding: 0;
padding-inline: 20px;
padding-top: 18px;
border-radius: 0;
border: 0;
/* border-bottom: 1px solid #e3e3e3; */
}
.modal-header.modal-header2 {
background: var(--liner);
background-color: var(--pri);
color: white;
padding-block: 12px;
}
.modal-header.modal-header2 .main-tt {
color: white;
}
.modal-content {
background: var(--off-white);
border-radius: 0;
border: 0;
}
.modal-header.modal-header2 .btn-close {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
}
@media (min-width: 576px) {
.modal-sm {
max-width: 300px;
}
}
.modal-body {
padding: 13px 18px 20px;
}
.modal-content .main-tt {
text-align: center;
font-size: 16px;
font-weight: 500;
color: var(--pri);
margin-bottom: 15px;
}
.btn-close {
float: right;
box-shadow: none;
}
.btn-close:hover,
.btn-close:focus {
box-shadow: none;
}
.pop-img {
aspect-ratio: 1 / 1;
}
.pop-img img {
aspect-ratio: 1 / 1;
object-fit: contain;
object-position: center;
width: 100%;
border-radius: 4px;
overflow: hidden;
}
.content-sec h1,
.content-sec h2,
.content-sec h3,
.content-sec .tt,
.cmTitle {
text-transform: capitalize;
font-size: 35px;
font-weight: 400;
color: var(--text-color);
text-align: left;
margin-bottom: 7px;
line-height: 1.3;
}
.cmTitle {
color: var(--pri);
font-size: 18px;
margin-bottom: 5px;
}
.content-sec h2,
.content-sec h3,
.content-sec .tt {
font-size: 30px;
color: var(--text-color);
}
.content-sec ul {
padding-left: 0;
margin: 0;
margin-bottom: 10px;
list-style: none;
}
.content-sec p {
margin-bottom: 10px;
}
.content-sec p,
.content-sec ul li {
font-size: 15px;
line-height: 1.6;
color: var(--para-color);
text-align: justify;
font-family: var(--font2);
font-weight: 400;
}
.content-sec ul li {
margin-bottom: 3px;
position: relative;
padding-left: 20px;
}
.content-sec ul li::before {
content: "➤";
position: absolute;
left: 0px;
color: var(--sec);
font-size: 15px;
top: 1px;
}
.content-sec ul li a {
display: inline;
color: var(--text-color);
}
ul.footer-menu-list {
display: flex;
flex-wrap: wrap;
padding: 0;
margin-bottom: 18px;
list-style: none;
}
ul.footer-menu-list li a {
margin-right: 15px;
font-weight: 300;
display: inline-block;
line-height: 1.3;
position: relative;
text-transform: capitalize;
color: var(--off-white);
}
ul.footer-menu-list li a:hover {
color: var(--pri);
opacity: 1;
}
ul.footer-menu-list li a::before {
content: "|";
padding: 0;
font-size: 13px;
position: absolute;
right: -9px;
top: 1px;
color: var(--white);
opacity: 0.8;
}
ul.footer-menu-list li:last-child a::before {
content: none;
}
footer {
background: #212529;
overflow: hidden;
padding: 60px 0 15px;
position: relative;
}
.ft-bx {
position: relative;
z-index: 1;
}
.ft-bx .logo img {
max-width: 120px;
max-height: 100%;
}
.ft-bx .con-bx {
display: flex;
align-items: start;
margin-bottom: 10px;
gap: 10px;
}
.ft-bx .con-bx .ic-bx svg {
min-width: 17px;
width: 17px;
height: 17px;
color: var(--pri);
}
.ft-bx .con-bx a,
.ft-bx .con-bx p {
font-weight: 300;
font-size: 15px;
line-height: 1.6;
color: var(--off-white);
margin-bottom: 0px;
}
.ft-bx .con-bx p strong {
font-weight: 500;
}
.ft-bx .con-bx a {
font-weight: 400;
}
.ft-bx .con-bx a:hover {
color: var(--pri);
}
.ft-bx .ft-tt {
font-family: var(--font);
font-weight: 400;
font-size: 30px;
color: var(--white);
text-transform: capitalize;
margin-bottom: 27px;
position: relative;
}
.ft-bx .ft-tt::before {
content: "";
position: absolute;
bottom: -9px;
left: 2px;
width: 45px;
height: 2px;
background: var(--pri);
}
.ft-bx .ft-tt span {
color: var(--pri);
}
.ft-bx p {
color: var(--off-white);
line-height: 1.6;
font-size: 15px;
font-weight: 300;
margin-bottom: 20px;
}
.ft-bx ul {
padding: 0;
list-style: none;
margin: 0;
}
.ft-bx ul li a {
font-weight: 300;
font-size: 15px;
color: var(--off-white);
padding: 4px 0;
transition: 0.1s;
display: inline-block;
}
.ft-bx ul li a:hover {
color: var(--pri);
}
.ft-bx ul.social {
display: flex;
gap: 7px;
justify-content: start;
}
.ft-bx ul.social li a {
width: 38px;
height: 38px;
color: rgba(255, 255, 255, 0.9);
border-radius: 100%;
align-content: center;
text-align: center;
line-height: 1;
}
.contact-bx.ft-bx ul.social li a {
border: 1px solid rgba(0, 0, 0, 0.4);
color: var(--pri);
}
.contact-bx.ft-bx ul.social li.facebook a {
background: #3c5b9b;
color: white;
border: 0;
}
.contact-bx.ft-bx ul.social li.twitter a {
background: var(--liner);
background-color: #000;
color: white;
border: 0;
}
.contact-bx.ft-bx ul.social li.linkedin a {
background: #027ba5;
color: white;
border: 0;
}
.contact-bx.ft-bx ul.social li.youtube a {
background: #f70000;
color: white;
border: 0;
}
.contact-bx.ft-bx ul.social li.instagram a {
background: radial-gradient(circle at 30% 107%,
#fdf497 0%,
#fdf497 5%,
#fd5949 45%,
#d6249f 60%,
#285aeb 90%);
color: white;
border: 0;
}
.contactBx-container {
background-color: var(--off-white);
padding: 30px;
border: 1px solid var(--off-white);
height: 100%;
}
.ft-bx ul.social li a:hover {
border-color: var(--pri);
background-color: var(--pri);
color: white;
}
.copyright {
padding-top: 13px;
margin-top: 30px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.copyright svg {
color: var(--pri);
}
.copyright p {
color: rgba(255, 255, 255, 0.8);
margin-bottom: 0;
font-weight: 300;
font-size: 14px;
}
.copyright p a {
color: rgba(255, 255, 255, 0.8);
display: inline;
}
.copyright p a:hover {
color: var(--pri);
}
footer .content-sec h1,
footer .content-sec h2,
footer .content-sec h3,
footer .content-sec .tt {
color: var(--white);
font-size: 18px;
text-transform: capitalize;
}
footer .content-sec p,
footer .content-sec ul li {
color: var(--off-white);
font-weight: 300;
font-size: 15px;
}
.sitemap {
border-left: 1px solid #666;
padding: 0;
}
.sitemap li {
list-style: none !important;
background: transparent url(../images/sitemap_hr.png) no-repeat scroll 0px 9px;
padding: 0px 0px 0px 15px;
margin-bottom: 5px;
font-family: var(--font2);
color: var(--text-color);
font-weight: 400;
}
.sitemap li ul {
border-left: 1px solid #666;
padding: 0;
}
.sitemap li a {
color: var(--text-color);
font-size: 15px;
padding-bottom: 5px;
display: inline-block;
}
.sitemap li a:hover {
color: var(--pri);
}
.market-sec {
padding: 60px 0;
font-family: var(--font2);
}
.market-sec h1,
.market-sec .main-tt,
.market-sec h2,
.market-sec h3 {
font-size: 28px;
color: var(--text-color);
line-height: 26px;
margin: 20px 0 15px;
font-weight: 400;
}
.market-sec h2,
.market-sec h3 {
font-size: 25px;
font-weight: 400;
}
.market-sec .market-bx {
padding: 10px 12px;
background-color: #e8e8e8;
color: var(--text-color);
font-size: 15px;
transition: 0.2s ease-in-out;
}
.market-sec .market-bx:hover {
background-color: var(--pri);
color: white;
}
.expend-content-sec {
max-height: 480px;
/* collapsed height */
overflow: hidden;
}
.expend-content-sec.expanded {
max-height: 10000px;
/* expanded height */
overflow: unset;
}
.read-toggle {
display: inline-block;
color: var(--text-light);
cursor: pointer;
font-weight: 600;
margin-top: 10px;
user-select: none;
}
.read-toggle:hover {
color: var(--text-color);
}
.certificate-bx {
box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px;
transition: 0.2s ease-in-out;
}
.certificate-bx:hover {
transform: scale(1.02);
}
.certificate-bx .img-bx {
aspect-ratio: 1 / 1;
}
.certificate-bx .img-bx img {
object-fit: cover;
object-position: top;
width: 100%;
height: 100%;
aspect-ratio: 1 / 1;
}
.certificate-bx .tt {
background-color: #f1f1f1;
padding: 10px;
line-height: 1;
align-content: center;
color: var(--text-color);
font-size: 15px;
font-weight: 600;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.certificate-bx .tt svg {
margin-right: 3px;
}
.gallery-bx {
background: #fff;
position: relative;
aspect-ratio: 1 / 1;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
margin-bottom: 3px;
border-radius: 3px;
overflow: hidden;
}
.gallery-bx img {
aspect-ratio: 1 / 1;
width: 100%;
object-fit: cover;
object-position: center;
transition: 0.3s ease;
}
.gallery-bx:hover img {
filter: blur(3px);
}
.gallery-bx.certificate-bx img,
.gallery-bx.certificate-bx {
aspect-ratio: 164 / 235;
}
.gallery-bx img {
max-width: 100%;
}
.gallery-bx .link-wrap {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 3;
display: inline-block;
height: 45px;
width: 45px;
line-height: 40px;
background-color: rgba(255, 255, 255, 0.2);
border: 2px solid rgba(255, 255, 255, 0.3);
text-align: center;
color: #fff;
font-size: 14px;
opacity: 0;
transition: all 0.5s ease-in-out;
pointer-events: none;
border-radius: 100%;
}
.gallery-bx .link-wrap svg {
width: 20px;
height: 20px;
}
.gallery-bx:hover .link-wrap {
opacity: 1;
}
.gallery-bx .tt {
color: white;
position: absolute;
bottom: 0;
left: 0;
padding: 45px 20px 10px;
pointer-events: none;
width: 100%;
font-weight: 500;
font-size: 18px;
letter-spacing: 0.5px;
background: linear-gradient(to top,
rgba(2, 20, 4, 0.75) 10%,
rgba(0, 0, 0, 0) 70%);
text-shadow: 1px 1px 5px #000;
z-index: 2;
}
.abt-vid-bx iframe,
.reels-vid iframe {
aspect-ratio: 16 / 9;
object-fit: cover;
object-position: center;
width: 100%;
display: block;
border: 1px solid #e3e3e3;
overflow: hidden;
border-radius: 20px;
pointer-events: none;
transform: scale(1.01);
transform-origin: 50% 50%;
}
.reels-vid iframe {
aspect-ratio: 35 / 62;
}