.contact-section {
    padding: 60px 0 40px;
    @include respond-below(lg) {
       padding: 40px 0 20px;
    }
}
.contact-inner-header {
	margin-bottom: 20px;
	h6 {
		margin-bottom: 16px;
	}
}
.contact-card {
	border-radius: 10px;
	margin-bottom: 20px;
	.card-body {
		@extend %flex__center;
       	padding: 20px;
		border-color: $border-color;
	}
}
.contact-icon {
	width: 50px;
	height: 50px;
	color: $primary;
	@include rounded(10px);
	font-size: $font-size-24;
	margin-right: 16px;
	background: $light;
	display: flex;
	align-items: center;
	justify-content: center;
    @include respond-below(lg) {
        font-size: $__font__size__40;
        margin-right: 15px;
    }
}
.contact-details {
	h4 {
		font-weight: $font-weight-semibold;
		font-size: $__font__size__20;
		margin-bottom: 4px;
        @include respond-below(lg) {
            font-size: $__font__size__18;
        }
	}
	p {
		font-size: $font-size-16;
		margin-bottom: 0;
        @include respond-below(lg) {
            font-size: $font-size-14;
        }
	}
}
.contact-form-card {
	background: $light-300;
	border-radius: 10px;
	.card-body {
        padding: 20px;
	}
	.form-group {
		margin-bottom: 25px;
		label {
			font-size: $__font__size__12;
			color: $__black_shade;
			margin-bottom: 8px;
		}
		.form-control {
			font-weight: $font-weight-medium;
			color: $__bodycolor;
			&::placeholder {
				font-weight: $font-weight-medium;
				color: $__bodycolor;
			}
		}
		textarea {
			&.form-control {
				min-height: 150px;
				resize: $__none;
			}
		}
	}
	.form-group-btn {
		.btn {
			border-radius: 44px;
			font-size: $font-size-16;
            @include margin-padding(0, 9px 16px);
			font-weight: $font-weight-medium;
			@include respond-below(lg) {
				font-size: $font-size-14;
			}
		}
	}
}
.contact-map {
	iframe {
		width: $__full__width;
		border: $__none;
		height: 450px;
	}
}
