diff --git a/app/assets/images/logo_header.png b/app/assets/images/logo_header.png
index 84478da83..a43ca626f 100644
Binary files a/app/assets/images/logo_header.png and b/app/assets/images/logo_header.png differ
diff --git a/app/assets/stylesheets/_consul_settings.scss b/app/assets/stylesheets/_consul_settings.scss
index 0410655ab..ea97131f6 100644
--- a/app/assets/stylesheets/_consul_settings.scss
+++ b/app/assets/stylesheets/_consul_settings.scss
@@ -49,7 +49,7 @@ $show-header-for-stacked: true !default;
 // --------------------
 
 $body-margin: calc(50vw - #{$global-width / 2}) !default;
-$full-width-margin: calc(#{$global-width / 2} - 50vw) !default;
+$full-width-margin: #{$global-width / 2} - 50vw !default;
 
 $base-font-size:      rem-calc(17) !default;
 $base-line:           rem-calc(26) !default;
diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index 4cce7b027..05581b774 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -31,6 +31,14 @@ $table-header:   #ecf1f6;
 .admin {
   @include admin-layout;
 
+  > header {
+    border-bottom: 1px solid #eee;
+
+    > * {
+      @include full-width-background($adjust-margin: false, $adjust-padding: true);
+    }
+  }
+
   h2 {
     font-weight: 100;
     margin-bottom: $line-height;
@@ -56,17 +64,12 @@ $table-header:   #ecf1f6;
     background: #000;
     color: $white;
 
-    &::before {
-      content: none;
-    }
-
     a {
       line-height: rem-calc($line-height * 1.5);
     }
   }
 
   .top-bar {
-    border-bottom: 1px solid #eee;
     height: auto;
     padding-top: $line-height / 2;
 
@@ -118,7 +121,6 @@ $table-header:   #ecf1f6;
       margin-bottom: 0;
 
       @include breakpoint(medium) {
-        margin-left: $line-height / 2;
         margin-top: 0;
       }
 
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 4cdc650f5..06f415467 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -480,6 +480,7 @@ a {
 
 body > header,
 .wrapper > header {
+  @include grid-column-gutter;
   margin-bottom: $line-height;
 
   @include breakpoint(small down) {
@@ -519,9 +520,15 @@ body > header,
 
 .public > .wrapper > header,
 .proposal-dashboard > header {
-  @extend %brand-background;
   @include full-width-border(bottom, 1px solid $border);
-  @include full-width-background;
+
+  > * {
+    @include full-width-background($adjust-padding: true);
+  }
+
+  .top-bar {
+    @extend %brand-background;
+  }
 }
 
 .proposal-dashboard > header {
@@ -534,16 +541,18 @@ body > header,
 
 .top-bar {
   background-color: inherit;
-  padding-bottom: 0;
-  padding-top: 0;
+  padding: 0;
 
   @include breakpoint(medium) {
-    padding: 0;
+    justify-content: flex-start;
+
+    .top-bar-title {
+      flex-grow: 1;
+    }
   }
 
   ul {
     background: none;
-    padding-right: rem-calc(15);
   }
 
   .menu > li {
@@ -603,6 +612,7 @@ body > header,
 
   .top-bar-title {
     line-height: $line-height;
+    margin-right: 0;
 
     a img {
       height: rem-calc(48);
@@ -649,9 +659,8 @@ body > header,
 }
 
 .top-links {
-  @include full-width-background;
-  @include grid-column-gutter;
   background: $dark;
+  color: $white;
   display: flex;
   flex-wrap: wrap;
   font-size: $small-font-size;
@@ -691,8 +700,6 @@ body > header,
 }
 
 .subnavigation {
-  @include full-width-background;
-  @include grid-column-gutter;
   display: flex;
   flex-direction: column;
 
@@ -787,11 +794,6 @@ body > header,
   }
 }
 
-.subnavigation-with-top-links {
-  padding-left: 0;
-  padding-right: 0;
-}
-
 .top-bar-right {
 
   .is-active {
diff --git a/app/assets/stylesheets/mixins/layouts.scss b/app/assets/stylesheets/mixins/layouts.scss
index b2b2a073c..445e8e6f0 100644
--- a/app/assets/stylesheets/mixins/layouts.scss
+++ b/app/assets/stylesheets/mixins/layouts.scss
@@ -23,7 +23,8 @@
   }
 }
 
-@mixin full-width-cover {
+@mixin full-width-cover($adjust-margin: true, $adjust-padding: false) {
+  $global-padding: rem-calc(map-get($grid-column-gutter, medium)) / 2;
   bottom: 0;
   content: "";
   display: block;
@@ -33,27 +34,45 @@
   right: 0;
   top: 0;
 
+  @if $adjust-padding {
+    $small-padding: rem-calc(map-get($grid-column-gutter, small)) / 2;
+
+    left: -$small-padding;
+    right: -$small-padding;
+
+    @include breakpoint(medium) {
+      left: -$global-padding;
+      right: -$global-padding;
+    }
+  }
+
   @include breakpoint($global-width) {
-    left: $full-width-margin;
-    right: $full-width-margin;
+
+    @if $adjust-padding and $adjust-margin {
+      left: calc(#{$full-width-margin} - #{$global-padding});
+      right: calc(#{$full-width-margin} - #{$global-padding});
+    } @else if $adjust-margin {
+      left: calc(#{$full-width-margin});
+      right: calc(#{$full-width-margin});
+    }
   }
 }
 
-@mixin full-width-background {
+@mixin full-width-background($adjust-margin: true, $adjust-padding: false) {
   position: relative;
 
   &::before {
-    @include full-width-cover;
+    @include full-width-cover($adjust-margin: $adjust-margin, $adjust-padding: $adjust-padding);
     background: inherit;
     z-index: -1;
   }
 }
 
-@mixin full-width-border($position, $border) {
+@mixin full-width-border($position, $border, $adjust-margin: true, $adjust-padding: false) {
   position: relative;
 
   &::after {
-    @include full-width-cover;
+    @include full-width-cover($adjust-margin: $adjust-margin, $adjust-padding: $adjust-padding);
     border-#{$position}: $border;
   }
 }
diff --git a/app/models/site_customization/image.rb b/app/models/site_customization/image.rb
index 77f0e16ab..fc6bcfd71 100644
--- a/app/models/site_customization/image.rb
+++ b/app/models/site_customization/image.rb
@@ -43,7 +43,12 @@ class SiteCustomization::Image < ApplicationRecord
 
       dimensions = Paperclip::Geometry.from_file(image.queued_for_write[:original].path)
 
-      errors.add(:image, :image_width, required_width: required_width) unless dimensions.width == required_width
+      if name == "logo_header"
+        errors.add(:image, :image_width, required_width: required_width) unless dimensions.width <= required_width
+      else
+        errors.add(:image, :image_width, required_width: required_width) unless dimensions.width == required_width
+      end
+
       errors.add(:image, :image_height, required_height: required_height) unless dimensions.height == required_height
     end
 end
diff --git a/spec/factories/administration.rb b/spec/factories/administration.rb
index 7edf4c5f2..c49e06881 100644
--- a/spec/factories/administration.rb
+++ b/spec/factories/administration.rb
@@ -57,6 +57,11 @@ FactoryBot.define do
     body { "Some top links content" }
   end
 
+  factory :site_customization_image, class: "SiteCustomization::Image" do
+    image { File.new("spec/fixtures/files/logo_header.png") }
+    name { "logo_header" }
+  end
+
   factory :map_location do
     latitude { 51.48 }
     longitude { 0.0 }
diff --git a/spec/fixtures/files/logo_header-260x80.png b/spec/fixtures/files/logo_header-260x80.png
new file mode 100644
index 000000000..84478da83
Binary files /dev/null and b/spec/fixtures/files/logo_header-260x80.png differ
diff --git a/spec/fixtures/files/logo_header.png b/spec/fixtures/files/logo_header.png
index 84478da83..a43ca626f 100644
Binary files a/spec/fixtures/files/logo_header.png and b/spec/fixtures/files/logo_header.png differ
diff --git a/spec/models/site_customization/image_spec.rb b/spec/models/site_customization/image_spec.rb
new file mode 100644
index 000000000..5c755dbfe
--- /dev/null
+++ b/spec/models/site_customization/image_spec.rb
@@ -0,0 +1,29 @@
+require "rails_helper"
+
+describe SiteCustomization::Image do
+  describe "logo" do
+    it "is valid with a 260x80 image" do
+      image = build(:site_customization_image,
+                    name: "logo_header",
+                    image: File.new("spec/fixtures/files/logo_header-260x80.png"))
+
+      expect(image).to be_valid
+    end
+
+    it "is valid with a 223x80 image" do
+      image = build(:site_customization_image,
+                    name: "logo_header",
+                    image: File.new("spec/fixtures/files/logo_header.png"))
+
+      expect(image).to be_valid
+    end
+
+    it "is not valid with a 400x80 image" do
+      image = build(:site_customization_image,
+                    name: "logo_header",
+                    image: File.new("spec/fixtures/files/logo_email_custom.png"))
+
+      expect(image).not_to be_valid
+    end
+  end
+end