:root{
    ---primery-color: #fe2a5c;
    --small-nav: #0b0c26;
    --main-color: #ffff;
	---black: #000;
	--service-dtx: #fff6eb;
	---s-a: #faf1cf;
	---s-b: #f7cece;
	---s-c: #daf8ec;
	----s--dtc: #ced3fd;
	---s--ftx: #c6fcbb;
}
.service-b{
background-color: var(---s-b) !important;
}
.service-c{
background-color: var(---s-c) !important;
}
.service-dtc{
background-color: var(----s--dtc) !important;
}
.service-ftx{
background-color: var(---s--ftx) !important;
}
.fix-image{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.fix-set{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
header{
 position: fixed;
 right: 0;
 left: 0;
 top: 0;
 z-index: 998;
 background-color: white;

}
.nav-mail {
	max-width: 25%;
	width: 100%;
	background-color: var(---primery-color);
	padding: 7px 0 7px 112px;
	gap: 10px;
}
.nav-network {
	max-width: 75%;
	width: 100%;
	background-color: var(--small-nav);
	padding: 7px 112px 7px 0px;
	justify-content: end;
    gap: 15px;
}
.tfc-coin {
	border: 2px solid var( --main-color);
	width: 22px;
	height: 22px;
	display: grid;
	place-items: center;
	border-radius: 100px;
}
.tfc-coin i {
	font-size: 10px;
	color: var(--main-color);
}
.nav-mail p{
    font-size: 12px;
    color: var(--main-color);
}
/* social-icon-hover-code ----start---- */
/* 
.nav-network a:hover .tfc-coin{
    border: 1px solid red;
}
.nav-network a:hover .tfc-coin i{
  color: yellow;
} */

/* -----end------ */

/********* main-nav-css *********/
.navbar-nav {
	gap: 30px;
	margin-right: 30px;
}
.navbar-nav li a{
    font-family: 'Arial', sans-serif;
    font-weight: 600; 
    gap: 15px;  
    color: rgb(87, 86, 86) !important;                                      
}

.navbar-nav li a:hover{
    color: var(---primery-color) !important;
}
/* 
.nav-link.active {

  } */
.contact-btn {
	background-color: var(---primery-color);
	display: flex;
	padding: 11px 16px;
	border-radius: 6px;
    align-items: center;
    gap: 7px;
}
.contact-btn p{
    font-size: 12px;
    color: var(--main-color);
}
/***********herobanner************/
.banner-text {
	padding: 50px 0;
}
.herobanner{
    width: 100%;
	background-image: url(images/bg1.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 100px 0;
}
.set-gif-animton{
	width: 100%;
}
.banner-text h2 {
	font-size: 55px;
	font-weight: 600;
	color: var(---black);
	font-family: 'Arial', sans-serif;
	margin-bottom: 25px;
}
.banner-text h2 span{
color: var(---primery-color);
}
.banner-text p i{
	font-size: 16px;
	font-family: 'Arial', sans-serif;
	color: var(---black);
}
.tfc-contact-btn {
	display: inline-block;
	background: var(---primery-color);
	padding: 10px 30px;
	color: var(--main-color);
	border-radius: 5px;
}
.tfc-contact-btn:hover{
	color: var(--main-color);
}
.btn-pfx {
	margin: 30px 0px 15px 0;
}
/**********************service-section-css *******************/
.tfc-service-section{
	background-color: var(--service-dtx);
	padding: 120px 0;

}
.fes-service-dtxc {
	background-color: var(--main-color);
	padding: 40px;
}
.fes-service-dtxc h4{
	color: var(---primery-color);
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 8px;
}
.fes-service-dtxc h2{
	font-size: 30px;
	font-weight: 600;
	color: var(---black);
}
.tfc-service-point {
	position: relative;
	padding: 0 0px 0 25px;
}
.tfc-service-point::after{
	content: " ";
	border: 1px solid #d6d2d2;
	position: absolute;
	left: 0;
	bottom: 0;
	top: 0;
	margin-right: 5px;

}
.service-box h3{
	font-size: 20px;
	font-weight: 600;
	color: var(---black);
	margin: 20px 0 5px 0;
}
.service-box p{
	font-size: 14px;
	color: var(---black);
}
.color-circle-box{
	width: 50px;
	height: 50px;
	border-radius: 100%;
	background-color: var(---s-a);
	position: relative;
}
.service-logo-image {
	width: 43px;
	height: 43px;
	position: absolute;
	top: 18%;
	left: 29%;
}

/*********why-choose-us-section***********/
.tfc-choose-us {
	padding: 140px 0 50px 0px;
	/* border: 1px solid red; */
}
.choose-image-box{
	position: relative;
}

.rocket-image {
	/* border: 1px solid red; */
	width: 70px;
	height: 180px;
	position: absolute;
	bottom: 270px;
	right: 138px;
	animation: fly 6s .3s ease-in infinite;
}
@keyframes fly {
    0% {
        bottom: 270px;
    }

    100% {
     bottom: 100%;
    }
}
.why-choose-text {
    padding: 0 0 0 45px;
}
.why-choose-text h3, .fes-main-text-step h3{
	font-size: 16px;
	font-weight: 600;
	color: var(---primery-color);
	margin-bottom: 10px;
}
.why-choose-text h2, .fes-main-text-step h2{
	font-size: 26px;
	font-weight: 600;
	color: var(---black);
	margin-bottom: 10px;
}
.why-choose-text p{
	font-size: 15px;
	color: var(---black);
	margin-bottom: 10px;
}


/************ <!-- step-follow --> **************/
.tfc-step-follow {
    padding: 120px 0 70px 0;
}
.fes-main-text-step {
    max-width: 400px;
    width: 100%;
    margin: 0 auto 140px;
}
.tfc-bg-image-step{
	background-image: url(images/arrow.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.fes-round-c {
    max-width: 1100px;
    margin: 0 auto;
    width: 100%;
    padding: 18px 0;
}
.round-f-step {
    border: 4px solid #d9dada;
    width: 220px;
    height: 220px;
    display: grid;
    border-radius: 100%;
    margin: 0 auto;
    background-color: var(--main-color);
    place-items: baseline;
}
.tfc-round-down{
	margin-top: 40px !important;
}
.count-val-tfc {
    width: 55px;
    height: 55px;
    border-radius: 100px;
    display: grid;
    place-items: center;
    background-color: var(---primery-color);
    font-size: 25px;
    font-weight: 600;
	color: var(--main-color);
}
.round-f-step:hover{
	border: 4px solid var(---primery-color);
}
.round-f-step:hover> .count-val-tfc{
	background-color: #0b0c26;
}
.round-f-step:hover> .round-inner-text h2{
	color:var(---primery-color);
}

.round-inner-text h2{
	font-size: 19px;
	font-weight: 600;
	color: var(---black);
	margin-bottom: 6px;
}
.round-inner-text p{
	font-size: 14px;
	font-weight: 500;
	color: #7a7575;
	margin-bottom: 10px;
}

.round-inner-text {
    margin-top: -10px;
}

/************* footer-css *************/

  .pg-footer {
	font-family: 'Poppins', sans-serif;
  }
  
  
  .footer {
	  background-color: #0b0c26;
	  color: #fff;
  }
  .footer-wave-svg {
	  background-color: transparent;
	  display: block;
	  height: 30px;
	  position: relative;
	  top: -1px;
	  width: 100%;
  }
  .footer-wave-path {
	  fill: #fffff2;
  }
  
  .footer-content {
	padding: 40px 15px 100px !important;
	position: relative;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
}

  .footer-logo-link {
	  display: inline-block;
  }
  .footer-menu {
	  margin-top: 30px;
  }
  
  .footer-menu-name {
	color: #fffff2;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .1em;
	line-height: 18px;
	margin-bottom: 0;
	margin-top: 0;
	text-transform: uppercase;
}
  .footer-menu-list {
	  list-style: none;
	  margin-bottom: 0;
	  margin-top: 10px;
	  padding-left: 0;
  }
  .footer-menu-list li {
	  margin-top: 5px;
  }
  
  .button:last-of-type {
	  margin-right: 0;
  }

  .footer-menu-list li a{
	color: var(--main-color);
	font-size: 15px;
  }
  .footer-menu p {
	color: var(--main-color);
	font-size: 15px;
	padding-right: 100px;
}

.navbar-brands{
	width: 260px;
	display: block;
}

  .footer-social-links {
	  bottom: 0;
	  height: 54px;
	  position: absolute;
	  right: 0;
	  width: 236px;
  }
  
  .footer-social-amoeba-svg {
	  height: 54px;
	  left: 0;
	  display: block;
	  position: absolute;
	  top: 0;
	  width: 236px;
  }
  
  .footer-social-amoeba-path {
	  fill: #027b9a;
  }
  
  .footer-social-link.linkedin {
	  height: 26px;
	  left: 9px;
	  top: 14px;
	  width: 26px;
	  color: white;
	  font-size: 18px;
  }
  
  .footer-social-link {
	  display: block;
	  padding: 10px;
	  position: absolute;
  }
  
  .hidden-link-text {
	  position: absolute;
	  clip: rect(1px 1px 1px 1px);
	  clip: rect(1px,1px,1px,1px);
	  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
	  clip-path: inset(0px 0px 99.9% 99.9%);
	  overflow: hidden;
	  height: 1px;
	  width: 1px;
	  padding: 0;
	  border: 0;
	  top: 50%;
  }
  
  .footer-social-icon-svg {
	  display: block;
  }
  
  .footer-social-link.twitter {
    height: 28px;
    left: 63px;
    top: -1px;
    width: 28px;
    font-size: 23px;
    color: white;
}
  
.footer-social-link.youtube {
    height: 24px;
    left: 126px;
    top: 12px;
    width: 24px;
    color: white;
    font-size: 19px;
}
  
.footer-social-link.github {
	height: 34px;
	left: 180px;
	top: 5px;
	width: 34px;
	color: white;
	font-size: 22px;
}
  
  .footer-copyright {
	  background-color: #027b9a;
	  color: #fff;
	  padding: 15px 30px;
	text-align: center;
  }
  
  .footer-copyright-wrapper {
	  margin-left: auto;
	  margin-right: auto;
	  max-width: 1200px;
  }
  
  .footer-copyright-text {
	color: #fff;
	  font-size: 13px;
	  font-weight: 400;
	  line-height: 18px;
	  margin-bottom: 0;
	  margin-top: 0;
  }
  
  .footer-copyright-link {
	  color: #fff;
	  text-decoration: none;
  }

  .tfc-footer-icon-touch {
	margin-top: 10px;
}
  
.fes-box-icon-footer {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin-top: 5px;
}

.fes-box-icon-footer h5{
	font-size: 15px;
	color: var(--main-color);
}
  /* Media Query For different screens */
  @media (min-width:320px) and (max-width:479px)  { /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
	.footer-content {
	  padding: 40px 15px 1050px;
	  position: relative;
	}
  }
  @media (min-width:480px) and (max-width:599px)  { /* smartphones, Android phones, landscape iPhone */
	.footer-content {
	  padding: 40px 15px 1050px;
	  position: relative;
	}
  }
  @media (min-width:600px) and (max-width: 800px)  { /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */
	.footer-content {
	  padding: 40px 15px 1050px;
	  position: relative;
	}
  } 
  @media (min-width: 760px) {
	.footer-content {
		padding: 40px 15px 450px;
		position: relative;
	}
  
	.footer-wave-svg {
		height: 50px;
	}
  
  }

/********************** about page css *********************/
 
.about-section {
	padding: 160px 0 80px 0;
}

.tfx-show-head {
	width: 100%;
	height: 500px;
	display: grid;
	place-items: center;
	background-image: url(images/ab2.jpeg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.fes-about-text-header-line{
	border-left: 2px solid var(--main-color);
	border-bottom: 2px solid var(--main-color);
	width: 300px;
	height: 250px;
	position: relative;
}
.fes-about-text-header-line h2{
	position: absolute;
	bottom: 20px;
	left: 30px;
	font-size: 35px;
	font-weight: 600;
	color: var(--main-color);
}
.dtx-small-img{
	width: 100%;
	height: 140px;
}
.dtx-about-text p{
	font-size: 14px;
	font-weight: 600;
	color: #5e5757;
	margin-bottom: 10px;
}
.dtx-about-text h2{
	font-size: 30px;
	font-weight: 700;
	color: #5e5757;
	margin-bottom: 30px;
}
.dtx-team p {
	font-size: 15px;
	color: #5e5757;
	margin-bottom: 40px;
}
.d-approch-tfc-box {
	gap: 20px;
	/* border: 1px solid red; */
}
.tfc-colbrate {
	display: grid;
	grid-template-columns: 1fr 5fr;
	gap: 10px;
	width: 50%;
}
.dtx-colbrate-image {
	width: 45px;
}
.dtx-colbrate-text h3 {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 4px;
	color: #5e5757;
}

.tfc-about-space-dtx{
margin-top: 30px !important;
}
.dtx-colbrate-text p{
	font-size: 13px;
	color: #5e5757;
}

/********** service-page-css **********/
/* .feat{
	padding: 160px 0 80px 0;
} */
.section-head {
	padding: 160px 0 80px 0;
  }
  .section-head h4 {
	position: relative;
	padding:0;
	color:var(---primery-color);
	line-height: 1;
	letter-spacing:0.3px;
	font-size: 34px;
	font-weight: 700;  
	text-align:center;
	text-transform:none;
	margin-bottom:30px;
  }
  .section-head h4:before {
	content: '';
	width: 60px;
	height: 3px;
	background: var(---primery-color);
	position: absolute;
	left: 0px;
	bottom: -10px;
	right:0;  
	margin:0 auto;
  }
  .section-head h4 span {
	font-weight: 700;
	padding-bottom: 5px;
	color:#2f2f2f
  }
  p.service_text{
	color:#cccccc !important;
	font-size:16px;
	line-height:28px;
	text-align:center;    
  }
  .section-head p, p.awesome_line{
	color:#818181;
	font-size:16px;
	line-height:28px;
	text-align:center;  
  }
  
  .extra-text {
	  font-size:34px;
	  font-weight: 700;
	  color:#2f2f2f;
	  margin-bottom: 25px;
	  position:relative;
	  text-transform: none;
  }
  .extra-text::before {
	  content: '';
	  width: 60px;
	  height: 3px;
	  background: var(---primery-color);
	  position: absolute;
	  left: 0px;
	  bottom: -10px;
	  right: 0;
	  margin: 0 auto;
  }
  .extra-text span {
	  font-weight: 700;
	  color:var(---primery-color);
  }
  .dtx-item {
	background: #fff;
	text-align: center;
	padding: 30px 25px;
	-webkit-box-shadow: 0 0px 25px rgba(0, 0, 0, 0.07);
	box-shadow: 0 0px 25px rgba(0, 0, 0, 0.07);
	border-radius: 20px;
	border: 5px solid rgba(0, 0, 0, 0.07);
	margin-bottom: 30px;
	-webkit-transition: all .5s ease 0;
	transition: all .5s ease 0;
	transition: all 0.5s ease 0s;

	height: 320px;
}
  .dtx-item:hover{
	  background:var(---primery-color);
	  box-shadow:0 8px 20px 0px rgba(0, 0, 0, 0.2);
	  -webkit-transition: all .5s ease 0;
	  transition: all .5s ease 0;
	  transition: all 0.5s ease 0s;
  }
  .dtx-item:hover .dtx-item, .dtx-item:hover span.icon{
	  background:#fff;
	  border-radius:10px;
	  -webkit-transition: all .5s ease 0;
	  transition: all .5s ease 0;
	  transition: all 0.5s ease 0s;
  }
  .dtx-item:hover h6, .dtx-item:hover p{
	  color:#fff;
	  -webkit-transition: all .5s ease 0;
	  transition: all .5s ease 0;
	  transition: all 0.5s ease 0s;
  }
  .dtx-item .icon {
	font-size: 40px;
	width: 90px;
	height: 90px;
	border-radius: 100px;
	display: grid;
	place-items: center;
	margin: 0 auto;
	line-height: 0;
}
  .dtx-item .feature_box_col_one{
	  background:rgba(247, 198, 5, 0.20);
	  color:var(---primery-color)
  }
  .dtx-item .feature_box_col_two{
	  background:rgba(255, 77, 28, 0.15);
	  color:var(---primery-color)
  }
  .dtx-item .feature_box_col_three{
	  background:rgba(0, 147, 38, 0.15);
	  color:var(---primery-color)
  }
  .dtx-item .feature_box_col_four{
	  background:rgba(0, 108, 255, 0.15);
	  color:var(---primery-color)
  }
  .dtx-item .feature_box_col_five{
	  background:rgba(146, 39, 255, 0.15);
	  color:var(---primery-color)
  }
  .dtx-item .feature_box_col_six{
	  background:rgba(23, 39, 246, 0.15);
	  color:var(---primery-color)
  }
  .dtx-item p{
	  font-size:15px;
	  line-height:26px;
  }
  .dtx-item h6 {
	margin: 20px 0;
	color: #2f2f2f;
}
  .mission p {
	  margin-bottom: 10px;
	  font-size: 15px;
	  line-height: 28px;
	  font-weight: 500;
  }
  .mission i {
	  display: inline-block;
	  width: 50px;
	  height: 50px;
	  line-height: 50px;
	  text-align: center;
	  background: var(---primery-color);
	  border-radius: 50%;
	  color: #fff;
	  font-size: 25px;
  }
  .mission .small-text {
	  margin-left: 10px;
	  font-size: 13px;
	  color: #666;
  }
  .skills {
	  padding-top:0px;
  }
  .skills .prog-item {
	  margin-bottom: 25px;
  }
  .skills .prog-item:last-child {
	  margin-bottom: 0;
  }
  .skills .prog-item p {
	  font-weight: 500;
	  font-size: 15px;
	  margin-bottom: 10px;
  }
  .skills .prog-item .skills-progress {
	  width: 100%;
	  height: 10px;
	  background: #e0e0e0;
	  border-radius:20px;
	  position: relative;
  }
  .skills .prog-item .skills-progress span {
	  position: absolute;
	  left: 0;
	  top: 0;
	  height: 100%;
	  background: var(---primery-color);
	  width: 10%;
	  border-radius: 10px;
	  -webkit-transition: all 1s;
	  transition: all 1s;
  }
  .skills .prog-item .skills-progress span:after {
	  content: attr(data-value);
	  position: absolute;
	  top: -5px;
	  right: 0;
	  font-size: 10px;
	  font-weight:600;    
	  color: #fff;
	  background:rgba(0, 0, 0, 0.9);
	  padding: 3px 7px;
	  border-radius: 30px;
  }
  .tfx-mark-dtx {
	width: 50px;
	height: 50px;
}

/********contact-page-css ********/
  .right_conatct_social_icon{
	background: rgb(0,59,119);
	background: linear-gradient(90deg, rgba(0,59,119,0.9415966215587798) 0%, rgba(254,42,92,0.94) 100%); 
  }
  .contact_us{
	  background-color: #f1f1f1;
	  padding: 120px 0px;
  }
  
  .contact_inner{
	  background-color: #fff;
	  position: relative;
	  box-shadow: 20px 22px 44px #cccc;
	  border-radius: 25px;
  }
  .contact_field{
	  padding: 60px 340px 90px 100px;
  }
  .right_conatct_social_icon{
	  height: 100%;
  }
  
  .contact_field h3{
	 color: #000;
	  font-size: 40px;
	  letter-spacing: 1px;
	  font-weight: 600;
	  margin-bottom: 10px
  }
  .contact_field p{
	  color: #000;
	  font-size: 13px;
	  font-weight: 400;
	  letter-spacing: 1px;
	  margin-bottom: 35px;
  }
  .contact_field .form-control{
	  border-radius: 0px;
	  border: none;
	  border-bottom: 1px solid #ccc;
  }
  .contact_field .form-control:focus{
	  box-shadow: none;
	  outline: none;
	  border-bottom: 2px solid #1325e8;
  }
  .contact_field .form-control::placeholder{
	  font-size: 13px;
	  letter-spacing: 1px;
  }
  
  .contact_info_sec {
	position: absolute;
	background-color: #2d2d2d;
	right: 1px;
	top: 18%;
	height: 340px;
	width: 340px;
	padding: 40px;
	border-radius: 25px 0 0 25px;
	color: white;
}
  .contact_info_sec h4{
	  letter-spacing: 1px;
	  padding-bottom: 15px;
  }
  
  .info_single{
	  margin: 30px 0px;
  }
  .info_single i{
	  margin-right: 15px;
  }
  .info_single span{
	  font-size: 14px;
	  letter-spacing: 1px;
  }
  
  button.contact_form_submit {
	background: rgb(0,59,119);
	background: linear-gradient(90deg, rgba(0,59,119,0.9415966215587798) 0%, rgba(254,42,92,0.94) 100%); 
	  border: none;
	  color: #fff;
	  padding: 10px 15px;
	  width: 100%;
	  margin-top: 25px;
	  border-radius: 35px;
	  cursor: pointer;
	  font-size: 14px;
	  letter-spacing: 2px;
  }
  .socil_item_inner li{
	  list-style: none;
  }
  .socil_item_inner li a{
	  color: #fff;
	  margin: 0px 15px;
	  font-size: 14px;
  }
  .socil_item_inner{
	  padding-bottom: 10px;
  }
  
  .map_sec{
	  padding: 50px 0px;
  }
  .map_inner h4, .map_inner p{
	  color: #000;
	  text-align: center
  }
  .map_inner p{
	  font-size: 13px;
  }
  .map_bind{
	 margin-top: 50px;
	  border-radius: 30px;
	  overflow: hidden;
  }