diff --git a/src/app/profile/info/profile-info.component.ts b/src/app/profile/info/profile-info.component.ts
index 2d35077..4e39370 100644
--- a/src/app/profile/info/profile-info.component.ts
+++ b/src/app/profile/info/profile-info.component.ts
@@ -16,9 +16,18 @@ export class ProfileInfoComponent {
 
     activities: any;
     profile: noosfero.Profile;
+    showInformation: boolean = false;
 
     constructor(private profileService: ProfileService, private amDateFormatFilter: any) {
         this.init();
+        this.showInformation = false;
+    }
+
+    toggleInformation() {
+      console.log(this.showInformation);
+      console.log("argila");
+      this.showInformation = !this.showInformation;
+      console.log(this.showInformation);
     }
 
     init() {
diff --git a/src/app/profile/info/profile-info.html b/src/app/profile/info/profile-info.html
index eb1068a..bdffa27 100644
--- a/src/app/profile/info/profile-info.html
+++ b/src/app/profile/info/profile-info.html
@@ -28,11 +28,12 @@
     </div>
   </div>
 </div> -->
-<div class="bg-image" style="background-color: black";>
+
+<div class="bg-image" style="background-color: grey";>
 
 </div>
 
-<div class="container" id="noosfero-profile" style="background-color: aqua";>
+<div class="container" id="noosfero-profile">
     <div class="col-sm-2">
         <noosfero-profile-image [profile]="vm.profile" class="img-avatar-main" data-pin-nopin="true"></noosfero-profile-image>
         <ul class="social">
@@ -48,12 +49,11 @@
         <br />
         <p class="pull-left">www.noosfero.gov.br/<strong>patriciaoliveira</strong></p>
         <div class="pull-right info-contato">
-                <button type="button" class="btn btn-sm" data-toggle="collapse" data-target="#infocontato">Informações de Contato</button>
-                <div id="infocontato" class="collapse">
-                    <br /><p>patricia@oliveira.com<br />
-                    61 9999-9999</p>
-                </div>
+          <button ng-click="vm.toggleInformation()" class="btn btn-sm">Informações de Contato</button>
+          <div clas="profile-contact" ng-show="vm.showInformation">
+              <p class="email">patricia@oliveira.com</p>
+              <p class="phone">61 9999-9999</p>
+          </div>
         </div>
     </div>
 </div>
-
diff --git a/src/app/profile/profile.component.ts b/src/app/profile/profile.component.ts
index 7b03124..a86dabe 100644
--- a/src/app/profile/profile.component.ts
+++ b/src/app/profile/profile.component.ts
@@ -14,8 +14,7 @@ import {ProfileActionsComponent} from "./profile-actions.component";
 import {ConfigBarComponent} from "./config-bar.component";
 /**
  * @ngdoc controller
- * @name profile.Profile
- * @description
+ * @name profile.Profile * @description
  *  This is the profile controller. It provide routes to supported Noosfero Profiles.
  */
 
@@ -148,4 +147,6 @@ export class ProfileComponent {
             notificationService.error({ message: "notification.profile.not_found" });
         });
     }
+
+
 }
diff --git a/src/app/profile/profile.scss b/src/app/profile/profile.scss
index 414b261..477f187 100644
--- a/src/app/profile/profile.scss
+++ b/src/app/profile/profile.scss
@@ -145,6 +145,7 @@ a{
 
 /* NOOSFERO PROFILE */
 .bg-image {}
+
 #noosfero-profile {
   background:#fff;
   margin: -200px auto auto;
@@ -164,7 +165,19 @@ a{
   h3 {
     margin-top: 16px;
   }
+  .btn {
+    font-size: 12px;
+    padding: 5px 10px;
+  }
+  .profile-contact {
+    padding-top: 10px;
+  
+    p {
+      margin: 0px;
+    }
+  }
 }
+
 ul.social {list-style:none; text-align:center;padding:0; margin:0;}
 #infocontato {max-width:200px;}
 #infocontato .alert-info{margin:.5rem 0;
--
libgit2 0.21.2