@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/*HAO ADD*/
.custom-border-radius
{
	height: 80%;
    text-align: center;
    background-color: rgba(63, 61, 61, 0.6);
    border-radius: 20px;
    padding: 25px 30px 35px 30px;
    margin: 15px 0px;
}

.banner-background
{
	background-position: center;
	background-size: cover; 
	background-image: url('../images/img/rectangle-3.png');
	padding: 200px 0px 100px 0px;
}

.page-small-title
{
	color: #00ff86;
	font-weight: 500;
	line-height: 30px;
	font-size: 20px;
}

.page-title
{
	font-weight: 600;
	color: white;
	font-size: 48px;
	line-height: 72px;
}

.custom-section-padding
{
	padding: 50px 0px;
}

.section-title
{
	font-weight: 600;
	color: white;
	text-align: center;
}

.section-black-title
{
	font-weight: 600;
	font-size: 35px;
}

.section-content
{
	font-weight: 400;
	color: #5a5a5a;
	font-size: 16px;
}

.section-text
{
	text-align: center;
	color: white;
	font-size: small;
}

.home-software-border
{
	border-radius: 20px;
	background-color: #ecf1f9;
	padding: 20px;
	height: 100%;
}

.home-software-title
{
	font-weight: 700;
	height: 50px;
}

.home-software-text
{
	font-size: small;
	margin: 20px 0px;
	display: -webkit-box;
	-webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.home-content-text
{
	font-size: small;
}

.learn-more-btn
{
	font-size: 13px;
	color: #fff;
	background-color: #0144A1;
	padding: 12px 30px;
	display: inline-block;
	border-radius: 22px;
	font-weight: 500;
	transition: all .3s;
	text-decoration: none;
}
.learn-more-btn:hover
{
	background-color: rgba(1, 68, 161, 0.65);
	color: #fff;
}

.submit-btn
{
	font-size: 15px;
	color: #fff;
	background-color: #0144A1;
	padding: 12px 50px;
	display: inline-block;
	border-radius: 22px;
	font-weight: 500;
	transition: all .3s;
	text-decoration: none;
	border: none;
}
.submit-btn:hover
{
	background-color: rgba(1, 68, 161, 0.65);
	color: #fff;
}

.custom-border-radius-1
{
	background-color: #ecf1f9;
	border-radius: 30px;
	padding: 30px 15px;
	text-align: center;
}

.blue-title
{
	font-weight: 600; 
	color: #0067ff;
	font-size: 60px;
}

.count-text
{
	color: #5a5a5a;
	font-weight: 500;
	font-size: 20px;
	line-height: 35px;
}

.custom-button-1
{
	background: radial-gradient( 50% 50% at 50% 50%, rgb(65, 139, 255) 37.71%, rgb(83, 146, 255) 67.61%, rgb(95, 168, 255) 100% );
	color: white;
}

.interested-container
{
	background-image: url(../images/img/interest.png);
	background-size: 100% 100%;
	padding: 75px 100px;
	border-radius: 30px;
}

@media (min-width: 992px) {
	.contact-upper-section
	{
		position: relative;
		bottom: 70px;
		z-index: 3;
	}
}

@media (max-width: 768px) {

	.banner-background
	{
		padding: 150px 0px 50px 0px;
	}

	.page-title
	{
		font-size: 26px;
	}

	.custom-section-padding
	{
		padding: 30px 0px;
	}

	.blue-title
	{
		font-size: 38px;
	}
}


/* Remove font-family from universal selector */
.title3 {
    font-size: 35px;
    font-weight: 600;
    text-transform: capitalize;
    color: #000000;
}

/* Keep other global styles if needed */
* {
    font-family: 'Poppins', sans-serif;
}


img {
	max-width: 100%;
}

body {
	background: #ffffff;
}

.bg_text {
	font-weight: 600;
	letter-spacing: 0;
	line-height: normal;
}

.normal_text {
	font-weight: 700;
	line-height: 1.4825;
}

.small_text {
	font: inherit;
	font-size: 12px;
	font-weight: 400;
	color: #000000;
}

.container-fostrap {
	display: table-cell;
	padding: 1em;
	text-align: center;
	vertical-align: middle;
}

.fostrap-logo {
	width: 100px;
	margin-bottom: 15px
}

/* .card {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); 
    transition: box-shadow .25s; 
} */
/* .card:hover {
  box-shadow: 0 0 2rem 2rem rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
} */


.img-area {
	max-width: 90px;
	height: auto;
}

.img-area1 {
	max-width: 180px;
	height: auto;
}

.img-area2 {
	max-width: 40px;
	height: auto;
}

.img-area3 {
	max-width: 800px;
	height: auto;
}

.img-area4 {
	max-width: 500px;
	height: auto;
}

.img-area5 {
	max-width: 250px;
	height: auto;
}

.img-area6 {
	max-width: 200px;
	height: auto;
}

.img-area7 {
	max-width: 350px;
	height: auto;
}

.img-area8 {
	max-width: 420px;
}

.img-area9 {
	
	height: auto;
}

.img-area10 {
	max-width: 80px;
	height: auto;
}


.zenlogo-2 {
	width: 120px;
	height: 120px;
	top: 9px;
	left: 129px;
	position: absolute;
	object-fit: cover;
}

.text-wrapper-29 {
	font-weight: 600;
	color: #00ff86;
	font-size: 15px;
	/* Using viewport width (vw) for font size */
	letter-spacing: 0;
	line-height: normal;
}

.WE-ARE-DIGITAL-2 {
	text-shadow: 0px 0px 21.1px #0000008a;
	font-weight: 600;
	color: #ffffff;
	font-size: 50px;
	letter-spacing: 0;
	line-height: normal;
}

.section-padding {
	padding: 100px 0;
}

.carousel-item {
	height: 100vh;
	min-height: 300px;
}

.carousel-caption {
	bottom: 220px;
	z-index: 2;
}

.carousel-caption h5 {
	font-size: 45px;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin-top: 25px;
}

.carousel-caption p {
	width: 60%;
	margin: auto;
	font-size: 18px;
	line-height: 1.9;
}

.carousel-inner:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.7);
	z-index: 1;
}

