/*--------------------------------------------------------------
# Customizing Header Transparent & Nav Menu
--------------------------------------------------------------*/
#header.transparent{background: transparent !important;}
#header.transparent .logo-color{position: absolute !important; top: 0px; right: 0px; bottom: 0px; left: 0px; visibility: hidden !important; opacity: 0 !important;}
#header.transparent .logo-white{position: initial !important; visibility: initial !important; opacity: 1 !important;}
#header.transparent .link-tools .tds-icon{fill: #ffffff;}
#header.transparent .nav-menu ul li .main-nav-item{color: #ffffff !important;}
#header.transparent .mobile-nav-toggle i{color: #ffffff !important;}
#header.header-show{box-shadow: none !important;}
#header .mobile-nav .mobile-nav-header .mobile-nav-toggle i{color: var(--nav-menu-links-color) !important;}


/*--------------------------------------------------------------
# fullscreen video background section
--------------------------------------------------------------*/
#fullscreen_video_background{width: 100%; height: calc(100vh - 180px); height: calc(100svh - 180px); position: relative;}
#fullscreen_video_background #video_background {width: 100%; height: calc(100vh - 180px); height: calc(100svh - 180px); object-fit: cover; border: none !important; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: -1;}
#fullscreen_video_background .video-background-overly {background: linear-gradient(200deg, rgb(10 69 135 / 30%) 20%, rgb(10 69 135 / 30%) 60%, rgb(13 118 139 / 20%) 100%, rgb(13 118 139 / 10%) 20%);}
#fullscreen_video_background .video-background-overly::before {content: ""; display: block; background: var(--light); position: absolute; left: 0; width: calc(50% + 0.500px); border-radius: 16px 1px 0px 20px; height: 196px; transform-origin: left; transform: skewY(-5deg); bottom: -180px; z-index: 0}
#fullscreen_video_background .video-background-overly::after {content: ""; display: block; background: var(--light); position: absolute; right: 0; width: calc(50% + 0.500px); border-radius: 1px 16px 20px 0px; height: 196px; transform-origin: right; transform: skewY(5deg); bottom: -180px; z-index: 0}
#fullscreen_video_background .video-background-carousel {position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;}
#fullscreen_video_background .video-background-carousel .video-background-carousel-titel{position: absolute; top: 0px; right: 12px; bottom: 0px; left: 12px; color: #ffffff;}


/*--------------------------------------------------------------
# Requist Quatation Section section
--------------------------------------------------------------*/
#requist-quatation-section .section-title .section-title-content .title-content .subtitle span{position: relative;}
/* #requist-quatation-section .section-title .section-title-content .title-content .subtitle span::before {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 30px; background-repeat: no-repeat; width: 30px; height: 30px; position: absolute; top: 0px; z-index: 0;} */
#requist-quatation-section .section-title .section-title-content .title-content .subtitle span::after {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 30px; background-repeat: no-repeat; width: 30px; height: 30px; position: absolute; top: 0px; z-index: 0;}
#requist-quatation-section .section-title .section-title-content .title-content .btn-content .btn{position: relative;}
#requist-quatation-section .section-title .section-title-content .title-content .btn-content .btn::before {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 52px; background-repeat: no-repeat; width: 52px; height: 52px; position: absolute; top: 0px; z-index: 0;}
#requist-quatation-section .section-title .section-title-content .title-content .btn-content .btn::after {content: ""; background: url(../../../../../img/brand-figures/third/circle-line.svg); background-position: center; background-size: 40px; background-repeat: no-repeat; width: 40px; height: 46px; position: absolute; top: -15px; z-index: 0;}
/* #requist-quatation-section .section-title.brand-figure-third-circle-line .section-title-content .title-content::after{background-size: 30px; width: 30px; height: 34px; top: 0px; left: 0px;} */

