// ft-clients
.ft-clients{
	background-color: $white;
	border-bottom: 10px solid var(--primary);
	box-shadow: 5px 0 15px rgba(0, 0, 0, 0.15);
	border-radius: 10px;
	z-index: 1;
	position: relative;
}
.ft-clients-area{
	position: relative;
	&:before{
		content: "";
		position: absolute;
		height: 50%;
		width: 100%;
		left: 0;
		top: 0;
		background-color: $white;
	}
	&.bg-gray{
		background-color: transparent;
		&:before{
			background-color: #f7f9fb;
		}
	}
}
.footer-logo-head{
	& + .widget-area{
		position:relative;
		padding-top: 50px;
		margin-top: 0;
		&:after{
			content:"";
			position:absolute;
			top:0;
			left:15px;
			height:1px;
			border-top: 1px dashed rgba(255,255,255,0.2);
			width:calc(100% - 30px);
		}
		@include respond('phone'){
			margin-top: 30px;	
			padding-top:40px;
		}
	}
 	
}
.site-footer{
	&.style-1{
		color: rgba(255,255,255,0.75);
		background-color: #f8f8f8;
		background-position: center;
		background-size: cover;
		position: relative;
		z-index: 1;
	    --title: #fff;
		&:after {
			content: "";
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			background:#00112e;
			z-index: -1;
			opacity: 0.95;
		}
		.footer-top{
			padding: 70px 0 30px;
			.text{
			
			}
			.footer-logo{
				margin-bottom: 30px;
				img {
					height: 50px;
				}
			}
		}
		.footer-bottom{
			background-color:transparent;
			background-position: center;
			background-size: cover;
			padding: 0;
			.fb-inner{
				padding-top:20px;
				padding-bottom:20px;
				border-top:1px dashed rgba(255,255,255,0.2);
			}
			ul{
				li{
					a{
						@include transitionMedium;
						&:hover{
							color: var(--primary);
						}
					}
					&:before{
						color: var(--primary);
					}
					&:last-child{
						padding-right: 0;
					}
				}
			}
		}
		.social-list{
			display:inline-block;
			li{
				margin-left: 2px;
				margin-right: 2px;	
				display:inline-block;
				a{
					background-color: var(--primary);
					border-radius:var(--border-radius-base);
					box-shadow: $box-shadow;
					color:#000;
					&:hover{
						background-color: var(--primary-hover);
						-webkit-animation-name: pulse;
						animation-name: pulse;
						-webkit-animation-fill-mode: both;
						animation-fill-mode: both;
						-webkit-animation-duration: 1s;		
						animation-duration: 1s;	
						-webkit-animation-iteration-count: infinite;
						animation-iteration-count: infinite;
					}
				}
			}
		}
		.ft-subscribe{
			margin-bottom: 45px;
		}
		.mail-text{
			margin-top: 45px;
			margin-bottom: 30px;
			font-family: $font-family-title;
			font-weight: 500;
			letter-spacing: 3px;
			span{
				font-weight: 400;
				margin-right: 5px;
			}
		}
		.dz-social-icon{
			li{
				a{
					height: 38px;
					width: 38px;
					line-height: 38px;
					font-size: 16px;
				}
			}
		}
		.footer-title{
			padding-bottom: 0;
			margin-bottom: 10px;
		}
		@include respond('tab-port'){
			.footer-top {
				padding: 50px 0 30px;
			}
			.footer-bottom{
				.text-start,
				.text-end{
					text-align: center!important;
				}
				.text-end{
					margin-top: 10px;
				}
			}
		}
		@include respond('phone'){
			.footer-top{
				.text {
					margin: 0 0px 30px;
				}
				.footer-logo {
					margin-bottom: 30px;
				}
			}
			.mail-text {
				margin-top: 10px;
			}
			.ft-subscribe{
				.form-control {
					height: 60px;
					padding: 20px 25px;
					width: 100%;
				}
				button{
					margin: 20px 0 0!important;
					width: 100%;
					justify-content: center;
					padding: 18px 20px;
				}
			}
		}
		.widget_gallery li img{
			height: 120px;
			object-fit: cover;
			@include respond('tab-land'){
				height: 130px;
			}
			@include respond('tab-port'){
				height: auto;
			}
		}
	}
}

// ft subscribe
.ft-subscribe{
	.form-control{
		height: 60px;
		background-color: #fff;
		border-radius: var(--border-radius-base)!important;
		z-index: 1!important;
		padding: 15px 60px 15px 30px;
		color: $body-color;
		border-color: $body-color;
		
		&::-webkit-input-placeholder{
			font-family: var(--font-family-title);
			color: $body-color;
		}
		&:-ms-input-placeholder{
			font-family: var(--font-family-title);
			color: $body-color;
		}
		&::placeholder{
			font-family: var(--font-family-title);
			color: $body-color;
		}
	}
}
