// Contact Page Style

.contact-map {
	margin-bottom: 60px;
}

.gmap_canvas {
	iframe {
		overflow: hidden;
		background: none !important;
		height: 500px;
		width: 100%;
		@media #{$tablet-device} {
			height: 400px;
		}
		@media #{$large-mobile} {
			height: 350px;
		}
	}
}
.custom-row-2 {
	.title {
		font-size: 24px;
		margin-bottom: 30px;
		font-weight: 600;
	}
}
.contact-info-wrap {
	background-color: #f5f5f5;
	padding: 50px 40px;
	height: 100%;
	.single-contact-info {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-bottom: 20px;
		.contact-info-inner {
			width: 80px;
			.sub-title {
				display: inline-block;
				font-weight: 600;
				color: $heading-color;
				font-family: $heading-font;
			}
		}
		.contact-info-dec {
			p {
				margin: 0;
				color: $body-color;

				@media #{$desktop-device, $tablet-device} {
					font-size: 14px;
				}
				& a {
					color: $body-color;
					&:hover {
						color: $theme-color;
					}
				}
			}
		}
	}
	.contact-social {
		.title {
			font-size: 20px;
			margin: 30px 0 17px;
			font-weight: 600;
		}
		.social-info {
			a {
				position: relative;
				display: inline-block;
				vertical-align: middle;
				color: $body-color;
				font-size: 20px;
				padding: 0;
				line-height: 36px;
				border-radius: 100%;
				text-align: center;
				border: none;
				z-index: 1;
				-webkit-transition: all 300ms linear;
				-moz-transition: all 300ms linear;
				-ms-transition: all 300ms linear;
				-o-transition: all 300ms linear;
				transition: all 300ms linear;
				margin-right: 20px;
				&:hover {
					color: $theme-color;
				}
			}
		}
	}
	@media #{$tablet-device} {
		padding: 50px 27px;
	}
	@media #{$large-mobile} {
		padding: 50px 20px;
	}
}
.contact-form {
	background-color: #f5f5f5;
	padding: 50px 40px;
	.contact-form-style {
		input,
		textarea {
			background: transparent;
			border: 1px solid #c1c1c1;
			margin-bottom: 30px;
			color: $body-color;
		}
		textarea {
			margin-bottom: 0;
			height: 200px;
			@media #{$tablet-device} {
				height: 130px;
			}
		}
	}
	p {
		color: $body-color;
	}
	@media #{$tablet-device} {
		padding: 50px 27px;
	}
	@media #{$large-mobile} {
		padding: 50px 20px;
	}
}