/*--------------------------------------------------------------
# Sub Services section
--------------------------------------------------------------*/
.sub-services-section{overflow: visible !important;}
@media (max-width: 992px) {.sub-services-section{overflow: hidden !important;}}
.sub-services-section .sticky-col{height: max-content !important; position: sticky; top: 99.99px; transition: all 0.5s ease;}
@media (max-width: 992px) {.sub-services-section .sticky-col{height: auto !important; position: initial;}}
.sub-services-section .sticky-col .img-sticky svg{width: auto; height: 200px;}
.sub-services-section .sticky-col .img-sticky, .sub-services-section .sticky-col .img-sticky .img-container{position: relative;}
.sub-services-section .sticky-col .img-sticky::before{content: ""; background: url('../../../../../img/brand-figures/third/circle-line.svg'); background-position: center; background-size: 70px; background-repeat: no-repeat; width: 80px; height: 80px; position: absolute; top: 0px; z-index: 1;}
.sub-services-section .sticky-col .img-sticky::after{content: ""; background: url('../../../../../img/brand-figures/third/square-x-dots.svg'); background-position: center; background-size: 30px; background-repeat: no-repeat; width: 30px; height: 30px; position: absolute; top: 0px;}
.sub-services-section .sticky-col .img-sticky .img-container::before{content: ""; background: url('../../../../../img/brand-figures/third/square-x-dots.svg'); background-position: center; background-size: 55px; background-repeat: no-repeat; width: 55px; height: 55px; position: absolute; bottom: 0px;}
.sub-services-section .sticky-col .img-sticky .img-container::after{content: ""; background: url('../../../../../img/brand-figures/third/diamond-circle-dots.svg'); background-position: center; background-size: 45px; background-repeat: no-repeat; width: 50px; height: 50px; position: absolute; bottom: 0px; z-index: 0;}

