


/*===========================
    11.FOOTER css 
===========================*/



.footer-area{
	background: #101e3b;
	position: relative;
	&::before{
		position: absolute;
		content: '';
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		background-image: url(../images/working-line.png);
		opacity: .02;
	}
	& .footer-logo{
		& a{
			& img{
				@media #{$xs} {
					width: 70%;
				}
			}
		}
	}
	& .footer-widget{
		@media #{$lg} {
			margin-left: 0;
		}
		@media #{$xs} {
			margin-left: 0;
		}
		& .footer-title{
			& .title{
				color: $white;
				font-size: 18px;
				font-weight: 600;
			}
		}
		& .footer-items-1{
			padding-top: 32px;
			& p{
				color: #aeb7ca;
				font-size: 14px;
				line-height: 26px;
				padding-bottom: 35px;
			}
			& ul{
				& li{
					display: inline-block;
					& a{
						height: 40px;
						width: 40px;
						text-align: center;
						line-height: 36px;
						border-radius: 5px;
						border: 2px solid #2d416a;
						color: #556a96;
						font-size: 14px;
						margin-right: 5px;
						@include transition(0.3s);
						&:hover{
							background: $theme-color;
							color: $white;
							border-color: $theme-color;
						}
					}
				}
			}
		}
		& .footer-items-2{
			padding-top: 30px;
			& ul{
				& li{
					& a{
						font-size: 14px;
						color: #aeb7ca;
						line-height: 32px;
						@include transition(0.3s);
						&:hover{
							color: $theme-color;
						}
					}
				}
			}
		}
		& .footer-items-3{
			margin-top: 37px;
			& .News-item{
				& .News-thumb{
					width: 140px;
					& img{
						width: 100%;
						border-radius: 5px;
					}
				}
				& .News-content{
					padding-left: 18px;
					& .title{
						font-size: 16px;
						font-weight: 700;
						color: $white;
						line-height: 28px;
						margin-top: -5px;
						@media #{$lg} {
							font-size: 14px;
							line-height: 26px;
						}
					}
					& span{
						font-size: 14px;
						color: #aeb7ca;
						
					}
				}
			}
		}
	}
	& .footer-copyright{
		height: 85px;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-top: 2px solid #2b3c60;
		margin-top: 76px;
		@media #{$xs} {
			display: block;
			text-align: center;
		}
		@media #{$sm} {
			display: flex;

		}
		& span{
			color: #aeb7ca;
			@media #{$xs} {
				padding: 20px 0 5px;
			}
			& i{
				padding-right: 6px;
				font-size: 24px;
			}
		}
		& p{
			color: #aeb7ca;
			font-size: 14px;
		}
	}
}



.back-top{
	.back-to-top {
	    position: absolute;
	    left: 50%;
	    transform: translateX(-50%);
	    bottom: 60px;
	    height: 50px;
	    width: 50px;
	    background: $theme-color;
	    text-align: center;
	    border-radius: 50%;
	    color: $white;
	    line-height: 50px;
	    @include transition(0.3s);
	    z-index: 99;
	    cursor: pointer;
	    display: none;
	    font-size: 24px;
	    & i{
	        transition: all linear 0.3s;
	        color: $white;
	    }
	}
	&.back-top-2{
		& .back-to-top{
			position: fixed;
			right: 30px;
			bottom: 30px;
			left: auto;
			z-index: 9999999;

		}
	}

}





.footer-3-area{
	background: #041d47;
	padding-top: 50px;
	position: relative;
	&::before{
		position: absolute;
		content: '';
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		background-image: url(../images/working-line.png);
		opacity: .02;
	}
	& .footer-item-1{
		& p{
			color: #aeb7ca;
			padding-top: 30px;
			padding-bottom: 30px;
		}
		& ul{
			& li{
				display: inline-block;
				& a{
					height: 40px;
					width: 40px;
					background: #14346b;
					border-radius: 5px;
					color: #4a70b1;
					text-align: center;
					line-height: 40px;
					margin-right: 5px;
					@include transition(0.3s);
					&:hover{
						background: $theme-color-3;
						color: $white;
					}
				}
			}
		}
	}
	& .footer-item-2{
		margin-left: 50px;
		@media #{$lg} {
			margin-left: 0;
		}
		@media #{$md} {
			margin-left: 0;
		}
		@media #{$xs} {
			margin-left: 0;
		}
		& .title{
			color: $white;
			font-size: 18px;
			font-weight: 700;
			text-transform: capitalize;
			padding-bottom: 28px;
		}
		& p{
			color: #aeb7ca;
			padding-bottom: 24px;
		}
		& .links-list{
			display: flex;
			& ul{
				& li{
					& a{
						font-size: 14px;
						color: #aeb7ca;
						line-height: 32px;
						@include transition(0.3s);
						&:hover{
							color: $theme-color-2;
						}
					}
				}
			}

		}
		&.footer-item-3{
			margin-left: -30px;
			@media #{$md} {
				margin-left: 0;
			}
			@media #{$xs} {
				margin-left: 0;
			}
			& .input-box{
				position: relative;
				& input{
					width: 100%;
					height: 60px;
					background: $white;
					border: 0;
					color: $body-text;
					padding-left: 30px;
					font-size: 14px;
					&::placeholder{
						color: $body-text;
						opacity: 1;
					}
				}
				& button{
					position: absolute;
					right: 0;
					top: 0;
					height: 100%;
					width: 60px;
					border: 0;
					background: $theme-color-3;
					color: $white;
				}
			}
		}
	}
	& .footer-info{
		position: relative;
		padding-left: 80px;
		@media #{$lg} {
			padding-left: 60px;
		}
		& .title{
			font-size: 18px;
			color: $white;
		}
		& span{
			font-size: 14px;
			color: #aeb7ca;
			padding-top: 4px;
		}
		& i{
			position: absolute;
			left: 0;
			top: 50%;
			transform: translateY(-50%);
			height: 60px;
			width: 60px;
			background: #14346b;
			border-radius: 50%;
			text-align: center;
			line-height: 60px;
			color: #3e63a4;
			font-size: 24px;
			@include transition(0.3s);
			@media #{$lg} {
				height: 40px;
				width: 40px;
				line-height: 40px;
				font-size: 18px;
			}
		}
		&:hover{
			& i{
				background: $theme-color-3;
				color: $white;
			}
		}
	}
	& .footer-copy{
		border-top: 2px solid #14346b;
		& p{
			line-height: 75px;
			color: #aeb7ca;

		}
	}
}