diff --git a/src/Umbraco.Web.UI.Client/src/less/properties.less b/src/Umbraco.Web.UI.Client/src/less/properties.less
index 06f05ab0aa..2e700dd77a 100644
--- a/src/Umbraco.Web.UI.Client/src/less/properties.less
+++ b/src/Umbraco.Web.UI.Client/src/less/properties.less
@@ -1,23 +1,21 @@
 //----- SCHEDULED PUBLISH ------
 
-.place-holder {
-    height: 60px;
-    width: 60px;
-    margin: 15px auto;
-    background-color: @gray-8;
-}
-
 .date-wrapper {
     display: flex;
-    justify-content: space-around;
     flex-direction: row;
+    border-top: 1px solid @gray-10;
+    border-bottom: 1px solid @gray-10;
+}
+
+.date-wrapper__date {
+    padding: 10px;
 }
 
 .date-container {
     text-align: center;
 }
 
-.date-wrapper__number{
+.date-wrapper__number {
     font-size: 40px;
     line-height: 50px;
     color: @gray-2;
@@ -31,21 +29,21 @@
     margin-bottom: 5px;
 }
 
-.date-container__date {
-    padding: 0 10px;
-}
 .date-container__date:hover {
     background-color: @gray-10;
     cursor: pointer;
 }
 
-.date-wrapper__date{
-    font-size: 13px;
-    color: @gray-6;
-    margin: 0;
+.date-wrapper__date {
+    padding: 10px;
+    flex: 1 1 50%;
 }
 
-.data-wrapper__add{
+.date-wrapper__date:last-of-type {
+    border-left: 1px solid @gray-10;
+}
+
+.data-wrapper__add { 
     font-size: 18px;
     line-height: 10px;
     color: @gray-8;
@@ -53,11 +51,6 @@
     margin: 0;
 }
 
-.date-separate {
-    width: 1px;
-    background-color: @gray-8;
-}
-
 //------------------- HISTORY ------------------
 
 .history {
diff --git a/src/Umbraco.Web.UI.Client/src/views/content/overlays/schedule.html b/src/Umbraco.Web.UI.Client/src/views/content/overlays/schedule.html
index 2547eec32b..1a170b9d75 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/overlays/schedule.html
+++ b/src/Umbraco.Web.UI.Client/src/views/content/overlays/schedule.html
@@ -7,62 +7,63 @@
             <p><localize key="content_languagesToSchedule"></localize></p>
         </div>
 
-        <div>
+        <div class="date-wrapper">
+            <div class="date-wrapper__date">
+                <label class="bold">
+                    <localize key="content_releaseDate"></localize>
+                </label>
+                
+                <div class="btn-group flex" style="font-size: 15px;">
+                    <umb-date-time-picker 
+                        options="vm.datePickerConfig"
+                        on-change="vm.datePickerChange(vm.variants[0], event, 'publish')"
+                        on-show="vm.datePickerShow()"
+                        on-hide="vm.datePickerClose()">
 
-            <div class="bold">
-                <localize key="content_releaseDate"></localize>
-            </div>
-            
-            <div class="btn-group flex" style="font-size: 14px; margin-right: 10px;">
-                <umb-date-time-picker 
-                    options="vm.datePickerConfig"
-                    on-change="vm.datePickerChange(vm.variants[0], event, 'publish')"
-                    on-show="vm.datePickerShow()"
-                    on-hide="vm.datePickerClose()">
+                        <div ng-if="vm.variants[0].releaseDate" class="btn umb-button--xs">
+                            {{vm.variants[0].releaseDateFormatted}}
+                        </div>
 
-                    <div ng-if="vm.variants[0].releaseDate" class="btn umb-button--xxs">
-                        {{vm.variants[0].releaseDateFormatted}}
-                    </div>
+                        <a ng-hide="vm.variants[0].releaseDate" href="" class="bold" style="color: #00aea2; text-decoration: underline;">
+                            <localize key="content_setDate">Set date</localize>
+                        </a>
 
-                    <a ng-hide="vm.variants[0].releaseDate" href="" class="bold" style="color: #00aea2; text-decoration: underline;">
-                        <localize key="content_setDate">Set date</localize>
+                    </umb-date-time-picker>
+
+                    <a ng-if="vm.variants[0].releaseDate" ng-click="vm.clearPublishDate(vm.variants[0])" class="btn umb-button--xs dropdown-toggle umb-button-group__toggle" style="margin-left: -2px;">
+                        <span class="icon icon-wrong"></span>
                     </a>
-
-                </umb-date-time-picker>
-
-                <a ng-if="vm.variants[0].releaseDate" ng-click="vm.clearPublishDate(vm.variants[0])" class="btn umb-button--xxs dropdown-toggle umb-button-group__toggle" style="margin-left: -2px;">
-                    <span class="icon icon-wrong"></span>
-                </a>
+                </div>
             </div>
 
-            <div class="bold">
-                <localize key="content_unpublishDate"></localize>
-            </div>
+            <div class="date-wrapper__date">
+                <label class="bold">
+                    <localize key="content_unpublishDate"></localize>
+                </label>
 
-            <div class="btn-group flex" style="font-size: 14px;">
-                <umb-date-time-picker 
-                    options="vm.datePickerConfig"
-                    on-change="vm.datePickerChange(vm.variants[0], event, 'unpublish')"
-                    on-show="vm.datePickerShow()"
-                    on-hide="vm.datePickerClose()">
+                <div class="btn-group flex" style="font-size: 15px;">
+                    <umb-date-time-picker 
+                        options="vm.datePickerConfig"
+                        on-change="vm.datePickerChange(vm.variants[0], event, 'unpublish')"
+                        on-show="vm.datePickerShow()"
+                        on-hide="vm.datePickerClose()">
 
-                    <div ng-if="vm.variants[0].removeDate" class="btn umb-button--xxs">
-                        {{vm.variants[0].removeDateFormatted}}
-                    </div>
-    
-                    <a ng-hide="vm.variants[0].removeDate" href="" class="bold" style="color: #00aea2; text-decoration: underline;">
-                        <localize key="content_setDate">Set date</localize>
+                        <div ng-if="vm.variants[0].removeDate" class="btn umb-button--xs">
+                            {{vm.variants[0].removeDateFormatted}}
+                        </div>
+        
+                        <a ng-hide="vm.variants[0].removeDate" href="" class="bold" style="color: #00aea2; text-decoration: underline;">
+                            <localize key="content_setDate">Set date</localize>
+                        </a>
+
+                    </umb-date-time-picker>
+
+                    <a ng-if="vm.variants[0].removeDate" ng-click="vm.clearUnpublishDate(vm.variants[0])" class="btn umb-button--xs dropdown-toggle umb-button-group__toggle" style="margin-left: -2px;">
+                        <span class="icon icon-wrong"></span>
                     </a>
-
-                </umb-date-time-picker>
-
-                <a ng-if="vm.variants[0].removeDate" ng-click="vm.clearUnpublishDate(vm.variants[0])" class="btn umb-button--xxs dropdown-toggle umb-button-group__toggle" style="margin-left: -2px;">
-                    <span class="icon icon-wrong"></span>
-                </a>
+                </div>
             </div>
-
         </div>
-
     </div>
 
     <!-- nodes with variants -->