:root {

  --primaryColor: #EC145A;  

  --themeBg: #0B0D19;

  --pColor: #BABEDB;  

}

body {

  font-family: "Roboto", sans-serif;

  font-size: 16px;

  font-weight: 300;

  color: var(--pColor);

  line-height: 1.8;

  overflow-x: hidden;

  background: var(--themeBg);

  scroll-behavior: smooth;

  transition-delay: 2s;

  box-sizing: border-box;

  overflow-x: hidden;

  position: relative;

  /* cursor: none; */

}

*,a {

  text-decoration: none;

}

.titleH2 {

  color: #fff;

  font-size: 50px;

  font-weight: 600;

  padding-bottom: 10px;

  pointer-events: none;

}

.titleH6 {

  margin-bottom: 8px;

  font-size: 20px;

  font-weight: 400;

  color: var(--primaryColor);

}

.titleH6 span {

  color: #fff;

}

.primaryBtn {

  margin-top: 30px;

  color: #fff;

  padding: 14px 35px;

  position: relative;

  height: 50px;

  line-height: 1;

  border-radius: 0;

  background: var(--primaryColor);

  transition: all .6s ease 0s;

}

.primaryBtn:hover {

  opacity: .8;

  color: #fff;

  background: var(--primaryColor);

}



.kat-cf-btn .primaryBtn {

  margin-top: 30px !important;

  color: #fff !important;

  padding: 14px 35px !important;

  position: relative !important;

  height: 50px !important;

  line-height: 1 !important;

  border-radius: 0 !important;

  background: var(--primaryColor) !important;

  transition: all .6s ease 0s !important;

}

.kat-cf-btn .primaryBtn:hover {

  opacity: .8 !important;

  color: #fff !important;

  background: var(--primaryColor) !important;

}



.kat-cf-btn .wpcf7-spinner{

  display: block;

}





/* Navbar Start */

.header {

	background: transparent;

	transition: all ease-out .5s;

}

.header.active {

  background: rgb(11 13 25 / 98%);

  /* border-bottom: 1px solid rgb(186 190 219 / 14%); */

}

.fixed-top {

  z-index: 10;

}

.navbar-toggler-icon {

  background-image: url('../img/nav-icon.svg');

}

.navbar-expand-lg .navbar-nav .nav-link, .navbar-expand-lg .navbar-nav .nav-link:focus {

  color: var(--pColor);

  padding: 0 25px;

  font-weight: 400;

  box-shadow: none;

}

.navbar-expand-lg .navbar-nav .nav-link:hover {

  color: var(--primaryColor);

}

.navbar-nav .nav-link.active, 

.navbar-nav .nav-link.show,

.navbar-nav .active .nav-link,

.navbar-nav .active .active a

 {

  color: var(--primaryColor) !important;

}

.navbar-brand img {

  width: 125px;

  padding: 10px 0;

  transition: all ease-out .15s;

}

.navbar-toggler {

  border: 2px solid #3B4063;

}

.navbar-toggler:focus {

  box-shadow: none;

}

.navbar-toggler-icon {

  width: 1em;

  height: 1.2em;

}

.navbar-expand-lg .navbar-nav .dropdown-menu {

  background: rgb(11 13 25 / 98%);

}    

.dropdown-item {

  font-weight: 300;

  color: var(--pColor);

  font-size: 14px;  

}

.dropdown-item:hover {

  color: var(--primaryColor);

  background: transparent;

}

