diff --git a/src/app/pages/dashboard/weather/weather.component.html b/src/app/pages/dashboard/weather/weather.component.html
index eba19914..5df699d4 100644
--- a/src/app/pages/dashboard/weather/weather.component.html
+++ b/src/app/pages/dashboard/weather/weather.component.html
@@ -1,58 +1,51 @@
 <nb-card size="medium">
   <nb-card-body>
-    <div class="location">
-      <span>New York</span>
+    <span class="h3 location">New York</span>
+    <span class="date">Mon 29 May</span>
+
+    <div class="today">
+      <span class="today-temperature h1">20&deg;</span>
+      <nb-icon icon="sun-outline" pack="eva" class="today-icon"></nb-icon>
     </div>
-    <div class="date">
-      <span>Mon 29 May</span>
-    </div>
-    <div class="daily-forecast">
-      <div class="info">
-        <div class="temperature">
-          <span>20&deg;</span>
-        </div>
-        <div class="icon">
-          <i class="ion-ios-sunny-outline"></i>
-        </div>
+
+    <div class="today-details">
+      <div class="parameter">
+        <span class="caption parameter-name">max</span>
+        <span class="parameter-value">23&deg;</span>
       </div>
-      <div class="details">
-        <div class="parameter">
-          <span class="parameter-name">max</span>
-          <span class="parameter-value">23&deg;</span>
-        </div>
-        <div class="parameter">
-          <span class="parameter-name">min</span>
-          <span class="parameter-value">19&deg;</span>
-        </div>
-        <div class="parameter">
-          <span class="parameter-name">wind</span>
-          <span class="parameter-value">4 km/h</span>
-        </div>
-        <div class="parameter">
-          <span class="parameter-name">hum</span>
-          <span class="parameter-value">87%</span>
-        </div>
+      <div class="parameter">
+        <span class="caption parameter-name">min</span>
+        <span class="parameter-value">19&deg;</span>
+      </div>
+      <div class="parameter">
+        <span class="caption parameter-name">wind</span>
+        <span class="parameter-value">4 km/h</span>
+      </div>
+      <div class="parameter">
+        <span class="caption parameter-name">hum</span>
+        <span class="parameter-value">87%</span>
       </div>
     </div>
+
     <div class="weekly-forecast">
       <div class="day">
         <span class="caption">Sun</span>
-        <i class="ion-ios-cloudy-outline"></i>
+        <i class="weather-icon ion-ios-cloudy-outline"></i>
         <span class="temperature">17&deg;</span>
       </div>
       <div class="day">
         <span class="caption">Mon</span>
-        <i class="ion-ios-sunny-outline"></i>
+        <i class="weather-icon ion-ios-sunny-outline"></i>
         <span class="temperature">19&deg;</span>
       </div>
       <div class="day">
         <span class="caption">Tue</span>
-        <i class="ion-ios-rainy-outline"></i>
+        <i class="weather-icon ion-ios-rainy-outline"></i>
         <span class="temperature">22&deg;</span>
       </div>
       <div class="day">
         <span class="caption">Wed</span>
-        <i class="ion-ios-partlysunny-outline"></i>
+        <i class="weather-icon ion-ios-partlysunny-outline"></i>
         <span class="temperature">21&deg;</span>
       </div>
     </div>
diff --git a/src/app/pages/dashboard/weather/weather.component.scss b/src/app/pages/dashboard/weather/weather.component.scss
index 9173cedd..2ac7e097 100644
--- a/src/app/pages/dashboard/weather/weather.component.scss
+++ b/src/app/pages/dashboard/weather/weather.component.scss
@@ -1,132 +1,76 @@
 @import '../../../@theme/styles/themes';
