1 files changed, 41 insertions, 16 deletions

diff --git a/plugins/jetpack/modules/contact-form/css/grunion.css b/plugins/jetpack/modules/contact-form/css/grunion.css
index 1089188d..af3585b6 100644
--- a/plugins/jetpack/modules/contact-form/css/grunion.css
+++ b/plugins/jetpack/modules/contact-form/css/grunion.css
@@ -14,47 +14,59 @@
 
 .contact-form input[type='text'],
 .contact-form input[type='email'],
+.contact-form input[type='tel'],
 .contact-form input[type='url'] {
-	width: 300px;
-	max-width: 98%;
-	margin-bottom: 13px;
+	box-sizing: border-box;
+	margin-bottom: 0.75em;
+	width: 100%;
 }
 
 .contact-form select {
-	margin-bottom: 13px;
+	margin-bottom: 0.75em;
 }
 
 .contact-form textarea {
-	height: 200px;
-	width: 80%;
+	box-sizing: border-box;
 	float: none;
-	margin-bottom: 13px;
+	height: 200px;
+	margin-bottom: 0.75em;
+	width: 100%;
 }
 
 .contact-form input[type='radio'],
 .contact-form input[type='checkbox'] {
 	float: none;
-	margin-bottom: 13px;
+	margin-bottom: 0.75em;
+	vertical-align: bottom;
+	vertical-align: -webkit-baseline-middle;
+	vertical-align: -moz-middle-with-baseline;
 }
 
 .contact-form label {
-	margin-bottom: 3px;
+	margin-bottom: 0.25em;
 	float: none;
 	font-weight: bold;
 	display: block;
 }
 
 .contact-form label.checkbox,
+.contact-form label.checkbox-multiple,
 .contact-form label.radio {
-	margin-bottom: 3px;
+	margin-bottom: 0.25em;
 	float: none;
-	font-weight: bold;
+	font-weight: normal;
 	display: inline-block;
 }
 
+.contact-form .grunion-field-checkbox-wrap,
+.contact-form .grunion-field-checkbox-multiple-wrap,
+.contact-form .grunion-field-radio-wrap {
+	margin-bottom: 0.5em;
+}
+
 .contact-form label span {
 	color: #AAA;
-	margin-left: 4px;
+	margin-left: 0.25em;
 	font-weight: normal;
 }
 
@@ -74,11 +86,15 @@
 
 .textwidget .contact-form input[type='text'],
 .textwidget .contact-form input[type='email'],
+.textwidget .contact-form input[type='tel'],
 .textwidget .contact-form input[type='url'],
-.textwidget .contact-form textarea {
-	width: 250px;
-	max-width: 100%;
-	box-sizing: border-box;
+.textwidget .contact-form textarea,
+.wp-block-column .contact-form input[type='text'],
+.wp-block-column .contact-form input[type='email'],
+.wp-block-column .contact-form input[type='tel'],
+.wp-block-column .contact-form input[type='url'],
+.wp-block-column .contact-form textarea {
+	width: 100%;
 }
 
 #jetpack-check-feedback-spam {
@@ -89,3 +105,12 @@
 	display: inline-block;
 	margin-top: 7px;
 }
+
+@media only screen and (min-width: 600px) {
+	.contact-form input[type='text'],
+	.contact-form input[type='email'],
+	.contact-form input[type='tel'],
+	.contact-form input[type='url'] {
+		width: 50%;
+	}
+}