.sub-services-section .accordion-sub-services .accordion-item{background: transparent !important; margin-bottom: 16px !important;}
.sub-services-section .accordion-sub-services .accordion-item:last-child{margin-bottom: 0px !important;}
.sub-services-section .accordion-sub-services .accordion-item .accordion-button{line-height: 1.2rem !important; font-size: 1rem !important; font-weight: 500 !important;}
.sub-services-section .accordion-sub-services .accordion-item .accordion-button::after{background: var(--light); border: solid 1px var(--line); border-radius: 3px; display: flex; justify-content: center; align-items: center;}
.sub-services-section .accordion-sub-services .accordion-item .accordion-button .svg-icon-contaner i.svg-icon{line-height: 1.16em !important;}
.sub-services-section .accordion-sub-services .accordion-item .accordion-button .svg-icon-contaner i.svg-icon svg{width: auto !important; height: 1.16em !important; fill: #ffffff !important;}
.sub-services-section .accordion-sub-services .accordion-item .accordion-body{padding-top: 8px !important; padding-bottom: 16px !important; margin-top: 8px !important; line-height: 1.35rem !important; font-size: 0.895rem !important;}
/* .sub-services-section .accordion-sub-services .accordion-item:last-child .accordion-body{padding-bottom: 0px !important;} */


/*--------------------------------------------------------------
# Technologies Section
--------------------------------------------------------------*/
#technologies-section .technologies-content .swiper .swiper-slide .svg-contaner svg{width: auto !important; height: 40px !important;}


/*--------------------------------------------------------------
# Case Studies Section
--------------------------------------------------------------*/
#case-studies .swiper .swiper-slide .swiper-slide-container{position: relative; border-radius: 8px; overflow: hidden;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links{background: rgb(0 0 0 / 12%); width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; bottom: 0px; z-index: 1;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container{width: 100%; height: 100%; position: relative;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .swiper-slide-expand{position: absolute; top: 0px; left: 0px; line-height: 21px; font-size: 21px; color: #ffffff; outline: none !important; transition: all 0.2s ease;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .swiper-slide-expand:hover{font-size: 24px !important; line-height: 24px !important;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .name{width: calc(100% - 28px); position: absolute; top: 0px; right: 0px; color: #ffffff; text-align: right !important;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .name .name-link{color: #ffffff !important; line-height: 19px; font-size: 19px; transition: all 0.2s ease;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .name .name-link:hover{line-height: 22px; font-size: 22px;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .services{width: 100%; position: absolute; right: 0px; bottom: 0px; left: 0px;}
#case-studies .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .services .service-link{border: solid 1px var(--line); border-radius: 3px; line-height: 12px; font-size: 12px;}


/*--------------------------------------------------------------
# Get Consultation Section section
--------------------------------------------------------------*/
#get-consultation-section .get-consultation-content{position: relative;}
#get-consultation-section .get-consultation-content::before {content: ""; display: block; background: #ffffff; position: absolute; left: 0; width: calc(50% + 1px); border-top: solid 1px var(--line); border-left: solid 1px var(--line); border-radius: 16px 1px 0px 0px; height: 100px; transform-origin: right; transform: skewY(-5deg); top: 0px; z-index: 0}
#get-consultation-section .get-consultation-content::after {content: ""; display: block; background: #ffffff; position: absolute; right: 0; width: calc(50% + 1px); border-top: solid 1px var(--line); border-right: solid 1px var(--line); border-radius: 1px 16px 0px 0px; height: 100px; transform-origin: left; transform: skewY(5deg); top: 0px; z-index: 0}
#get-consultation-section .get-consultation-content .section-title{background: #ffffff; border-right: solid 1px var(--line); border-left: solid 1px var(--line); border-bottom: solid 1px var(--line); border-radius: 0px 0px 16px 16px; position: relative; z-index: 1;}
#get-consultation-section .get-consultation-content .section-title::before {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 65px; width: 65px; height: 65px; background-repeat: no-repeat; position: absolute; bottom: 8px; z-index: 0;}
#get-consultation-section .get-consultation-content .section-title::after {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 40px; width: 40px; height: 40px; background-repeat: no-repeat; position: absolute; top: -16px; z-index: 0;}
@media (max-width: 576px){#get-consultation-section .get-consultation-content .section-title::before{background-size: 45px; width: 45px; height: 45px;} #get-consultation-section .get-consultation-content .section-title::after{background-size: 35px; width: 35px; height: 35px; top: -32px;}}
#get-consultation-section .get-consultation-content .section-title .section-title-content .title-content .subtitle span{position: relative; z-index: 1;}
#get-consultation-section .get-consultation-content .section-title .section-title-content .title-content .subtitle span::before {content: ""; background: url(../../../../../img/brand-figures/third/square-x-dots.svg); background-position: center; background-size: 30px; width: 30px; height: 30px; background-repeat: no-repeat; position: absolute; top: -4px; z-index: 0;}
#get-consultation-section .get-consultation-content .section-title .section-title-content .title-content .btn-content .btn{position: relative;}
#get-consultation-section .get-consultation-content .section-title .section-title-content .title-content .btn-content .btn::after {content: ""; background: url(../../../../../img/brand-figures/third/circle-line.svg); background-position: center; background-size: 40px; width: 40px; height: 46px; background-repeat: no-repeat; position: absolute; top: -15px; z-index: 0;}


/*--------------------------------------------------------------
# Gallery Section
--------------------------------------------------------------*/
#gallery-section .swiper .swiper-slide .swiper-slide-container{position: relative; border-radius: 3px; overflow: hidden;}
#gallery-section .swiper .swiper-slide .swiper-slide-container .overly-links{background: rgb(0 0 0 / 12%); width: 100%; height: 100%; position: absolute; top: 0px; right: 0px; bottom: 0px; z-index: 1;}
#gallery-section .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container{width: 100%; height: 100%; position: relative;}
#gallery-section .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .swiper-slide-expand{position: absolute; top: 0px; left: 0px; line-height: 21px; font-size: 21px; color: #ffffff; outline: none !important; transition: all 0.2s ease;}
#gallery-section .swiper .swiper-slide .swiper-slide-container .overly-links .overly-container .swiper-slide-expand:hover{font-size: 24px !important; line-height: 24px !important;}