/*===========================
    17.SOLUTIONS css 
===========================*/




.solutions-area{
	@media #{$lg} {
		padding-top: 117px;
	}
	& .solutions-thumb{
		margin-right: -30px;
		@media #{$xs} {
			margin-right: 0;
		}
		& img{
			width: 100%;
		}
		& .solutions-content{
			background: $theme-color-2;
			text-align: center;
			margin-top: 30px;
			& span{
				color: $white;
				font-size: 35px;
				font-weight: 700;
				line-height: 45px;
				padding: 55px 30px 65px;
				@media #{$lg} {
					font-size: 28px;
					line-height: 38px;
				}
				@media #{$xs} {
					font-size: 22px;
					line-height: 32px;
					padding: 55px 10px 65px;
				}
			}

		}
	}
	& .solutions-content-area{
		@media #{$md} {
			padding-left: 0;
			padding-top: 30px;
		}
		@media #{$xs} {
			padding-left: 0;
			padding-top: 30px;
		}
		& .section-title{
			& p{
				padding-bottom: 40px;
			}
		}
		& .solutions-list{
			& .item{
					position: relative;
					padding-left: 110px;
					padding-top: 15px;
					@media #{$xs} {
						padding-left: 50px;
					}
					@media #{$sm} {
						padding-left: 110px;
					}
				& .title{
					font-size: 24px;
					font-weight: 600;
					color: $black;
					@media #{$xs} {
						font-size: 20px;
					}
				}
				& p{
					padding-right: 30px;
					padding-top: 11px;
				}
				& i{
					position: absolute;
					left: 0;
					top: 0;
					height: 60px;
					width: 60px;
					border-radius: 50%;
					background: #fef0e5;
					text-align: right;
					font-size: 40px;
					color: $theme-color-2;
					padding-left: 28px;
					padding-top: 30px;
					@media #{$xs} {
						height: 30px;
						width: 30px;
						font-size: 22px;
						padding-left: 15px;
						padding-top: 15px;
					}
					@media #{$sm} {
						height: 60px;
						width: 60px;
						font-size: 40px;
						padding-left: 28px;
						padding-top: 30px;
					}
				}
			}
			& .solutions-btn{
				padding-top: 30px;
				& ul{
					& li{
						display: inline-block;
						& a{
							&.link{
								padding-left: 30px;
								color: $theme-color-2;
								font-size: 15px;
								font-weight: 600;
								@media #{$xs} {
									margin-top: 20px;
									padding-left: 0;
									margin-right: 20px;
								}
								@media #{$sm} {
									margin-top: 0px;
									padding-left: 30px;
									margin-right: 0;
								}
								& i{
									padding-left: 6px;

								}
							}
						}
					}
				}
			}
		}

	}
}