-@import '~@nebular/theme/styles/global/breakpoints';
-@import '~bootstrap/scss/mixins/breakpoints';
 
 @include nb-install-component() {
 
-  nb-card {
-    background-image: nb-theme(radial-gradient);
+  nb-card-body {
+    display: flex;
+    flex-direction: column;
   }
 
-  nb-card-body {
-    height: 100%;
-    padding: 2rem;
-    color: nb-theme(color-fg);
+  .location,
+  .date {
+    display: block;
   }
 
   .location {
-    font-family: nb-theme(font-secondary);
-    font-size: 2.5rem;
-    font-weight: nb-theme(font-weight-normal);
-    color: nb-theme(color-fg-heading);
+    margin-bottom: 0.1rem;
   }
 
-  .date {
-    font-family: nb-theme(font-main);
-    font-size: 1.25rem;
-    line-height: 1.25rem;
-    font-weight: nb-theme(font-weight-light);
+  .today {
+    display: flex;
+    justify-content: space-around;
   }
 
-  .daily-forecast {
+  .today-temperature {
     display: flex;
     flex-direction: column;
-    margin-top: -1.5rem;
+    justify-content: center;
+    margin: 2rem 1.5rem;
+  }
 
-    .info {
-      display: flex;
-      justify-content: space-around;
+  .today-icon {
+    color: nb-theme(color-primary-default);
+    font-size: 10rem;
+    line-height: 1;
+    margin-top: -4rem;
+    margin-left: auto;
+    margin-right: 0.4rem;
+  }
 
-      .temperature {
-        font-size: 5rem;
-        font-weight: nb-theme(font-weight-bolder);
-        font-family: nb-theme(font-secondary);
-        color: nb-theme(color-fg-heading);
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        margin-top: 2rem;
-      }
+  .today-details {
+    display: flex;
+    justify-content: space-around;
+    margin-top: 2rem;
+  }
 
-      .icon {
-        font-size: 10rem;
-        line-height: 10rem;
-        color: nb-theme(color-success);
+  .parameter {
+    flex: 1 1 auto;
+    text-align: center;
+  }
 
-        @include nb-for-theme(cosmic) {
-          color: nb-theme(color-fg);
-          text-shadow: 0 3px 0 #665ebd,
-          0 4px 10px rgba(33, 7, 77, 0.5),
-          0 2px 10px #928dff;
-        }
+  .parameter-name,
+  .parameter-value {
+    display: block;
+  }
 
-        @include nb-for-theme(corporate) {
-          color: nb-theme(color-warning);
-        }
-      }
-    }
-
-    .details {
-      display: flex;
-      justify-content: space-around;
-
-      .parameter {
-        display: flex;
-        flex-direction: column;
-        text-align: center;
-
-        .parameter-name {
-          font-family: nb-theme(font-main);
-          font-size: 1.25rem;
-          font-weight: nb-theme(font-weight-light);
-          line-height: 2rem;
-        }
-
-        .parameter-value {
-          font-family: nb-theme(font-secondary);
-          color: nb-theme(color-fg-heading);
-          font-weight: nb-theme(font-weight-bolder);
-        }
-      }
-    }
+  .caption {
+    text-transform: uppercase;
   }
 
   .weekly-forecast {
     display: flex;
     justify-content: space-around;
-    margin-top: 2rem;
-
-    .day {
-      display: flex;
-      flex-direction: column;
-      text-align: center;
-
-      .caption {
-        text-transform: uppercase;
-        font-family: nb-theme(font-secondary);
-        color: nb-theme(color-fg-heading);
-        font-weight: nb-theme(font-weight-bold);
-        font-size: 1.25rem;
-      }
-
-      i {
-        font-size: 2.5rem;
-        line-height: 2.5rem;
-      }
-
-      .temperature {
-        color: nb-theme(color-fg-heading);
-        font-family: nb-theme(font-secondary);
-        font-weight: nb-theme(font-weight-bold);
-        font-size: 1.25rem;
-      }
-    }
+    margin: auto 0;
   }
 
-  @include media-breakpoint-down(xs) {
-    nb-card-body {
-      padding-left: 1rem;
-      padding-right: 1rem;
-    }
+  .day {
+    display: flex;
+    flex-direction: column;
+    text-align: center;
+  }
+
+  .weather-icon {
+    font-size: 2.5rem;
+    line-height: 2.5rem;
   }
 }