Просмотр исходного кода

Hever: Minor tweaks to make mobile menu spacing consistent

Allan Cole 5 лет назад
Родитель
Сommit
06311f3b26
4 измененных файлов с 141 добавлено и 154 удалено
  1. 5 8
      hever/sass/_extra-child-theme.scss
  2. 48 38
      hever/style-editor.css
  3. 44 54
      hever/style-rtl.css
  4. 44 54
      hever/style.css

+ 5 - 8
hever/sass/_extra-child-theme.scss

@@ -169,14 +169,11 @@ a {
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type,
-.social-navigation > div > ul > li:first-of-type {
-	margin-left: 0;
-}
-
-.main-navigation > div > ul > li:last-of-type,
-.social-navigation > div > ul > li:last-of-type {
-	margin-right: 0;
+// Main Menu
+@include media(mobile-only) {
+	.main-navigation > div > ul > li > a {
+		line-height: inherit;
+	}
 }
 }
 
 
 // Social Menu
 // Social Menu

+ 48 - 38
hever/style-editor.css

@@ -430,6 +430,45 @@ object {
 	padding-left: 0;
 	padding-left: 0;
 }
 }
 
 
+.wp-block-latest-posts > li > a {
+	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-size: 1.52087rem;
+	font-weight: bold;
+	line-height: 1.125;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li {
+	/* Vertical margins logic */
+	margin-top: 32px;
+	margin-bottom: 32px;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li:first-child {
+	margin-top: 0;
+}
+
+.wp-block-latest-posts:not(.is-grid) > li:last-child {
+	margin-bottom: 0;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: #757575;
+	font-size: 0.86957rem;
+	line-height: 1.6;
+}
+
+[class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
+	font-size: 0.86957rem;
+	line-height: 1.6;
+	margin: 0;
+}
+
 .wp-block-media-text .block-editor-inner-blocks {
 .wp-block-media-text .block-editor-inner-blocks {
 	padding-right: 16px;
 	padding-right: 16px;
 	padding-left: 16px;
 	padding-left: 16px;
@@ -638,14 +677,20 @@ table th,
 	color: white !important;
 	color: white !important;
 }
 }
 
 
+.has-background:not(.has-background-background-color) a,
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
+.has-background .wp-block-quote__citation {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #1279BE !important;
 	background-color: #1279BE !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-primary-background-color[class] p, .has-primary-background-color[class] h1, .has-primary-background-color[class] h2, .has-primary-background-color[class] h3, .has-primary-background-color[class] h4, .has-primary-background-color[class] h5, .has-primary-background-color[class] h6,
-.has-primary-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
+.has-primary-background-color[class] {
+	background-color: #1279BE !important;
+	color: white;
 }
 }
 
 
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
@@ -653,71 +698,36 @@ table th,
 	color: white;
 	color: white;
 }
 }
 
 
-.has-secondary-background-color[class] p, .has-secondary-background-color[class] h1, .has-secondary-background-color[class] h2, .has-secondary-background-color[class] h3, .has-secondary-background-color[class] h4, .has-secondary-background-color[class] h5, .has-secondary-background-color[class] h6,
-.has-secondary-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #303030 !important;
 	background-color: #303030 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-background-color[class] p, .has-foreground-background-color[class] h1, .has-foreground-background-color[class] h2, .has-foreground-background-color[class] h3, .has-foreground-background-color[class] h4, .has-foreground-background-color[class] h5, .has-foreground-background-color[class] h6,
-.has-foreground-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #757575 !important;
 	background-color: #757575 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-light-background-color[class] p, .has-foreground-light-background-color[class] h1, .has-foreground-light-background-color[class] h2, .has-foreground-light-background-color[class] h3, .has-foreground-light-background-color[class] h4, .has-foreground-light-background-color[class] h5, .has-foreground-light-background-color[class] h6,
-.has-foreground-light-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #101010 !important;
 	background-color: #101010 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-dark-background-color[class] p, .has-foreground-dark-background-color[class] h1, .has-foreground-dark-background-color[class] h2, .has-foreground-dark-background-color[class] h3, .has-foreground-dark-background-color[class] h4, .has-foreground-dark-background-color[class] h5, .has-foreground-dark-background-color[class] h6,
-.has-foreground-dark-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #F8F8F8 !important;
 	background-color: #F8F8F8 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-light-background-color[class] p, .has-background-light-background-color[class] h1, .has-background-light-background-color[class] h2, .has-background-light-background-color[class] h3, .has-background-light-background-color[class] h4, .has-background-light-background-color[class] h5, .has-background-light-background-color[class] h6,
-.has-background-light-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #C5C5C5 !important;
 	background-color: #C5C5C5 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-dark-background-color[class] p, .has-background-dark-background-color[class] h1, .has-background-dark-background-color[class] h2, .has-background-dark-background-color[class] h3, .has-background-dark-background-color[class] h4, .has-background-dark-background-color[class] h5, .has-background-dark-background-color[class] h6,
