changes on style for MD

src/app/pages/agenda/agenda.page.html

@@ -1,6 +1,19 @@
 
 <ion-header>
-  <ion-toolbar>
+  <ion-toolbar class="bg-blue">
+    <div class="div-top-header">
+    <div class="div-search">
+      <ion-icon src='assets/images/icons-search.svg'></ion-icon>
+    </div>
+    <div class="div-logo">
+      <img src='assets/images/logo-no-bg.png' alt='logo'>
+    </div>
+    <div class="div-profile">
+      <ion-icon src='assets/images/icons-profile.svg'></ion-icon>
+    </div>
+  </div>
+  </ion-toolbar>
+  <ion-toolbar class="bg-blue">
     <ion-buttons slot="end">
       <!-- customized TOGGLE button -->
       <div class="toggleBox">

src/app/pages/agenda/agenda.page.scss

@@ -145,7 +145,7 @@ Calendar
 */
 /* NEW CSS FOR TOGGLE BUTTON */
 .toggleBox{
-  margin:20px 20px 0 0;
+  margin:20px 12px 7px 0;
 }
 input[type="checkbox"]{
   position: relative;
@@ -214,7 +214,34 @@ label{
   font-size: 25px;
   margin: 0 5px 0 25px;
   padding: 0;
-  color:#000;
+  color:#ffffff;
   float: left;
 }
 
+.div-top-header{
+  width: 400px;
+  height: 50px;
+  margin: 6px auto;
+  background-color: #0782c9;
+  overflow: auto;
+}
+.div-search{
+  font-size: 45px;
+  float: left;
+  margin: 0 0 0 10px
+}
+.div-logo{
+  background: transparent;
+  width: 150px;
+  margin: 2.5px 0 2.5px 71px;
+  float: left;
+}
+.div-logo img{
+  width: 100%;
+}
+.div-profile{
+  font-size: 45px;
+  float: right;
+  margin-right: 10px;
+}
+