.agent-lists .agent-details span#agents-landing{
	padding-top: 50px;
}

	.agents-heading {
		position: relative;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #e5e5e5;
		padding-bottom: 25px;
	}
		.agents-heading h2{
			font-size: 15px;
			color: #333;
			padding-top: 20px;
		}
		.agents-heading h2 span{
			font-family: var(--font-noe);
			font-size: 48px;
			display: block;
			line-height: 1;
		}

		.sort-by{
			position: relative;
		}
			.sort-by .custom-select{
				position: absolute;
				bottom: 0;
				right: 0;
			}

.agents-wrapper{
    width: 80%;
    margin: 0 auto;
}
	.agent-lists{
		position: relative;
		color: #000;
		transition: all .25s ease-in-out;
		display: block;
		margin-top: 40px;

	}
		
		.agent-lists .agent-photo{
			display:block;
			position: relative;
		}

			.agent-lists .agent-photo .overlay-bg{
				background: rgb(216,216,216);
				background: linear-gradient(357deg, rgba(216,216,216,1) 0%, rgba(255,255,255,1) 87%, rgba(255,255,255,1) 100%);
				position: absolute;
				width: 100%;
				height: 100%;
				z-index: 2;
				opacity: 0;
	
			}

				.agent-lists.fp-non .agent-photo .overlay-bg{
					opacity: 1;
					transition: all .25s ease-in-out;

				}

			.agent-lists .agent-photo:after {
				display: block;
				width: 100%;
				height: 100%;
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				background: url(../images/hh-logo.png) no-repeat center center transparent;
				opacity: 1;
				transition: all .25s ease-in-out;
				z-index: 3;

			}
				.agent-lists:hover .agent-photo:after{
					opacity: 0;
				}

			.agent-lists .agent-photo:before {
				display: block;
				width: 100%;
				height: 100%;
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				background: url(../images/hh-logo-hover.png) no-repeat center center transparent;
				opacity: 0;
				transition: all .25s ease-in-out;
				z-index: 3;

			}
				.agent-lists:hover .agent-photo:before{
					opacity: 1;
				}

			.agent-lists .agent-photo canvas{
				display: block;
				width: 100%;
				background-size: auto 100%;
				background-repeat: no-repeat;
				background-position: center top;
				position: relative;
				z-index: 9;
				-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
				filter: grayscale(100%);
				transition: all .25s ease-in-out;

			}

				.agent-lists:hover .agent-photo canvas{
					-webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
					filter: grayscale(0);
					}
		.agent-lists .agent-details{
			padding: 4px 18px 8px;
			position: relative;
			margin-top: -1px;
		}
			.agent-lists:hover .agent-details{
				background:  #000000;
				color: #fff;
				transition: all .25s ease-in-out;
			}
				.agent-lists .agent-details i{
					color: #fff;
					position: absolute;
					right: 10px;
					font-size: 21px;
					top: 50%;
					transform: translate(-50%, -50%);
					transition: all .25s ease-in-out;
					opacity: 0;
				}
					.agent-lists:hover .agent-details i{
						opacity: 1;
					}
				.agent-lists .agent-details h2{
					font-family: var(--font-noe);
					font-size: 20px;
					color: #333;
					line-height: 1.1;
    				margin: 5px 0 10px;
				}

				.agent-lists .agent-details h2 a {
				    color: #333;
				}
					.agent-lists:hover .agent-details h2 a{
						color: #fff;
					}
				.agent-lists .agent-details span{
					font-weight: 300;
					font-size: 15px;
					text-transform: uppercase;
					display: block;
				}
				.agent-lists .agent-details span a {
					display: inline-block;
					margin: 0 9px;
				}

				.agent-lists .agent-details span a:first-child{
					margin-left: 0;
				}

				.agent-lists a:hover{
					color: #fff;
				}


.sd-pagination{
	border-top: 1px solid #000000;
	margin-top: 50px;
}
	.sd-pagination ul{
		display: flex;
		flex-wrap: wrap;
		margin-top: 70px;
	}
		.sd-pagination ul li{
			/*margin: 40px 4px 0;*/
			margin: 0 4px;
		}
			.sd-pagination ul li a{
				width: 50px;
				height: 50px;
				display: block;
				text-align: center;
				line-height: 50px;
				font-size: 15px;
				font-weight: 300;
				transition: all .25s ease-in-out;
			}

				.sd-pagination ul li:hover a,
				.sd-pagination ul li a.active{
					color: #fff;
					background: #000;
				}

				.sd-pagination ul li a.active{
					
					cursor: not-allowed;
				}

@media only screen and (max-width: 1199px) {
	.agent-lists .agent-details {
	    padding: 4px 10px 8px;
	}

	.agent-lists .agent-details h2 {
	    font-size: 14px;
	}
}

@media only screen and (max-width: 767px) {
	.agent-lists .agent-details i {
		font-size: 16px;
		right: 3%;
	}
}