.navbar-section {
	background-color: rgba(255, 255, 255, 0.5);
	/* 调整透明度值 */
	backdrop-filter: blur(10px) brightness(100%);
	/* 调整模糊程度 */
	-webkit-backdrop-filter: blur(10px) brightness(100%);
}


.navbar .getstarted {
	background: #106eea;
	margin-left: 30px;
	border-radius: 4px;
	font-weight: 400;
	color: #fff;
	text-decoration: none;
	padding: .5rem 1rem;
	line-height: 2.3;
}

.navbar-nav a {
	font-size: 16px;
	font-weight: 600;
}

.navbar-light .navbar-brand {
	color: #000;
	font-size: 25px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
}

.navbar-light .navbar-brand:focus,
.navbar-light .navbar-brand:hover {
	color: #000;
}

.w-100 {
	height: 100vh;
}

.navbar-toggler {
	padding: 1px 5px;
	font-size: 18px;
	line-height: 0.3;
	background: transparent;
}

.portfolio .card {
	box-shadow: 15px 15px 40px rgba(0, 0, 0, 0.15);
}

.team .card {
	box-shadow: 15px 15px 40px rgba(0, 0, 0, 0.15);
}

section.services {
	padding-bottom: 50px;
}

.services .card-body i {
	font-size: 50px;
}

.team .card-body i {
	font-size: 20px;
}

.page_title {
	font-weight: 700;
	color: #ffffff;
	font-size: 60px;
	width: 60%;
	text-align: center;
	margin: auto;
	padding: 200px 0px 100px 0px;
}

.page_title2 {
	font-weight: 700;
	color: #ffffff;
	font-size: 40px;
	width: 60%;
	text-align: center;
	margin: auto;
	padding: 200px 0px 100px 0px;
}

.junction_container {
	border-radius: 8.75rem;
	padding: 30px;
	box-shadow: 4px -4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	background-color: white;
}

.info_container {
	border: solid 0.1rem #cdcdcd;
	border-radius: 8.75rem;
	padding: 30px;
}

.custom-column-end {
	text-align: end;
}

.custom-column-start {
	text-align: start;
}
.text2{
	color: #000000; 
	font-size: 15px; 
	text-align: center;
}
.title2 {
	font-weight: 700;
	color: #000000;
	font-size: 40px;
	width: 100%;
}

@media only screen and (max-width:992px) {
	.learn-more-btn {
		width: 100%;
	}
	.contact-upper-section {
		padding: 50px 0;
	}
	.custom-md-mt {
		margin-top: 30px;
	}
}

