@charset "utf-8";

:root {
	--contactTitleColor: #000;
	--contactTitleSize: 24px;
	--contactTitleBorderColor: #aaa;
	--contactFontColor: #000;
	--contactFontSize: 16px;
}

.contactUsPage {
	padding: 0 0 40px 0; width: 100%;
}
.contactUsPage > .title,
.contactUsContent > .title {
	color: var(--contactTitleColor); font-size: var(--contactTitleSize); font-weight: bold;
	width: 100%; border-bottom: var(--contactTitleBorderColor) 1px solid; padding: 0 0 5px 0; margin: 0 0 10px 0;
}
.contactUsPage > .title img,
.contactUsContent > .title img {
	height: 40px; margin: 0 10px 0 0;
}
.contactUsPage > .content {
	padding: 0 10px;
}

.contactUsContent {
	padding: 40px 100px 40px 100px;
	display: flex; flex-flow: row wrap; align-items: flex-start; justify-content: flex-start;
}
.contactUsContent > .content {
	padding: 0 10px; flex-grow: 1; width: 100%; box-sizing: border-box; color: var(--contactFontColor); font-size: var(--contactFontSize); line-height: 2em;
	display: flex; flex-flow: row nowrap; align-items: flex-start; justify-content: flex-start;
}
.contactUsContent > .content > .name {
	width: 100px;
}
.contactUsContent > .content > .value {
	flex: 3; font-weight: bold;
}
.contactUsContent > .content img {
	height: 16px; margin: 0 10px 0 0;
}

.contactUsForm {
	padding: 40px 100px 40px 100px !important;
}

@media only screen and (max-width:960px) {
	.contactUsContent {
		padding: 40px 20px 40px 20px;
	}
	.contactUsForm {
		padding: 40px 20px 40px 20px !important;
	}
}
