main#content > div > div > div {
background-color:transparent;
}
body {
background-color: white;
transition: background-color 0.9s ease;
}
.cust_banner_wrap{
background-color: #000 !important;    
}
h1, h2, h3, h4, h5, h6, p,
.competencies-inner .tabs li a,
.elementskit-author-name,
.elementskit-author-des {
transition: color 0.9s ease;
color: black; 
}
.scroll-main.black-bg,
.innovation_design_wrap.black-bg { color: #fff;
transition: background-color 0.9s ease-in-out !important;
}
.innovation_design_wrap {
padding-bottom: 100px !important;
transition: background-color 0.9s ease-in-out !important; }
.innovation_design_wrap.black-bg .elementor-heading-title {
color: #fff !important;
}
.filter-block-sec {
margin: 0px;
padding: 0px;
}
.filter-block-row {
display: flex;
flex-wrap: wrap;
}
.popup-cu.popup-closed {
display: none;
}
.filter-block-col {
flex: 0 0 16.666666%;
max-width: 16.666666%;
padding: 0 5px;
}
.filter-item-block {
margin: 0px;
padding: 0px;
position: relative;
}
.filter-item-block-inner {
margin: 0px;
padding: 0px;
border-radius: 16px;
overflow: hidden;
}
.filter-img-sec {
margin: 0px;
padding: 0px;
position: relative;
}
.filter-img-sec img {
max-width: 100%;
height: auto;
width: 100%;
display: block;
object-fit: cover;
}
.filter-main-img {
position: relative;
top: 0;
z-index: 4;
transition: all ease 0.4s;
}
.filter-hover-img {
position: absolute;
top: 0;
z-index: 4;
opacity: 0;
transition: all ease 0.4s;
}
.filter-item-block-inner a:hover .filter-hover-img {
opacity: 1;
}
.filter-item-block-inner a:hover .filter-main-img {
opacity: 0;
}
.filter-item-block-inner a:hover .filter-img-sec:after {
opacity: 1;
}
.filter-title-block {
margin: 0px 0 0 0;
padding: 0px;
}
.filter-title-block h5 {
font-family: "Futura PT", Sans-serif;
font-size: 18px;
font-weight: 400;
text-transform: capitalize;
line-height: 28px;
letter-spacing: 0px;
color: #FFFFFF;
margin: 0px;
position: relative;
width: 100%;
}
.filter-title-block:after {
content: '→';
font-size: 1.4em;
margin-left: 10px;
}
.filter-title-block {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 20px 10px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
color: #fff;
font-size: 1.1em;
font-weight: bold;
display: flex;
justify-content: space-between;
align-items: center;
z-index: 11;
border-radius: 0px 0px 16px 16px;
}
.popup-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.6);
display: none;
justify-content: center;
align-items: center;
z-index: 999;
}
.popup-content {
background: #fff;
width: 90%;
max-width: 960px;
max-height: 80vh;
display: flex;
overflow: hidden;
border-radius: 10px;
position: relative;
}
.popup-left,
.post-info-popup.popup-right {
width: 50%;
overflow-y: auto;
}
.swiper {
width: 100%;
height: 100%;
}
.swiper-slide img {
width: 100%;
height: 100% !important;
object-fit: cover;
display: block;
}
.popup-right {
padding: 20px;
}
.popup-right h2 {
margin-top: 0;
font-family: "Futura PT", Sans-serif;
font-size: 36px;
font-weight: 400;
line-height: normal;
color: #0E0E12;
}
.close-btn {
position: absolute;
top: 10px;
right: 10px;
background: #F7941E;
color: #fff;
width: 40px;
height: 40px;
border-radius: 50%;
text-align: center;
line-height: 30px;
cursor: pointer;
font-size: 18px;
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
} .popup-right::-webkit-scrollbar,
.popup-left::-webkit-scrollbar {
width: 6px;
}
.popup-right::-webkit-scrollbar-thumb,
.popup-left::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2);
border-radius: 3px;
}
.link-con-area a {
font-family: "Futura PT", Sans-serif;
font-size: 20px;
font-weight: 500;
line-height: normal;
color: #0E0E12;
text-decoration: underline;
transition: all ease 0.4s;
}
.link-con-area a:hover {
color: #F7941E;
}
.swiper-button-prev:after,
.swiper-button-next:after {
display: none;
}
.scroll-main {
transition: background-color 0.9s ease-in-out !important; }
.black-bg.scroll-main { transition: background-color 0.9s ease-in-out !important;
}
.cusst_nsa_wrap > a.elementor-element{
background-color: #fff !important;
}
.black-bg.scroll-main .elementor-heading-title,
.innovation_design_wrap.black-bg .elementor-heading-title,
.scroll-main .elementor-heading-title {
transition: color 0.9s ease-in-out !important;
}
.black-bg.scroll-main .elementor-heading-title {
color: #fff !important;
}
.popup-cu p span {
color: #F7941E; }
.innovation-arrow:after {
display: none
}
.innovation-col-inner:after {
height: 110px;
}
.filter-title-block:after {
content: '';
font-size: 1.4em;
margin-left: 0px;
background-image: url(https://flowcodes.in/nirsivan/wp-content/uploads/2025/06/innovation-arrow.svg);
background-repeat: no-repeat;
background-size: 40px;
height: 40px;
width: 50px;
display: none;
}
.innovation-arrow {
position: relative;
bottom: -25px;
}
.innovation-col-inner .innovation-details {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
display: flex;
align-items: flex-end;
justify-content: space-between;
padding: 30px 30px 20px 30px;
z-index: 9;
}
.innovation-col-inner .innovation-details {
align-items: flex-end !important;
}
.innovation-image img{
height: 100% !important;
object-fit: cover !important;
}
.filter-block-col .filter-title-block img {
width: 40px;
height: 40px;
position: relative;
bottom: -10px;
}
.filter-item-block .filter-title-block {
height: auto;
align-items: flex-end;
}
.filter-block-col .filter-title-block h5 {
line-height: 1.4;
}
.close-btn > img {
width: 14px;
}
.cust_social_media_wrap #sbi_load {
position: absolute;
top: -116px;
right: 0;
left: auto;
display: flex;
justify-content: flex-end;
max-width: max-content;
}
.cust_social_media_wrap #sbi_load a {
margin-top: 0;
background: transparent !important;
color: rgb(247,148,30) !important;
border: none !important;
font-size: 20px !important;
}
.cust_social_media_wrap #sbi_load a svg {
width: 20px;
height: 20px !important;
}
.innovation-section {
width: 100%;
position: relative;
}
.innovation_wrapper {
display: flex;
flex-wrap: wrap;
margin: 0 -10px;
}
.innovation-col_wrapper {
width: 33.3%;
padding: 0 30px 60px 30px;
min-height: 350px;
}
.innovation-image {
display: flex;
height: 100%;
width: 100%;
flex-direction: column;
}
.innovation-image img{
height: 100%;
object-fit: cover;
transition: opacity 0.7s ease;
}
.innovation-col-inner {
border-radius: 10px;
overflow: hidden;
height: 100%;
position: relative;
z-index: 9;
}
.innovation-col-inner:after {
content: '';
position: absolute;
left: 0;
bottom: 0;
height: 135px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 8.1%, rgba(0, 0, 0, 0.8) 15.5%, rgba(0, 0, 0, 0.8) 22.5%, rgba(0, 0, 0, 0.78) 29%, rgba(0, 0, 0, 0.73) 35.3%, rgba(0, 0, 0, 0.67) 41.2%, rgba(0, 0, 0, 0.6) 47.1%, rgba(0, 0, 0, 0.52) 52.9%, rgba(0, 0, 0, 0.44) 58.8%, rgba(0, 0, 0, 0.33) 64.7%, rgba(0, 0, 0, 0.22) 71%, rgba(0, 0, 0, 0.12) 77.5%, rgba(0, 0, 0, 0.05) 84.5%, rgba(0, 0, 0, 0.01) 91.9%, rgba(0, 0, 0, 0) 100%);
z-index: 1;
width: 100%;
border-radius: 10px;
}
.innovation-hover-img img{
height:100% !important;
width:100%;
object-fit:cover;
}
.innovation-col-inner .innovation-details {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 30px 30px 20px 30px;
z-index: 9;
}
.innovation-title h2 {
font-family: "Futura PT", Sans-serif;
font-size: 18px;
font-weight: 400;
text-transform: capitalize;
line-height: 1;
letter-spacing: 0.5px;
color: #FFFFFF;
margin: 0;
}
.innovation-arrow a {
display: flex;
align-items: center;
justify-content: center;
}
.innovation-video video {
aspect-ratio: 16/9;
width: 100%;
height: auto;
opacity: 0;
transition: opacity 0.5s ease;
}
.innovation-video {
position: absolute;
top: 0;
display: flex;
flex-direction: column;
height: 100%;
width:100%;
}
.innovation-col-inner.video-col:hover .innovation-video video {
opacity: 1;
}
.innovation-col-inner.video-col:hover .innovation-image img {
opacity: 0;
}
.innovation-hover-img {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
opacity: 0;
transition: all ease 0.4s;
}
.innovation-col-inner:hover .innovation-hover-img{
opacity: 1;
}
.innovation-col-inner:hover .innovation-image{
opacity: 0;
}
@media screen and (max-width: 1024px) and (min-width: 1600px) {
.innovation-col_wrapper {
width: 33.3%;
padding: 0 10px 20px 10px;
max-height: 250px;
}
}
.competencies-main-sec{
display: flex;    
}
.competencies-inner{
flex: 0 0 32%;
max-width: 32%;
}
.competencies-inner ul{
list-style: none;
margin: 0px;
padding: 0px;
}
.competencies-inner ul li{
border-bottom: 1px solid #F7941E;
font-family: "Futura PT", Sans-serif;
font-weight: 400;
text-transform: capitalize;
line-height: 52px;
padding: 20px 10px;
color: #000;
font-size: 42px;
}
.competencies-inner ul li a{
font-family: "Futura PT", Sans-serif;
font-weight: 400;
text-transform: capitalize;
line-height: 52px;
color: #000;
font-size: 42px;
text-decoration: none;
}
.competencies-inner-tab-con{
margin: 0px;
padding:0px 0 0 53px;
flex: 0 0 68%;
max-width: 68%;    
}
.tab-con-img{
height: 100%;
}
.tab-con-img img{
height: 100%;
max-height: 558px;
width: 100%;
display: block;
border-radius: 10px;
object-fit: cover;
}
.competencies-inner-tab-con .tab-content{
display: none;
height: 100%;
}
.competencies-inner-tab-con .tab-content.current{
display: inherit;
} .popup-left,
.popup-right {
width: 50%;
overflow-y: auto;
}
.popup-left {
background: #000;
}
.swiper {
width: 100%;
height: 100%;
}
.swiper-slide img {
width: 100%;
height: auto;
display: block;
}
.popup-right {
padding: 20px;
}
.innovation-col_wrapper{
width: 33.3%;
padding: 0 30px 60px 30px;
max-height: 330px;
}
.innovation-col_wrapper > div{
height: 100%;
} @media screen and (max-width:1700px){
.competencies-inner ul li a {   
line-height: normal;   
font-size: 30px;    
}
}
@media screen and (max-width:1440px){
.innovation-col_wrapper {
width: 33.3%;
padding: 0 15px 30px 15px;
max-height: 410px;
}
.innovation-col_wrapper > div{
height:100%;
}
.popup-cu{
width: 30% !important;
}
}
@media screen and (max-width:1280px){
.popup-cu {
width: 35% !important;
}
}
@media screen and (max-width:1199px){
.competencies-inner {
flex: 0 0 40%;
max-width: 40%;
}
.competencies-inner-tab-con {
margin: 0px;
padding: 0px 0 0 53px;
flex: 0 0 60%;
max-width: 60%;
}
.filter-block-col {
flex: 0 0 25%;
max-width: 25%;
padding: 0 5px;
margin:0 0 25px 0;
}
}
@media screen and (max-width:1024px){
.popup-cu {
width: 40% !important;
}
}
@media screen and (max-width:991px){
.competencies-inner {
flex: 0 0 100%;
max-width: 100%;
}
.competencies-inner-tab-con {
margin: 50px 0 0 0;
padding: 0px;
flex: 0 0 100%;
max-width: 100%;
}
.competencies-main-sec{
flex-wrap:wrap;
}
.popup-cu a span{
position:relative !important;
right:0 !important;
top:0 !important;
margin-left: 0px !important; }
.popup-cu{
padding:30px 30px 0 30px !important;
}
.innovation-col_wrapper {
width: 50%;
padding: 0 15px 30px 15px;
max-height: 350px;
}
.popup-right h2{
font-size:28px;
}
.link-con-area{
margin:0 0 15px 0;
}
.popup-content{
max-width:100%;   
}
}
@media screen and (max-width:767px){    
.innovation-hover-img{
display: none;
}
.innovation-col-inner:hover .innovation-image {
opacity: 1;
}
.innovation-col-inner.video-col:hover .innovation-image img{
opacity: 1;
}
.competencies-inner ul li a {
line-height: normal;
font-size: 20px;
}
.innovation-video{
display: none;
}
.competencies-inner ul li{
padding:10px;
}
.popup-cu {
width: 90% !important;
right: 0 !important;
margin: 20px auto;
left: 0;
bottom: 0 !important;
display: flex;
align-items: center;
padding: 30px 30px 30px 30px !important;
}
.popup-cu > a{
text-align: center;
}
.innovation-col_wrapper {
width: 100%;
padding: 0 0px 30px 0px;
max-height: 500px;
height: 500px !important;
}
.filter-block-col {
flex: 0 0 100%;
max-width: 100%;
padding: 0 5px;
margin:0 0 25px 0;
}
.filter-block-row .swiper-pagination{
position: relative;
margin: 0;
}
.filter-block-row span.swiper-pagination-bullet {
height:15px;
width:15px;
background:transparent;
border:1px solid #F7941E;
opacity:1;
transition:all ease 0.4s;
}
.filter-block-row .swiper-pagination-bullet.swiper-pagination-bullet-active{
background:#F7941E;
}
.innovation_wrapper .swiper-pagination{
position: relative;
margin: 0;
}
.innovation_wrapper span.swiper-pagination-bullet {
height:15px;
width:15px;
background:transparent;
border:1px solid #F7941E;
opacity:1;
transition:all ease 0.4s;
}
.innovation_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active{
background:#F7941E;
}
.innovation-col-inner .innovation-details{
padding: 30px 10px 20px 10px;
}
.popup-content{
max-width:100%;
flex-wrap:wrap;        
overflow: scroll;
}
.popup-content .popup-left{
flex:0 0 100%;
}
.popup-content .popup-right {
flex: 0 0 100%;
padding: 0;
}
.popup-left img {
height: 270px !important;
object-fit: contain;
width: 100%;
}
.popup-right h2{
font-size:22px;
}
.filter-item-block-inner a:hover .filter-hover-img {
opacity: 1;
}
.filter-hover-img{
display: none;
}
.filter-item-block-inner a:hover .filter-main-img {
opacity: 1;
}
.close-btn {    
width: 50px;
height: 50px;    
z-index: 10;   
}
.close-btn img{
width: 20px;
height: 30px;
margin: 0 auto;
}
.swiper {
width: 100% !important;
overflow: hidden !important;
position: relative;
box-sizing: border-box;
}
.swiper-wrapper {
display: flex !important;
width: 100% !important;
} }