diff --git a/sass/_header.scss b/sass/_header.scss
index 07efa5f..fe725c6 100644
--- a/sass/_header.scss
+++ b/sass/_header.scss
@@ -11,7 +11,11 @@
.site-header__container {
display: flex;
align-items: center;
- padding: .2em 2em;
+ padding: .2em 2em;
+
+ @include tablet {
+ padding: .2em 1em;
+ }
.site-header__mobile-menu {
@include desktop {
diff --git a/sass/_search.scss b/sass/_search.scss
index d62dcf1..99e91f8 100644
--- a/sass/_search.scss
+++ b/sass/_search.scss
@@ -1,12 +1,17 @@
.site-header__search {
#search {
- background-image: url("data:image/svg+xml; utf8, ");
- background-repeat: no-repeat;
- border-color: transparent;
- border-radius: 2px;
- padding-top: 5px;
- padding-bottom: 5px;
- padding-left: 40px;
+ border-color: transparent;
+ border-radius: 2px;
+ padding-top: 5px;
+ padding-bottom: 5px;
+ margin-left: 10px;
+
+ // Hide "s" icon on small screens to avoid search-box overflow
+ @media (min-width: 400px) {
+ background-image: url("data:image/svg+xml; utf8, ");
+ background-repeat: no-repeat;
+ padding-left: 40px;
+ }
}
li.selected, li:hover {