-.has-background-dark-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: white !important;
 	background-color: white !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-background-color[class] p, .has-background-background-color[class] h1, .has-background-background-color[class] h2, .has-background-background-color[class] h3, .has-background-background-color[class] h4, .has-background-background-color[class] h5, .has-background-background-color[class] h6,
-.has-background-background-color[class] .wp-block-quote__citation {
-	color: currentColor;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.86957em;
 	font-size: 0.86957em;

+ 44 - 54
hever/style-rtl.css

@@ -1531,12 +1531,29 @@ img {
 	line-height: 1.6;
 	line-height: 1.6;
 }
 }
 
 
-.wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
+.entry-content [class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.entry-content .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
 	font-size: 0.86957rem;
 	font-size: 0.86957rem;
 	line-height: 1.6;
 	line-height: 1.6;
 	margin: 0;
 	margin: 0;
 }
 }
 
 
+.wp-block-latest-posts.alignfull {
+	padding-right: 16px;
+	padding-left: 16px;
+}
+
+.entry-content [class*="inner-container"] .wp-block-latest-posts.alignfull,
+.entry-content .has-background .wp-block-latest-posts.alignfull {
+	padding-right: 0;
+	padding-left: 0;
+}
+
 .gallery-item {
 .gallery-item {
 	display: inline-block;
 	display: inline-block;
 	text-align: center;
 	text-align: center;
@@ -1659,10 +1676,6 @@ p.has-background {
 	padding: 16px 16px;
 	padding: 16px 16px;
 }
 }
 
 
-p.has-background:not(.has-background-background-color) a {
-	color: currentColor;
-}
-
 .a8c-posts-list__listing {
 .a8c-posts-list__listing {
 	list-style: none;
 	list-style: none;
 	margin: 0;
 	margin: 0;
@@ -2063,78 +2076,52 @@ table th,
 	color: white !important;
 	color: white !important;
 }
 }
 
 
+.has-background:not(.has-background-background-color) a,
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
+.has-background .wp-block-quote__citation {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #1279BE !important;
 	background-color: #1279BE !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-primary-background-color[class] p, .has-primary-background-color[class] h1, .has-primary-background-color[class] h2, .has-primary-background-color[class] h3, .has-primary-background-color[class] h4, .has-primary-background-color[class] h5, .has-primary-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
 	background-color: #FFB302 !important;
 	background-color: #FFB302 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-secondary-background-color[class] p, .has-secondary-background-color[class] h1, .has-secondary-background-color[class] h2, .has-secondary-background-color[class] h3, .has-secondary-background-color[class] h4, .has-secondary-background-color[class] h5, .has-secondary-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #303030 !important;
 	background-color: #303030 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-background-color[class] p, .has-foreground-background-color[class] h1, .has-foreground-background-color[class] h2, .has-foreground-background-color[class] h3, .has-foreground-background-color[class] h4, .has-foreground-background-color[class] h5, .has-foreground-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #757575 !important;
 	background-color: #757575 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-light-background-color[class] p, .has-foreground-light-background-color[class] h1, .has-foreground-light-background-color[class] h2, .has-foreground-light-background-color[class] h3, .has-foreground-light-background-color[class] h4, .has-foreground-light-background-color[class] h5, .has-foreground-light-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #101010 !important;
 	background-color: #101010 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-dark-background-color[class] p, .has-foreground-dark-background-color[class] h1, .has-foreground-dark-background-color[class] h2, .has-foreground-dark-background-color[class] h3, .has-foreground-dark-background-color[class] h4, .has-foreground-dark-background-color[class] h5, .has-foreground-dark-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #F8F8F8 !important;
 	background-color: #F8F8F8 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-light-background-color[class] p, .has-background-light-background-color[class] h1, .has-background-light-background-color[class] h2, .has-background-light-background-color[class] h3, .has-background-light-background-color[class] h4, .has-background-light-background-color[class] h5, .has-background-light-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #C5C5C5 !important;
 	background-color: #C5C5C5 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-dark-background-color[class] p, .has-background-dark-background-color[class] h1, .has-background-dark-background-color[class] h2, .has-background-dark-background-color[class] h3, .has-background-dark-background-color[class] h4, .has-background-dark-background-color[class] h5, .has-background-dark-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: white !important;
 	background-color: white !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-background-color[class] p, .has-background-background-color[class] h1, .has-background-background-color[class] h2, .has-background-background-color[class] h3, .has-background-background-color[class] h4, .has-background-background-color[class] h5, .has-background-background-color[class] h6 {
-	color: currentColor;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.86957rem;
 	font-size: 0.86957rem;
@@ -2430,14 +2417,6 @@ table th,
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type > a {
-	padding-right: 0;
-}
-
-.main-navigation > div > ul > li:last-of-type > a {
-	padding-left: 0;
-}
-
 .main-navigation > div > ul > li > a {
 .main-navigation > div > ul > li > a {
 	line-height: 1;
 	line-height: 1;
 }
 }
@@ -2457,6 +2436,15 @@ table th,
 	margin-top: -0.11em;
 	margin-top: -0.11em;
 }
 }
 
 
+@media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li:first-of-type > a {
+		padding-right: 0;
+	}
+	.main-navigation > div > ul > li:last-of-type > a {
+		padding-left: 0;
+	}
+}
+
 .main-navigation > div > ul > li > .sub-menu {
 .main-navigation > div > ul > li > .sub-menu {
 	margin: 0;
 	margin: 0;
 	position: relative;
 	position: relative;
@@ -2486,7 +2474,13 @@ table th,
 	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1rem;
 	font-size: 1rem;
 	font-weight: bold;
 	font-weight: bold;
-	padding: 8px;
+	padding: 8px 0;
+}
+
+@media only screen and (min-width: 560px) {
+	.main-navigation a {
+		padding: 8px;
+	}
 }
 }
 
 
 .main-navigation a:link, .main-navigation a:visited {
 .main-navigation a:link, .main-navigation a:visited {
@@ -3579,14 +3573,10 @@ p:not(.site-title) a:hover {
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type,
-.social-navigation > div > ul > li:first-of-type {
-	margin-right: 0;
-}
-
-.main-navigation > div > ul > li:last-of-type,
-.social-navigation > div > ul > li:last-of-type {
-	margin-left: 0;
+@media only screen and (max-width: 559px) {
+	.main-navigation > div > ul > li > a {
+		line-height: inherit;
+	}
 }
 }
 
 
 .social-navigation > div > ul {
 .social-navigation > div > ul {

+ 44 - 54
hever/style.css

@@ -1531,12 +1531,29 @@ img {
 	line-height: 1.6;
 	line-height: 1.6;
 }
 }
 
 
-.wp-block-latest-posts .wp-block-latest-posts__post-excerpt {
+.entry-content [class*="inner-container"] .wp-block-latest-posts .wp-block-latest-posts__post-date,
+.entry-content .has-background .wp-block-latest-posts .wp-block-latest-posts__post-date {
+	color: currentColor;
+}
+
+.wp-block-latest-posts .wp-block-latest-posts__post-excerpt,
+.wp-block-latest-posts .wp-block-latest-posts__post-full-content {
 	font-size: 0.86957rem;
 	font-size: 0.86957rem;
 	line-height: 1.6;
 	line-height: 1.6;
 	margin: 0;
 	margin: 0;
 }
 }
 
 
+.wp-block-latest-posts.alignfull {
+	padding-left: 16px;
+	padding-right: 16px;
+}
+
+.entry-content [class*="inner-container"] .wp-block-latest-posts.alignfull,
+.entry-content .has-background .wp-block-latest-posts.alignfull {
+	padding-left: 0;
+	padding-right: 0;
+}
+
 .gallery-item {
 .gallery-item {
 	display: inline-block;
 	display: inline-block;
 	text-align: center;
 	text-align: center;
@@ -1659,10 +1676,6 @@ p.has-background {
 	padding: 16px 16px;
 	padding: 16px 16px;
 }
 }
 
 
-p.has-background:not(.has-background-background-color) a {
-	color: currentColor;
-}
-
 .a8c-posts-list__listing {
 .a8c-posts-list__listing {
 	list-style: none;
 	list-style: none;
 	margin: 0;
 	margin: 0;
@@ -2068,78 +2081,52 @@ table th,
 	color: white !important;
 	color: white !important;
 }
 }
 
 
+.has-background:not(.has-background-background-color) a,
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
+.has-background .wp-block-quote__citation {
+	color: currentColor;
+}
+
 .has-primary-background-color[class] {
 .has-primary-background-color[class] {
 	background-color: #1279BE !important;
 	background-color: #1279BE !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-primary-background-color[class] p, .has-primary-background-color[class] h1, .has-primary-background-color[class] h2, .has-primary-background-color[class] h3, .has-primary-background-color[class] h4, .has-primary-background-color[class] h5, .has-primary-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-secondary-background-color[class] {
 .has-secondary-background-color[class] {
 	background-color: #FFB302 !important;
 	background-color: #FFB302 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-secondary-background-color[class] p, .has-secondary-background-color[class] h1, .has-secondary-background-color[class] h2, .has-secondary-background-color[class] h3, .has-secondary-background-color[class] h4, .has-secondary-background-color[class] h5, .has-secondary-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-background-color[class] {
 .has-foreground-background-color[class] {
 	background-color: #303030 !important;
 	background-color: #303030 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-background-color[class] p, .has-foreground-background-color[class] h1, .has-foreground-background-color[class] h2, .has-foreground-background-color[class] h3, .has-foreground-background-color[class] h4, .has-foreground-background-color[class] h5, .has-foreground-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-light-background-color[class] {
 .has-foreground-light-background-color[class] {
 	background-color: #757575 !important;
 	background-color: #757575 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-light-background-color[class] p, .has-foreground-light-background-color[class] h1, .has-foreground-light-background-color[class] h2, .has-foreground-light-background-color[class] h3, .has-foreground-light-background-color[class] h4, .has-foreground-light-background-color[class] h5, .has-foreground-light-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-foreground-dark-background-color[class] {
 .has-foreground-dark-background-color[class] {
 	background-color: #101010 !important;
 	background-color: #101010 !important;
 	color: white;
 	color: white;
 }
 }
 
 
-.has-foreground-dark-background-color[class] p, .has-foreground-dark-background-color[class] h1, .has-foreground-dark-background-color[class] h2, .has-foreground-dark-background-color[class] h3, .has-foreground-dark-background-color[class] h4, .has-foreground-dark-background-color[class] h5, .has-foreground-dark-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-light-background-color[class] {
 .has-background-light-background-color[class] {
 	background-color: #F8F8F8 !important;
 	background-color: #F8F8F8 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-light-background-color[class] p, .has-background-light-background-color[class] h1, .has-background-light-background-color[class] h2, .has-background-light-background-color[class] h3, .has-background-light-background-color[class] h4, .has-background-light-background-color[class] h5, .has-background-light-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-dark-background-color[class] {
 .has-background-dark-background-color[class] {
 	background-color: #C5C5C5 !important;
 	background-color: #C5C5C5 !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-dark-background-color[class] p, .has-background-dark-background-color[class] h1, .has-background-dark-background-color[class] h2, .has-background-dark-background-color[class] h3, .has-background-dark-background-color[class] h4, .has-background-dark-background-color[class] h5, .has-background-dark-background-color[class] h6 {
-	color: currentColor;
-}
-
 .has-background-background-color[class] {
 .has-background-background-color[class] {
 	background-color: white !important;
 	background-color: white !important;
 	color: #303030;
 	color: #303030;
 }
 }
 
 
-.has-background-background-color[class] p, .has-background-background-color[class] h1, .has-background-background-color[class] h2, .has-background-background-color[class] h3, .has-background-background-color[class] h4, .has-background-background-color[class] h5, .has-background-background-color[class] h6 {
-	color: currentColor;
-}
-
 .is-small-text,
 .is-small-text,
 .has-small-font-size {
 .has-small-font-size {
 	font-size: 0.86957rem;
 	font-size: 0.86957rem;
@@ -2435,14 +2422,6 @@ table th,
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type > a {
-	padding-left: 0;
-}
-
-.main-navigation > div > ul > li:last-of-type > a {
-	padding-right: 0;
-}
-
 .main-navigation > div > ul > li > a {
 .main-navigation > div > ul > li > a {
 	line-height: 1;
 	line-height: 1;
 }
 }
@@ -2462,6 +2441,15 @@ table th,
 	margin-top: -0.11em;
 	margin-top: -0.11em;
 }
 }
 
 
+@media only screen and (min-width: 560px) {
+	.main-navigation > div > ul > li:first-of-type > a {
+		padding-left: 0;
+	}
+	.main-navigation > div > ul > li:last-of-type > a {
+		padding-right: 0;
+	}
+}
+
 .main-navigation > div > ul > li > .sub-menu {
 .main-navigation > div > ul > li > .sub-menu {
 	margin: 0;
 	margin: 0;
 	position: relative;
 	position: relative;
@@ -2491,7 +2479,13 @@ table th,
 	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 	font-size: 1rem;
 	font-size: 1rem;
 	font-weight: bold;
 	font-weight: bold;
-	padding: 8px;
+	padding: 8px 0;
+}
+
+@media only screen and (min-width: 560px) {
+	.main-navigation a {
+		padding: 8px;
+	}
 }
 }
 
 
 .main-navigation a:link, .main-navigation a:visited {
 .main-navigation a:link, .main-navigation a:visited {
@@ -3596,14 +3590,10 @@ p:not(.site-title) a:hover {
 	}
 	}
 }
 }
 
 
-.main-navigation > div > ul > li:first-of-type,
-.social-navigation > div > ul > li:first-of-type {
-	margin-left: 0;
-}
-
-.main-navigation > div > ul > li:last-of-type,
-.social-navigation > div > ul > li:last-of-type {
-	margin-right: 0;
+@media only screen and (max-width: 559px) {
+	.main-navigation > div > ul > li > a {
+		line-height: inherit;
+	}
 }
 }
 
 
 .social-navigation > div > ul {
 .social-navigation > div > ul {