@media only screen and (max-width:768px) {
	.custom-career-md-mt {
		margin-top: 30px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.carousel-caption {
		bottom: 370px;
	}

	.carousel-caption p {
		width: 100%;
	}

	.card {
		margin-bottom: 30px;
	}

	.img-area img {
		width: 100%;
	}

	.img-area1 img {
		width: 100%;
	}

	.img-area2 img {
		width: 100%;
	}

	.img-area3 img {
		width: 100%;
	}

	.img-area4 img {
		width: 100%;
	}

	.img-area5 img {
		width: 100%;
	}

	.img-area6 img {
		width: 100%;
	}

	.img-area7 img {
		width: 100%;
	}

	.img-area8 img {
		width: 100%;
	}

	.img-area9 img {
		width: 100%;
	}

	.img-area10 img {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	.navbar-nav {
		text-align: center;
	}

	.carousel-caption {
		bottom: 125px;
	}

	.carousel-caption h5 {
		font-size: 17px;
	}

	.carousel-caption a {
		padding: 10px 15px;
		font-size: 15px;
	}

	.carousel-caption p {
		width: 100%;
		line-height: 1.6;
		font-size: 12px;
	}

	.about-text {
		padding-top: 50px;
	}

	.card {
		margin-bottom: 30px;
	}

	.img-area img {
		width: 100%;
	}

	.img-area1 img {
		width: 100%;
	}

	.img-area2 img {
		width: 100%;
	}

	.img-area3 img {
		width: 100%;
	}

	.img-area4 img {
		width: 100%;
	}

	.img-area5 img {
		width: 100%;
	}

	.img-area6 img {
		width: 100%;
	}

	.img-area7 img {
		width: 100%;
	}

	.img-area8 img {
		width: 100%;
	}

	.img-area9 img {
		width: 100%;
	}

	.img-area10 img {
		width: 100%;
	}

	.page_title {
		font-size: 30px;
	}
	
	.page_title2 {
		font-size: 20px;
	}
	.junction_container 
	{
		border-radius: 30px;
		padding: 20px;
	}

	.info_container {
		border-radius: 30px;
	}

	.custom-column-end {
		text-align: center;
	}

	.custom-column-start {
		text-align: center;
	}

	.text2{
		font-size: 8px;
	}
	.title2 {
		font-size: 20px;
	}
	.title3 {
		font-size: 30px;
	}
}

.nav-item.active > .nav-link > .menutext {
	color: #0144A1 !important;
}

.nav-item {
	padding-left: 15px;
	padding-right: 15px;
}

.menutext {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2125;
	color: #ffffff;
	white-space: nowrap;
	flex-shrink: 0;
}

.custom-menutext {
	color: #a19898;
}

.custom-3d {
	animation-delay: 8s !important;
}

.custom-scale {
	transition: 1s;
}
.custom-scale:hover {
	transform: scale(1.05);
}

.custom-homepage-img {
	-webkit-animation: slide-in-elliptic-top-fwd 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-elliptic-top-fwd 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation-duration: 2s;
}

.custom-pointer {
	cursor: pointer;
}

.custom-typing {
	width: fit-content;
	overflow: hidden;
	border-right: 2px solid #7e2ea0;
	display: inline-block;
	animation: cursor .2s step-end infinite alternate;
}

.custom-line-height {
	line-height: 30px;
}

.card-container {
	max-height: 350px;
	overflow-x: auto;
	overflow-y: hidden;
}

.card-slider {
	display: flex;
	transition: transform 0.5s ease-in-out;
}

.card-flex {
	flex: 0 0 350px;
	margin-right: 15px;
}

.scroll-btn {
	cursor: pointer;
}

section.contact-us {
	background-image: url(../images/img/meetings-bg.jpg);
	background-position: center center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	padding-top: 80px;
	border-top: 1px solid rgba(250,250,250,0.15);
}
  
section.contact-us #contact {
	background-color: #fff;
	border-radius: 20px;
	padding: 40px;
}
  
section.contact-us #contact h2 {
	text-transform: uppercase;
	color: #1f272b;
	border-bottom: 1px solid #eee;
	margin-bottom: 40px;
	padding-bottom: 20px;
	font-size: 22px;
	font-weight: 700;
}

section.contact-us #contact input {
	width: 100%;
	height: 40px;
	border-radius: 20px;
	background-color: #f7f7f7;
	outline: none;
	border: none;
	box-shadow: none;
	font-size: 13px;
	font-weight: 500;
	color: #7a7a7a;
	padding: 0px 15px;
	margin-bottom: 30px;
}

section.contact-us #contact textarea {
	width: 100%;
	min-height: 140px;
	max-height: 180px;
	border-radius: 20px;
	background-color: #f7f7f7;
	outline: none;
	border: none;
	box-shadow: none;
	font-size: 13px;
	font-weight: 500;
	color: #7a7a7a;
	padding: 15px;
	margin-bottom: 30px;
}

section.contact-us #contact button {
	font-size: 13px;
	color: #fff;
	background-color: #a12c2f;
	padding: 12px 30px;
	display: inline-block;
	border-radius: 22px;
	font-weight: 500;
	text-transform: uppercase;
	transition: all .3s;
	border: none;
	outline: none;
}

