/* Custom Service */ 
.ourServices {

	h3 {
		font-size: 24px;
		margin-bottom: 10px;
	}

	p {
		font-size: 16px;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.contentCol-1,
	.contentCol-2 {
		padding-top: 20px;
		.shaps {
			display: none;
		}
	}

	.contentCol-1 {
		text-align: right;
	}
	
	.contentCol-2 {
		display: flex;
		flex-direction: column;
		text-align: left;
	}

	.shaps {
		display: flex;
		flex-direction: column;
		align-items: center;
		
		.shape {
				width: 150px;
				height: 150px;

				display: inline-flex;
				justify-content: center;
				align-items: center;
				margin: 5px 0;
				color: white;
				border-radius: 10px;

				&:nth-child(1) {
					background: url(/assets/img/icon/shape-1.svg) center center no-repeat;
					margin-top: 0;
				}
				&:nth-child(2) {
					background: url(/assets/img/icon/shape-2.svg) center center no-repeat;
					margin-left: -168px;
        	margin-top: -82px;
				}
				&:nth-child(3) {
					background: url(/assets/img/icon/shape-3.svg) center center no-repeat;
					margin-left: -200px;
        	margin-top: -16px;
				}
				&:nth-child(4) {
					background: url(/assets/img/icon/shape-4.svg) center center no-repeat;
					margin-left: -118px;
        	margin-top: -48px;
				}
				&:nth-child(5) {
					background: url(/assets/img/icon/shape-5.svg) center center no-repeat;
					margin-left: 82px;
        	margin-top: -86px;
				}
				&:nth-child(6) {
					background: url(/assets/img/icon/shape-6.svg) center center no-repeat;
					margin-left: 148px;
        	margin-top: -26px;
				}
				&:nth-child(7) {
					background: url(/assets/img/icon/shape-7.svg) center center no-repeat;
					margin-left: 82px;
        	margin-top: -26px;
				}
				&:nth-child(8) {
					background: url(/assets/img/icon/shape-8.svg) center center no-repeat;
					margin-left: -92px;
        	margin-top: -94px;
				}
		}
	}

	.serviceInfo {
		.group {
			position: relative;
			margin-bottom: 60px;
			&:last-child {
				margin-bottom: 0;
			}
		}
		.infoIcon {
			width: 120px;
			height: 101px;
			background-color: #F5F6F7;
			border: solid 1px #349BD5;

			display: inline-flex;
			justify-content: center;
			align-items: center;
			border-radius: 20px;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
		}
	}

	.contentCol-1 {
		.serviceInfo {
			.infoIcon {
				right: -140px;
			}
		}
	}

	.contentCol-2 {
		.serviceInfo {
			.infoIcon {
				left: -140px;
			}
		}
	}
}
/* Custom Service */ 

.service-policy-icon h4 span.numbe-post {
	display: inline-block;
	width: 30px; /* Adjust the width to your preference */
	height: 30px; /* Adjust the height to your preference */
	line-height: 30px; /* Should be equal to the height for centering */
	text-align: center;
	border-radius: 50%; /* Makes it a circle */
	background-color: #3498db; /* Choose your desired background color */
	color: #fff; /* Choose your desired text color */
}
@media (min-width: 992px) {
	.vertical-line {
		border-right: 2px solid #000; /* Black vertical line */
	}
	.content-spacing {
		padding-left: 20px; /* Space between line and content */
	}
}

.search-bar-container {
	background-color: #3490dc;
	padding: 40px 0;
}

.search-bar {
	background-color: #ffffff;
	border-radius: 100px;
	padding: 10px 20px;
	border: none;
	width: 100%;
}

.searchbtn {
	text-align: right;
}

.search-button {
	background-color: #000000;
	color: white;
	padding: 10px 20px;
	border-radius: 9999px;
	font-weight: 600;
	min-width: 120px;;
}

.section-title2 {
	width: 100%; 
	padding: 0; 
	display: flex; 
	justify-content: center; 
}

.btn-custom {
	background-color: transparent; 
	color: #000; 
	border: 1px solid #000; 
}

.btn-custom:hover {
	background-color: rgba(0, 0, 0, 0.1); 
}

.service-policy-icon h4 span.numbe-post {
    display: inline-block;
    width: 30px; 
    height: 30px; 
    line-height: 30px; 
    text-align: center;
    border-radius: 50%; 
    background-color: #3498db; 
    color: #fff; 
}

.fyunBtn {
	margin-right: 50px;
}

.btn-border {
	border: solid 2px #0172d0;
	background-color: transparent;
	color: #0172d0;

	&:hover, &:focus {
		background-color: transparent;
		border-color: black;
		color: black;

	}
}


@media screen and (max-width: 967px) {

	.ourServices {
		.ServiceAvatar {
			display: none;
		}

		.container {
			max-width: 100%;
		}

		h3 {
			font-size: 18px;
		}

		p {
			font-size: 12px;
		}

		.shaps {
			display: none;
		}

		.serviceInfo {
			.group {
				padding-left: 100px;
				margin-bottom: 50px;
			}
			.infoIcon {
				width: 90px;
				height: 76px;
				img {
					transform: scale(0.8);
				}
			}
		}

		.contentCol-1,
		.contentCol-2 {
			display: flex;
			justify-content: space-between;
			align-items: center;
			flex-direction: row;
			text-align: left;

			.shaps {
				display: flex !important;
				width: 30%;
			}

			.serviceInfo {
				.infoIcon {
					left: 0;
					right: auto;
				}
			}
		}
	
		.contentCol-1 {
			.shaps {
				margin-left: 40px;
				margin-right: -30px;
				transform: rotate(-10deg) scale(0.5);
			}
		}
		
		.contentCol-2 {
			.shaps {
				display: flex !important;
				margin-right: 20px;
				margin-left: -20px;
				transform: rotate(-17deg) scale(0.5);

				.shape {
					&:nth-child(1) {
						background: url(/assets/img/icon/shape-5.svg) center center no-repeat;
						margin-left: 82px;
						margin-top: -86px;
					}
					&:nth-child(2) {
						background: url(/assets/img/icon/shape-6.svg) center center no-repeat;
						margin-left: 148px;
						margin-top: -26px;
					}
					&:nth-child(3) {
						background: url(/assets/img/icon/shape-7.svg) center center no-repeat;
						margin-left: 82px;
						margin-top: -26px;
					}
					&:nth-child(4) {
						background: url(/assets/img/icon/shape-8.svg) center center no-repeat;
						margin-left: -92px;
						margin-top: -94px;
					}
				}
			}
		}
	} 

	.jobSeekers {
		margin-bottom: 30px;;
	}

	.jobSeekers,
	.forBusiness {
		.btn {
			width: 100%;
		}
	}

	.search-button {
		width: 100%;
		margin-top: 20px;
	}
}

.contact-message {
    border-radius: 10px;
    max-width: 500px;
}

.contact-message .title {
    text-align: center;
    color: #333;
    margin-bottom: 20px;
	text-align: left;
}

.contact-message .title span {
    color: #3498db;
}

.contact-description {
    text-align: center;
    color: #666;
    margin-bottom: 30px;
}

.userLogin {
	.container {
		background-color: #f5f5f5;
		padding: 40px 50px;
		border-radius: 10px;
	}

	input[type="text"],
	input[type="password"] {
		background-color: white !important;
	}

	.contact-message {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		flex-direction: column;

	}

	.moving-vertical {
		border-left: solid 1px #ddd;

		@media screen and (max-width: 768px) {
			border: none
		}
	}

	.btn {
		min-width: 100%;
		height: 50px;
	}
}

.enqueryNowForm {
	.btn {
		width: 30%;
		@media screen and (max-width: 768px) {
			width: 100%;
		}
	}
}

@media (min-width: 992px) {
    .vertical-line {
        border-right: 2px solid #222;
    }
    .content-spacing {
        padding-left: 80px; 
    }
}

.form-row {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -5px;
	margin-left: -5px;
}

.form-row > .col, .form-row > [class*="col-"] {
	padding-right: 5px;
	padding-left: 5px;
  }

  .userRegistration {
	.otpBtn {
		width: 100%;
		height: auto;
		padding: 12px 24px 12px 24px;
	}

	.submitBtn {
		max-width: 280px;
		width: 100%;
		margin: 25px auto;
		display: block;
	}
  }

  @media screen and (max-width: 768px){
	.form-group {
		width: 100%;
	}

	.userRegistration  {
		.submitBtn {
			max-width: 100%;
		}
	}
  }