.topBtn {

  font-weight: 400;

  color: var(--pColor);

  padding-left: 30px;

  padding-top: 5px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.topBtn:hover img {

  border: 2px solid var(--primaryColor);

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

  color: var(--primaryColor);

}

.topBtn img {

  border: 2px solid #3B4063;

  border-radius: 50px;

  width: 45px;

  margin-left: 10px;

  transition: all ease-out .5s;

}

.topBtn.active {

  color: var(--primaryColor);

}

/* Navbar End */

/* Curson and Trigger Animation Start */

.cursor {

  position: fixed;

  left: 0;

  top: 0;

  pointer-events: none;

}

.cursor--small {

  width: 10px;

  height: 10px;

  left: -2.5px;

  top: -2.5px;

  border-radius: 50%;

  z-index: 11000;  

  background: var(--primaryColor);

}

.cursor--canvas {

  width: 100vw;

  height: 100vh;

  z-index: 12000;

}

/* Cursor and Trigger Animation End */

/* Left Social Icon Start */

.leftSocial {

  position: fixed;

  right: 1.5%;

  display: flex;

  flex-direction: column;

  flex-wrap: nowrap;

  align-content: flex-end;

  align-items: center;

  justify-content: center;

  height: 65vh;

  z-index: 10;

}

.leftSocial a {

  border: 2px solid rgb(236 20 90 / 45%);

  transition: all 0.5s ease;

  border-radius: 100px;

  margin: 6px 10px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.leftSocial a:hover {

  border: 2px solid rgb(186 190 219 / 75%);

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

}

.leftSocial a img {

  width: 40px;

}

/* Left Social Icon End */

/* Left Whatsapp Start */

.leftWhatsapp {

  position: fixed;

  right: 5%;

  bottom: 10%;

  display: flex;

  flex-direction: column;

  flex-wrap: nowrap;

  align-content: flex-end;

  align-items: center;

  justify-content: center;

  z-index: 10;

}

.leftWhatsapp img {

  width: 70px;

  -webkit-transition: all 0.3s ease-in-out;

  -moz-transition: all 0.3s ease-in-out;

  -ms-transition: all 0.3s ease-in-out;

  -o-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}

.leftWhatsapp img:hover {

  -webkit-transform: scale(1.2);

  -moz-transform: scale(1.2);

  -ms-transform: scale(1.2);

  -o-transform: scale(1.2);

  transform: scale(1.2); 

}

/* Left Whatsapp End */

/* Home Slider Start */

.homeSlider {

  position: relative;

  margin-top: 98px;

}

.homeSlider::after { 

  content: '';

  display: block;

  height: 150px;

  position: absolute;

  width: 40%;

  top: 0;

  opacity: 0.5;

  bottom: 0;

  right: 0;

  z-index: 0;

  background-image: url(../img/slider-bg.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.homeSlider .img-fill {

  max-width: 100%;

  display: block;

  overflow: hidden;

  position: relative;

}

.homeSlider .imgFill {

  max-width: 100%;

  height: 600px;

  object-fit: cover;

  object-position: center;

}

.modernSlider .caption {

  position: absolute;

  width: 90%;

  bottom: 0px;

  left: 40px;

  height: 100%;

  padding-bottom: 60px;

  display: flex;

  align-items: flex-end;

  flex-wrap: nowrap;

  align-content: stretch;

  justify-content: space-between;

}

.modernSlider .caption h1,

.modernSlider .caption h2 {

  font-size: 60px;

  color: #fff;

  z-index: 1;

  text-shadow: 0 1px #ddd;

  font-weight: 800;

  text-transform: uppercase;

}

.modernSlider .caption h1 span,

.modernSlider .caption h2 span {

  display: block;

}

.modernSlider .caption img {  

  position: relative;

  width: 80px;

  top: -5px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.modernSlider .caption img:hover {

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

}

.vertical-dots {

  position: absolute;

  left: -4%;

  display: block;

  top: 20%;

  padding-left: 0px;

}

.vertical-dots li {

  position: relative;

  font-size: 45px;

  width: 30px;

  height: 30px;

  cursor: pointer;

  color: #3B4063;

}

.vertical-dots li button {

    font-size: 0;

    line-height: 0;

    display: block;

    cursor: pointer;

    color: transparent;

    border: 0;

    outline: none;

    background: transparent;

}

.vertical-dots .slick-active {

  width: 30px;

  height: 30px;

  font-size: 45px;

  color: var(--primaryColor) !important;

}

/* Home Slider End */

/* Home About Start */

.homeAbout {

  position: relative;

  padding: 100px 0; 

  background-color: #060a16; 

}

.homeAbout::after { 

  content: '';

  display: block;

  height: 100%;

  position: absolute;

  width: 100%;

  top: 0;

  left: 0;

  bottom: 0;

  right: 0;

  z-index: 0;

  background-image: url(../img/home-about-bg.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.homeAbout h2 {

  padding-bottom: 30px;

}

.homeAbout h6 {

  font-size: 18px;

  line-height: 1.6;

  font-weight: 400;

  padding-bottom: 8px;

}

.homeAbout p {

  max-width: 92%;

  font-size: 17px;

}

.homeAbout-counter {  

  max-width: 90%;

  display: flex;

  align-items: center;

  position: relative;

  border-bottom: 1px solid #BABEDB;

}

.homeAbout-counter::after {

  content: '';

  width: 18%;

  height: 1.5px;

  bottom: -1px;

  left: 0px;

  position: absolute;

  background: var(--primaryColor);

}

.homeAbout-img1 {

  max-height: 350px;

  width: 90%;

  margin-bottom: 20px;

  object-fit: cover;

  object-position: center;

}

.homeAbout-img2 {

  max-height: 485px;

  width: 100%;

  object-fit: cover;

  object-position: center;

}

.homeAbout-img {

  position: relative;

}

.homeAbout-img a {

  position: absolute;

  bottom: 16%;

  left: -15%;

  background: var(--primaryColor);

  height: 125px;

  width: 125px;

  border-radius: 100px;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 22px;

  animation: swing ease-in-out .5s infinite alternate;

    transform-origin: center -20px;

}

@keyframes swing {

  0% { transform: rotate(3deg); }

  100% { transform: rotate(-3deg); }

}

.homeAbout-counter .timer, .homeAbout-counter span {

  font-size: 60px;

  color: #fff;

  font-weight: 600;

}

.homeAbout-counter .timer, .homeAbout-counter span {

  font-size: 56px;

  color: #fff;

  font-weight: 600;

}

.homeAbout-counter p {

  font-size: 16px;

  text-transform: uppercase;

  font-weight: 400;

  color: var(--pColor);

  line-height: 1.5;

  padding-left: 15px;

  margin-bottom: 0;

}

.homeAbout-counter p span {

  display: block;

  color: var(--pColor);

  font-size: 16px;

  text-transform: uppercase;

  font-weight: 400;

}

/* Home About End */

/* Home Services Start */

.homeServices {

  padding: 100px 0 75px 0;

}

.homeServices h2 {

  padding-bottom: 30px;

}

.homeServices .slick-prev:before,

.homeServices .slick-next:before, .homeServices .owl-nav {

   display:none;

}

.homeServices-row {

  position: relative;

  width: 96%;

  /* padding: 35px 25px;

  background: #060a16; */

}

.homeServices .cap {

  position: absolute;

}

.homeServices .cap p {

  margin-bottom: 8px;

  margin-top: 18%;

  font-size: 20px;

  font-weight: 400;

  color: var(--primaryColor);

}

.homeServices .cap p span {

  color: #fff;

}

.homeServices .cap h3 {

  text-shadow: 0 1px #ddd;

  font-size: 60px;

  width: 100%;

  margin-bottom: 40px;

  padding-bottom: 10px;

}

.homeServices .cap h3 span {

  display: block;

}

.homeServices .cap a img {

  border: 2px solid #3B4063;

  border-radius: 50px;

  width: 65px;

  margin-left: 10px;  

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;



}

.homeServices .cap a img:hover {

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

  border: 2px solid var(--primaryColor);

}

/* Home Services End */

/* Home Client Start */

.homeClient {

  position: relative;

  padding: 90px 0; 

  background-color: #060a16; 

}

.homeClient::after { 

  content: '';

  display: block;

  height: 100%;

  position: absolute;

  width: 100%;

  top: 0;

  left: 0;

  bottom: 0;

  right: 0;

  z-index: 0;

  background-image: url(../img/home-client-bg.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.homeClient h2 {

  padding-bottom: 30px;  

}

.homeClient .col-md-3 {

  padding: 0;

}

.homeClient-box {

  padding: 20px 0;

  text-align: center;

  border: 1px solid #3B4063;

}

.homeClient-box.one,

.homeClient-box.one1 {

  border-top: 0;

  border-bottom: 0;

  border-left: 0;

}

.homeClient-box.two,

.homeClient-box.one2 {

  border-top: 0;

  border-bottom: 0;

  border-left: 0;

  border-right: 0;

}

.homeClient-box.three,

.homeClient-box.one3 {

  border-top: 0;

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box.four,

.homeClient-box.one4 {

  border-top: 0;

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box.five,

.homeClient-box.one5 {

  border-left: 0;

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box.six,

.homeClient-box.one6 {

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box.seven,

.homeClient-box.one7 {

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box.eight {

  border-bottom: 0;

  border-right: 0;

}

.homeClient-box a img {

  border: 2px solid #3B4063;

  border-radius: 50px;

  width: 65px;

  position: relative;

  z-index: 1;

  margin: 18px 0;  

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;



}

.homeClient-box a:hover img {

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

  border: 2px solid var(--primaryColor);

}

/* Home Client End */

/* Home Projects Start */

.homeProjects {

  padding: 95px 0 60px 0;

}

.homeProjects h2 {

  padding-bottom: 30px;

}

.seemoreProjects {

  padding-top: 10%;

  text-align: end;

}

.seemoreProjects a {

  font-weight: 400;

  color: var(--pColor);

  padding-left: 30px;

  padding-top: 5px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.seemoreProjects a:hover img {

  border: 2px solid var(--primaryColor);

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

  color: var(--primaryColor);

}

.seemoreProjects img {

  border: 2px solid #3B4063;

  border-radius: 50px;

  width: 45px;

  margin-left: 10px;

  transition: all ease-out .5s;

}

.homeProjects-img img {

  height: 100%;

  padding-bottom: 25px;

}

.homeProjects-img {

  position: relative;

  overflow: hidden;

}

.homeProjects-img img {

  opacity: 1;

  -webkit-transition: opacity 0.35s;

  transition: opacity 0.35s;

}

.homeProjects-img figcaption {

  position: absolute;

  bottom: 7.5%;

  left: 0;

  padding: 10% 3.5em;

  width: 100%;

  height: 90%;

}

.homeProjects-img figcaption::before {

  position: absolute;

  top: 30px;

  right: 30px;

  bottom: 30px;

  left: 100%;

  border-left: 4px solid var(--primaryColor);

  content: '';

  opacity: 1;

  background-color: rgb(11 13 25 / 95%);

  -webkit-transition: all 0.5s;

  transition: all 0.5s;

  -webkit-transition-delay: 0.2s;

  transition-delay: 0.2s;

}

.homeProjects-img h2,

.homeProjects-img p, .homeProjects-img a {

  margin: 0 0 5px;

  opacity: 0;

  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;

  transition: opacity 0.35s,-webkit-transform 0.35s,-moz-transform 0.35s,-o-transform 0.35s,transform 0.35s;

}

.homeProjects-img h2 {

  color: #fff;

  margin-bottom: -15px;

  word-spacing: -0.15em;

  font-weight: 300;

  text-transform: uppercase;

  -webkit-transform: translate3d(30%, 0%, 0);

  transform: translate3d(30%, 0%, 0);

  -webkit-transition-delay: 0.3s;

  transition-delay: 0.3s;

}

.homeProjects-img h2 span {

  font-weight: 800;

  padding-left: 5px;

}

.homeProjects-img p {

  color: var(--pColor);

  font-weight: 400;

  -webkit-transform: translate3d(0%, 30%, 0);

  transform: translate3d(0%, 30%, 0);

  -webkit-transition-delay: 0s;

  transition-delay: 0s;

}

.homeProjects-img a {

  position: relative;

  color: #fff !important;

  background: var(--themeBg); 

  padding: 3px 18px;

  margin-top: 15px;

  display: inline-block;

  transition: all ease-out .5s;

  z-index: 1;

}

.homeProjects-img a:hover {

  opacity: 0.8;

  color: #fff !important;

  background: var(--primaryColor);  

}

.homeProjects-img:hover img {

  opacity: 0.3;

}

.homeProjects-img:hover figcaption h2 {

  opacity: 1;

  -webkit-transform: translate3d(0%, 0%, 0);

  transform: translate3d(0%, 0%, 0);

  -webkit-transition-delay: 0.4s;

  transition-delay: 0.4s;

}

.homeProjects-img:hover figcaption p {

  opacity: 0.9;

  -webkit-transform: translate3d(0%, 0%, 0);

  transform: translate3d(0%, 0%, 0);

  -webkit-transition-delay: 0.6s;

  transition-delay: 0.6s;

}

.homeProjects-img:hover figcaption a {

  opacity: 1;

  color: var(--primaryColor);

  -webkit-transform: translate3d(0%, 0%, 0);

  transform: translate3d(0%, 0%, 0);

  -webkit-transition-delay: 0.6s;

  transition-delay: 0.6s;

}

.homeProjects-img:hover figcaption::before {

  background: rgba(255, 255, 255, 0);

  background: rgba(0, 0, 0, 0.6);

  left: 30px;

  opacity: 1;

  -webkit-transition-delay: 0s;

  transition-delay: 0s;

}

/* Home Projects End */

/* Home Contact Start */

.homeContact {

  padding-bottom: 80px;

}

.homeContact-box {

  margin: 12px 0;

  display: flex;

  align-items: center;

}

.homeContact-box img {

  width: 70px;

  margin-right: 20px;

}

.homeContact-box h4 {

  margin-top: 5px;

  margin-bottom: 0;

  font-size: 17px;

  font-weight: 400;

  color: var(--primaryColor);

}

.homeContact-box h4 span {

  color: #fff;

}

.homeContact-box a, .homeContact-box p {

  color: #fff;

  font-weight: 500;

  font-size: 24px;

}

/* Home Contact End */

/* Location Start */

.homeLocation-row {

  display: flex;

}

.homeLocation-row-img {

  position: relative;

}

.homeLocation-row-img::before {

  position: absolute;

  content: '';

  background: rgb(236 20 90 / 60%);

  left: 0;

  top: 0;

  bottom: 0;

  width: 50%;

}

.homeLocation-row img {

  width: 100%;

}

.homeLocation-row h4 {

  position: absolute;

  bottom: 10%;

  left: 14%;

  color: #fff;

  font-size: 38px;

  font-weight: 700;

}

.homeLocation-row h4 span {

  display: block;

}

/* Location End */

/* Footer Start */

footer {

  background: var(--themeBg);

  padding: 60px 0 0 0;

  position: relative;

}

footer p {

  font-size: 18px;

  line-height: 1.8;

  max-width: 75%;

}

footer a {

  color: #fff;

  transition: all .6s ease 0s;

}

footer p a {

  font-size: 20px;

}

footer a:hover {

  color: var(--primaryColor);

}

footer h4 {

  color: #fff;

}

.footerAddress {

  border-bottom: 1px solid rgb(59 64 99 / 60%);

  padding: 35px 0 20px 0;

}

.footerSocial {

  padding: 35px 0;

}

.footerSocial img {

  width: 45px;

  margin-right: 10px;

  transition: all .1s ease 0s;

}

.footerSocial img:hover {

  opacity: .8;

  width: 42px;

}

.footerCopy p {

  font-size: 18px;

  color: var(--primaryColor);

  padding-top: 30px;

}

.footerCopy-web {

  display: flex;

  justify-content: flex-start;

}

.footerCopy-web a { 

  border: 1px solid #3B4063;

  padding: 5px 25px;

  margin: 0px 5px 12px 5px;

  font-size: 14px;

}

.footerCopy-link {

  display: flex;

  justify-content: flex-end;

  text-align: end;

}

.footerCopy-link a { 

  margin: 28px 0 25px 22px;

}

.footerCopy-link a img { 

  width: 40px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.footerCopy-link a:hover img { 

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

}

/* Footer End */

/* Inner Slider Start */

.innerSlider {

  margin-top: 98px;

  position: relative;

}

.innerSlider::after {

  content: '';

  display: block;

  height: 165px;

  position: absolute;

  width: 44%;

  top: 0;

  opacity: 1;

  right: 0;

  z-index: 0;

  background-image: url(../img/slider-bg.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.innerSlider::before {

  content: '';

  display: block;

  height: 150px;

  position: absolute;

  width: 400px;

  top: 125px;

  opacity: 1;

  left: -100px;

  z-index: 1;

  transform: rotate(270deg);

/*  background-image: url(../img/katch-bg.svg);*/

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.innerSlider img {

  height: 380px;

  object-fit: cover;

  object-position: center;

}

.innerSlider-box {

  position: relative;

}

.innerSlider h1 {

  font-size: 70px;

  color: #fff;

  line-height: 1.1;

  /* text-shadow: 0 1px #ddd; */

  font-weight: 800;

  text-transform: uppercase;

  position: absolute;

  bottom: -74px;

  left: 5%;

  z-index: 1;

}

.innerSlider h1 span {

  color: var(--primaryColor);

  display: block;

}

/* Inner Slider End */

/* Inner Service Start */

.innerServices {

  padding: 120px 0 95px 0;

}

.innerServices aside > ol,

.innerServices aside > ul,

.innerServices aside > .sidebarRight_Sticky {

  position: sticky;

  top: 120px;

}



.sidebarRight_Sticky{

  padding-left: 15%;

}



.sidebarRight h6 {

  color: #fff;

  font-size: 18px;

  font-weight: 400;

  background: var(--primaryColor);

  padding: 8px 14px;

  width: 90%;

}



.sidebarRight ul{

  margin: 0px;

  padding: 0px;

}



.sidebarRight li {

  list-style: none;

  border-bottom: 1px solid rgb(59 64 99 / 60%);

  padding: 12px 0 8px 0;

  width: 90%;

  transition: all ease-out .5s;

}

.sidebarRight li a {

  color: var(--pColor);

}

.sidebarRight li a:hover {

  color: #fff;

}

.sidebarRight li .active {

  color: #fff;

}

.innerServices-tab {

  background-color: #060a16;

  margin-top: 45px;

}

.innerServices .nav-tabs,

.katch_services_tab .vc_tta-tabs-list {

  border-bottom: 2px solid #3B4063

}



.katch_services_tab{

  background: #060a16;  

}





.katch_services_tab .vc_tta-tabs-list{

  display: flex !important;

}



.innerServices-tab .tab-content,

.katch_services_tab .vc_tta-panels-container {

  padding: 30px 40px 20px 40px;

}

.innerServices .nav-fill .nav-item .nav-link, 

.innerServices .nav-justified .nav-item .nav-link,

.katch_services_tab .vc_tta-tabs-list a  {

  color: #fff !important;

  font-size: 16px;

  font-weight: 400;

  padding: 10px 10px !important;

  letter-spacing: .5px;

  border: none !important;

  background: transparent;

  transition: all ease-out .5s;

  background-color: transparent !important;

}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active,

.katch_services_tab .vc_tta-tabs-list .vc_tta-tab.vc_active a{

  color: var(--primaryColor) !important;

  border: none;

  background: transparent;

}

.nav-tabs .nav-item .nav-link:hover {

  color: var(--primaryColor) !important;

  border: none !important;

  background: transparent;

}



.katch_services_tab .vc_tta-tabs-list .vc_tta-tab {

    flex: 1 1 auto;

    text-align: center;

}



.innerServices-ul {

  margin-left: -32px;

}

.innerServices-ul li {

  list-style: none;

  padding-bottom: 15px;

}



        /* Custom Menu Styling */

        .katch_services_tab ul.innerServices-ul,

        .katch_services_tab ul.innnerworkProjects-ul {

            list-style: none; /* Remove default bullet points */

            padding: 0; /* Remove default padding */

            margin: 0px;

        }



        .katch_services_tab .innerServices-ul li,

        .katch_services_tab ul.innnerworkProjects-ul li {

            position: relative; /* Required for positioning the dash */

            padding-left: 20px; /* Space for the dash */

        }



        .katch_services_tab .innerServices-ul li::before,

        .katch_services_tab ul.innnerworkProjects-ul li::before {

            content: "-"; /* The dash */

            position: absolute; /* Position it absolutely */

            left: 0; /* Align it to the left of the list item */

            color: var(--primaryColor); /* Color of the dash, change as needed */

        }



.innerServices-ul li span {

  color: var(--primaryColor);

}

.relatedPro .hover {

  overflow: hidden;

  position: relative;

  padding-bottom: 60%;

}

.relatedPro {

  padding-bottom: 85px;

}

.relatedPro h2 {

  padding-bottom: 20px;

}

.relatedPro-box img {

  margin: 15px 0;

}

.relatedPro .hover-overlay {

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 90;

  transition: all 0.4s;

}

.relatedPro .hover img {

  width: 100%;

  position: absolute;

  top: 0;

  left: 0;

  transition: all 0.3s;

}

.relatedPro .hover-content {

  position: relative;

  z-index: 99;

}

.relatedPro .hover-1 img {

  width: 105%;

  height: 250px;

  object-fit: cover;

  object-position: center;

  position: absolute;

  top: 0;

  left: -5%;

  transition: all 0.3s;

}

.relatedPro .hover-1-content {

  position: absolute;

  bottom: 0;

  left: 0;

  z-index: 99;

  transition: all 0.4s;

}.relatedPro .hover-1 .hover-overlay {

  background: rgba(0, 0, 0, 0.5);

}

.relatedPro .hover-1:hover .hover-1-content {

  bottom: 2rem;

  width: 100%;

  background: rgba(176, 15, 15, 0.8);

}

.relatedPro h3 {

  font-size: 24px;

  font-weight: 500;

  line-height: 1.4;

  margin-bottom: 0;

  color: var(--pColor);

  text-transform: uppercase;

}

.relatedPro h3 span {

  display: block;

}

.relatedPro .hover-1:hover h3 {

  color: #fff;

}

/* Inner Service End */

/* Inner Client Start */

.innerClient {

  padding: 140px 0 80px 0;

}

.innerClient-box {

  padding: 25px;

  margin: 15px 0;

  text-align: center;

  border: 1px solid #3B4063;

}

.innerClient-box img {

  margin-bottom: 15px;

}

.innerClient-box h4 {

  color: #ec145a94;

  font-size: 22px;

}

/* inner Client End */

/* Inner Work Start */

.innerWork {

  padding: 140px 0 80px 0;

}

.innerWork-box {

  position: relative;

  padding: 25px;

  margin: 15px 0;

  background-color: #060a16;

}

.innerWork-box h4 {

  font-size: 20px;

  color: #fff;

  font-weight: 600;

  padding-top: 16px;

  margin-bottom: 0;

  position: relative;

  text-transform: uppercase;

}

.innerWork-box h4::before {

  content: '';

  position: absolute;

  bottom: 0;

  text-align: center;

  height: 2px;

  width: 50px;

  margin: -3px auto;

  background: var(--primaryColor);

}

.innerWork-box .seeMore {

  position: absolute;

  top: 35px;

  right: 35px;

  width: 55px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.innerWork-box:hover .seeMore {

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

}

.innnerworkSlider {

  margin-top: 88px;

  position: relative;

}

.innnerworkSlider::before {

  content: '';

  display: block;

  height: 150px;

  position: absolute;

  width: 400px;

  top: 125px;

  opacity: 1;

  left: -100px;

  z-index: 1;

  transform: rotate(270deg);

  background-image: url(../img/katch-bg.svg);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.innnerworkSlider::after {

  content: '';

  display: block;

  height: 165px;

  position: absolute;

  width: 44%;

  top: 0;

  opacity: 1;

  right: 0;

  z-index: 0;

  background-image: url(../img/slider-bg.png);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.innnerworkSlider-box {

  position: relative;

}

.innnerworkSlider img {

  height: 380px;

  object-fit: cover;

  object-position: center;

}

.innnerworkSlider h1 {

  font-size: 70px;

  color: #fff;

  line-height: 1.1;

  font-weight: 800;

  text-transform: uppercase;

  position: absolute;

  bottom: -65px;

  left: 11.5%;

  z-index: 1;

}

.innnerworkSlider h1 span {

  color: var(--primaryColor);

  display: block;

}

.innnerworkSlider .slick-prev, .innnerworkSlider .slick-prev:hover {

  display: none !important;

}

.innnerworkSlider .slick-next, .innnerworkSlider .slick-next:hover {

  display: none !important;

}

.innnerworkSlider .element img {

  border: 10px solid #0B0D19;

  width: 100%;

  object-fit: cover;

  object-position: center;

}

.innnerworkProjects {

  padding: 120px 0 95px 0;

}

.innnerworkProjects-title {

  position: sticky;

  top: 120px;

  padding-top: 25px;

  border: 1px solid rgb(59 64 99 / 60%);

}

.innnerworkProjects-right h6 {

  color: var(--primaryColor);

  text-transform: uppercase;

  font-size: 18px;

  font-weight: 500;

  padding-left: 20px;

}

.innnerworkProjects-right p {

  color: #fff;

  padding-left: 20px;

}

.innnerworkProjects-right hr {

  border-top: 2px solid rgb(59 64 99 / 90%);

}

.innnerworkProjects-tab {

  background-color: #060a16;

}

.innnerworkProjects .nav-tabs {

  border-bottom: 2px solid #3B4063

}

.innnerworkProjects-tab .tab-content {

  padding: 30px 40px 20px 40px;

}

.innnerworkProjects .nav-fill .nav-item .nav-link, .innnerworkProjects .nav-justified .nav-item .nav-link {

  color: #fff;

  font-size: 16px;

  font-weight: 400;

  padding: 10px 10px;

  letter-spacing: .5px;

  border: none;

  background: transparent;

  transition: all ease-out .5s;

}

.innnerworkProjects .nav-tabs .innnerworkProjects .nav-item.show .nav-link, .innnerworkProjects .nav-tabs .nav-link.active {

  color: var(--primaryColor) !important;

  border: none;

  background: transparent;

}

.innnerworkProjects .nav-tabs .nav-item .nav-link:hover {

  color: var(--primaryColor) !important;

  border: none !important;

  background: transparent;

}

.innnerworkProjects-ul li {

  list-style: none;

  padding-bottom: 15px;

}

.innnerworkProjects-ul li span {

  color: var(--primaryColor);

}

/* Inner Work End */

/* Our Blog Start */

.innerBlog {

  padding: 120px 0 80px 0;

}

.innerBlog-box {

  position: relative;

  padding: 25px;

  margin: 15px 0;

  background-color: #060a16;

}

.innerBlog-box h4 {

  font-size: 20px;

  color: #fff;

  font-weight: 500;

  padding-top: 16px;

  margin-bottom: 0;

  position: relative;

  line-height: 1.4;

  overflow: hidden;

   display: -webkit-box;

   -webkit-line-clamp: 2; 

           line-clamp: 2; 

   -webkit-box-orient: vertical;



}

.innerBlog-box h5 {

  color: var(--primaryColor);

  font-weight: 300;

  font-size: 16px;

  padding-top: 10px;

  font-weight: 300;

  width: 90%;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 1;

  line-clamp: 1;

  -webkit-box-orient: vertical;

}





.innerBlog-box h5 a{

  color: var(--primaryColor);

}



.innerBlog-box h5 span {

  display: block;  

}

.innerBlog-box .date {

  padding-bottom: 6px;

  font-size: 14px;

  color: var(--pColor);

  font-weight: 400;

  opacity: 0.5;

}

.innerBlog-box h6 {

  color: #fff;

  text-align: end;

}

.innerBlog-box p {

  color: var(--pColor);

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  line-clamp: 3;

  -webkit-box-orient: vertical;

}

.innerBlog .seeMore {

  position: absolute;

  top: 35px;

  right: 35px;

  width: 55px;

  -webkit-transition: all 0.3s ease-in-out;

	-moz-transition: all 0.3s ease-in-out;

	-ms-transition: all 0.3s ease-in-out;

	-o-transition: all 0.3s ease-in-out;

	transition: all 0.3s ease-in-out;

}

.innerBlog-box:hover .seeMore {

  -webkit-transform: scale(1.2);

	-moz-transform: scale(1.2);

	-ms-transform: scale(1.2);

	-o-transform: scale(1.2);

	transform: scale(1.2); 

}

/* Our Blog End */

/* Blog Detaile Page Start */

.blogDetaile {

  padding: 120px 0 95px 0;

}

.blogDetaile h2 {

  color: var(--primaryColor);

  font-size: 24px;

  padding-bottom: 10px;

}

.blogDetaile h4 {

  color: #fff;

  font-size: 20px;

  font-weight: 400;

  padding-top: 15px;

  padding-bottom: 10px;

}

.blogDetaile h5 {

  font-size: 16px;

  font-weight: 400;

  padding-bottom: 6px;

}



.blogDetaile h5 a{

  color: #fff;

}



.blogDetaile .date {

  padding-bottom: 6px;

  font-size: 14px;

  color: var(--pColor);

  font-weight: 400;

  opacity: 0.5;

}

.blogDetaile h6 {

  color: #fff;

  font-size: 17px;

  padding-bottom: 15px;

  font-weight: 300;

}

.blogDetaile img {

  padding-bottom: 25px;

}

.blogDetaile a {

  opacity: 0.6;

  font-weight: 400;

  color: var(--primaryColor);

}

.blogDetaile a:hover {

  opacity: 1;

}

.blogDetaile aside > ol,

.blogDetaile aside > ul,

.sidebarRight .sidebarRight_Sticky{

  position: sticky;

  top: 120px;

}

.blogDetaile .sidebarRight h6 {

  text-align: left;

  color: #fff;

  font-size: 18px;

  font-weight: 400;

  background: var(--primaryColor);

  padding: 8px 14px;

  width: 90%;

}

.blogDetaile .sidebarRight li {

  font-size: 14px;

  list-style: none;

  border-bottom: 1px solid rgb(59 64 99 / 60%);

  padding: 12px 0 5px 0;

  width: 90%;  

}

.blogDetaile .sidebarRight li a {

  opacity: 1;

  line-height: 2;

  transition: all ease-out .5s;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 2;

  line-clamp: 2;

  -webkit-box-orient: vertical;

}

.blogDetaile .sidebarRight li a:hover {

  color: #fff;

}

.blogDetaile .sidebarRight li .date {

  font-size: 13px;

  color: var(--pColor);

  font-weight: 400;

  opacity: 0.5;

  padding-top: 5px;

  text-align: end;

}



/* Blog Detaile Page End */

/* Inner Contact Form Start */

.innerContact {

  margin: 120px 0 85px 0;

}

.innerContact-form {

  padding: 40px;

  background-color: #060a16;

}

.innerContact-form h2 {

  color: #fff;

  font-size: 42px;

  padding-bottom: 15px;

}

.innerContact-form input, .innerContact-form input:focus, .innerContact-form textarea, .innerContact-form textarea:focus {

  color: #fff;

  margin-bottom: 20px;

  padding: 10px 0;

  background: none;

  box-shadow: none;

  border: none;

  border-radius: 0;

  border-bottom: 1px solid #3B4063;

}

.innerContact ::placeholder {

  color: #272b45;

  opacity: .8; 

}

.innerContact ::-ms-input-placeholder {  

  color: #272b45;

}

/* Inner Contact Form End */

@media screen and (min-device-width: 300px) and (max-device-width: 568px) { 

  .homeLocation-row {

    display: flex;

    flex-wrap: wrap;

  }

  .navbar {

    background: rgb(11 13 25 / 98%);    

    z-index: 10;

  }

  .navbar-expand-lg .navbar-nav .nav-link {

    padding: 8px 0;

  }

  .topBtn {

    padding-left: 0px;

    margin-top: -22px;

    margin-bottom: 20px;

  }

  .modernSlider .caption h1,

  .modernSlider .caption h2 {

    font-size: 40px;

  }

  .modernSlider .caption img {

    width: 60px;

    margin-left: 15px;

  }

  .homeSlider .img-fill {

    height: 500px;

  }

  .vertical-dots li {

    display: none;

  }

  .homeAbout p {

    max-width: 100%;

  }

  .homeServices-row {

    position: relative;

    width: 100%;

  }

  .homeServices .cap {

    position: initial;

    padding-bottom: 40px;

  }

  .homeServices .cap p {

    margin-top: 8%;

  }

  .homeServices .cap h3 {

    font-size: 50px;

    margin-bottom: 10px;

  }

  .homeServices .cap a img {

    width: 55px;

  }

  .homeClient-box {

    border: none;

  }

  .homeProjects-img:hover figcaption p {

    display: none;

  }

  .innerSlider-box img {

    height: 225px;

    object-fit: cover;

    object-position: center;

  }

  .innerSlider h1 {

    font-size: 45px;

    bottom: -48px;

    left: 8%;

  }

  .sidebarRight {

    display: none;

  }

  .innerSlider::before {

    display: none;

  }

}

@media screen and (min-device-width: 570px) and (max-device-width: 768px) { 

  .navbar {

    background: rgb(11 13 25 / 98%);

    z-index: 10;

  }

  .navbar-expand-lg .navbar-nav .nav-link {

    padding: 8px 0;

  }

  .topBtn {

    padding-left: 0px;

    margin-top: -22px;

    margin-bottom: 20px;

  }

  .vertical-dots {

    left: -1.5%;

  }

  .homeServices-row {

    position: relative;

    width: 100%;

  }

  .homeProjects-img:hover figcaption p {

    display: none;

  }

  .homeProjects-img a {

    padding: 3px 10px;

  }

  .seemoreProjects {

    padding-bottom: 6%;

    padding-top: 0;

  }

  .innerSlider-box img {

    height: 275px;

    object-fit: cover;

    object-position: center;

  }

  .innerSlider h1 {

    font-size: 58px;

    bottom: -61px;

    left: 6%;

  }

  .sidebarRight {

    display: none;

  }

  .innerSlider::before {

    content: '';

    display: block;

    height: 70px;

    position: absolute;

    width: 300px;

    top: 125px;

  }

}

@media screen and (min-device-width: 900px) and (max-device-width: 1024px) { 

  .vertical-dots {

    left: -1.5%;

  }

  .modernSlider .caption h1,

  .modernSlider .caption h2 {

    font-size: 45px;

  }

  .modernSlider .caption img {

    width: 65px;

    margin-left: 15px;

  }

  .homeServices .cap p {

    margin-top: 0;

  }

  .homeServices .cap h3 {

    margin-bottom: 15px;

  }

  .homeServices .cap a img {

    width: 55px;

  }

  .homeProjects-img:hover figcaption p {

    display: none;

  }

  .homeProjects-img a {

    padding: 3px 10px;

  }

  .innerSlider::before {

    content: '';

    display: block;

    height: 115px;

    position: absolute;

    width: 320px;

    top: 100px;

  }

}

@media screen and (min-device-width: 900px) { 

  .dropdown-menu {

    display: block;

    opacity: 0;

    visibility: hidden;

    transform: translateY(20%);

    transition: all .5s;

  }

  .dropdown:hover .dropdown-menu{

    opacity: 1;

    visibility: visible;

    transform: translateY(0%);

  }

}