section.contact-us #contact button:hover {
	opacity: 0.9;
}

section.contact-us .right-info {
	background-color: #a12c2f;
	border-radius: 20px;
	padding: 40px;
}

section.contact-us .right-info ul li {
	display: block;
	border-bottom: 1px solid rgba(250,250,250,0.15);
	margin-bottom: 30px;
	padding-bottom: 30px;
}

section.contact-us .right-info ul li:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

section.contact-us .right-info ul li h6 {
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 10px;
}

section.contact-us .right-info ul li span {
	display: block;
	font-size: 18px;
	color: #fff;
	font-weight: 700;
}

.footer {
	text-align: center;
}
.footer p {
	text-transform: uppercase;
	font-size: 14px;
	color: #fff;
}

.footer-img-container {
	width: max-content;
}
.footer .img-area2 {
	text-align: center;
	margin: 0 15px;
}

.banner-text {
	font-weight: 500;
	font-size: 20px;
}

.page-section {
	position: relative;
	overflow: hidden;
	padding: 80px 0;
	background-size: cover;
	background-position: center;
}

.page-cover {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.page-head-content {
	position: relative;
	z-index: 2;
}

.aboutus-title {
	color: #8BBBFF;
	font-weight: 600;
	font-size: 48px;
}
.aboutus-text {
	color: white;
	font-weight: 500;
	font-size: 24px;
	line-height: 35px;
}

.aboutUs-container
{
	border-radius: 30px;
	background-color: #ecf1f9;
	padding: 20px;
}
.aboutUs-content-title
{
	font-weight: 600;
	font-size: 20px;
	color: rgba(61, 61, 61, 1);
}
.aboutUs-content
{
	color: rgba(90, 90, 90, 1);
	font-weight: 400;
	font-size: 13px;
}

.content_title
{
	font-weight: 500;
	font-size: 20px;
	color: #3d3d3d;
}
.content_text
{
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	color: #5a5a5a;
	display: -webkit-box;
	-webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.content_career_text
{
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	color: #5a5a5a;
	display: -webkit-box;
	-webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.content_story_title
{
	font-weight: 500;
	font-size: 18px;
	color: #3d3d3d;
	line-height: 30px;
	margin: 10px 0;
	/* height: 120px; */
}

.custom-card{
	border-radius: 30px;
	overflow: hidden;
	border: none;
	background-color: #ECF1F9;
}
.custom-card-img
{
	height: 200px !important;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.textfield {
	border-radius: 8.75rem; 
	padding: 30px;
	background-color: #f3f3f3;
	border: none;
}
.textarea-field {
	padding: 30px;
	background-color: #f3f3f3;
	border: none;
	border-radius: 2.75rem;
}
.custom-contact-padding
{
	padding-bottom: 100px;
}

.content-img {
	border-radius: 30px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
.content-img img {
	max-height: 100%;
	max-width: 100%;
	object-fit: cover;
	border-radius: 30px;
	height: 200%;
}
.content-text-container {
	border-radius: 30px;
	overflow: hidden;
	background-color: #ECF1F9;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

.career_title
{
	font-weight: 600;
	font-size: 36px;
}
.career_text
{
	font-weight: 400;
	font-size: 16px;
	line-height: 28px;
}

.date-text {
	font-weight: 400;
	font-size: 13px;
	color: #5a5a5a;
}

@media (min-width: 768px) {
	.custom-w-50 {
		width: 50%;
	}
}

/* animation keyframes */
@-webkit-keyframes slide-in-elliptic-top-fwd {
	0% {
		-webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
				transform: translateY(-600px) rotateX(-30deg) scale(0);
		-webkit-transform-origin: 50% 100%;
				transform-origin: 50% 100%;
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0) rotateX(0) scale(1);
				transform: translateY(0) rotateX(0) scale(1);
		-webkit-transform-origin: 50% 1400px;
				transform-origin: 50% 1400px;
		opacity: 1;
	}
}

@keyframes slide-in-elliptic-top-fwd {
	0% {
		-webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
				transform: translateY(-600px) rotateX(-30deg) scale(0);
		-webkit-transform-origin: 50% 100%;
				transform-origin: 50% 100%;
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0) rotateX(0) scale(1);
				transform: translateY(0) rotateX(0) scale(1);
		-webkit-transform-origin: 50% 1400px;
				transform-origin: 50% 1400px;
		opacity: 1;
	}
}

@keyframes typing {
	from { width: 0; }
	to { width: 100%; }
}
@keyframes cursor {
	from { border-right-color: #7e2ea0; }
	to { border-right-color: transparent; }
}