diff --git a/src/skins/vector/css/molecules/MessageComposer.css b/src/skins/vector/css/molecules/MessageComposer.css
index 7a767e1f82..4d5668518d 100644
--- a/src/skins/vector/css/molecules/MessageComposer.css
+++ b/src/skins/vector/css/molecules/MessageComposer.css
@@ -72,6 +72,7 @@ limitations under the License.
 }
 
 .mx_MessageComposer_upload,
+.mx_MessageComposer_hangup,
 .mx_MessageComposer_voicecall,
 .mx_MessageComposer_videocall {
     display: table-cell;
diff --git a/src/skins/vector/css/organisms/RoomView.css b/src/skins/vector/css/organisms/RoomView.css
index 0678d1c9dd..dec572954d 100644
--- a/src/skins/vector/css/organisms/RoomView.css
+++ b/src/skins/vector/css/organisms/RoomView.css
@@ -166,15 +166,39 @@ limitations under the License.
     max-width: 960px;
     margin: auto;
     min-height: 36px;
-    overflow-y: hidden;
 }
 
 .mx_RoomView_statusAreaBox_line {
     border-top: 1px solid #eee;
-/*  margin-left: 63px; */
     height: 1px;
 }
 
+.mx_RoomView_inCall .mx_RoomView_statusAreaBox_line {
+    border-top: 1px hidden;
+}
+
+.mx_RoomView_inCall .mx_MessageComposer_wrapper {
+    border-top: 2px hidden;
+}
+
+.mx_RoomView_inCall .mx_RoomView_statusAreaBox {
+    background-color: #76CFA6;    
+    color: #fff;
+    position: relative;
+}
+
+.mx_RoomView_voipChevron {
+    position: absolute;
+    bottom: -10px;
+    right: 11px;
+}
+
+.mx_RoomView_muteButton {
+    float: right;
+    margin-right: 13px;
+    cursor: pointer;
+}
+
 .mx_RoomView_unreadMessagesBar {
     color: #ff0064;
     cursor: pointer;
@@ -187,6 +211,16 @@ limitations under the License.
     vertical-align: middle;
 }
 
+.mx_RoomView_callBar {
+    margin-top: 5px;
+}
+
+.mx_RoomView_callBar img {
+    padding-left: 13px;
+    padding-right: 30px;
+    vertical-align: middle;
+}
+
 .mx_RoomView_connectionLostBar {
     margin-top: 19px;
     height: 58px;
@@ -220,6 +254,7 @@ limitations under the License.
     margin-left: 63px;
     color: #4a4a4a;
     opacity: 0.5;
+    overflow-y: hidden;
 }
 
 .mx_RoomView_typingImage {
diff --git a/src/skins/vector/img/hangup.svg b/src/skins/vector/img/hangup.svg
index 073565fb82..be038d2b30 100644
--- a/src/skins/vector/img/hangup.svg
+++ b/src/skins/vector/img/hangup.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="23px" height="24px" viewBox="0 0 23 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+<svg width="25px" height="26px" viewBox="-1 -1 25 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
     <!-- Generator: Sketch 3.4.3 (16618) - http://www.bohemiancoding.com/sketch -->
     <title>Fill 72 + Path 98</title>
     <desc>Created with Sketch.</desc>
diff --git a/src/skins/vector/img/sound-indicator.svg b/src/skins/vector/img/sound-indicator.svg
index e7601223cc..9b8de53d81 100644
--- a/src/skins/vector/img/sound-indicator.svg
+++ b/src/skins/vector/img/sound-indicator.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="21px" height="18px" viewBox="0 0 21 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+<svg width="23px" height="20px" viewBox="-1 -1 23 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
     <!-- Generator: Sketch 3.4.3 (16618) - http://www.bohemiancoding.com/sketch -->
     <title>sound_indicator</title>
     <desc>Created with Sketch.</desc>
diff --git a/src/skins/vector/img/upload-big.svg b/src/skins/vector/img/upload-big.svg
new file mode 100644
index 0000000000..6099c2e976
--- /dev/null
+++ b/src/skins/vector/img/upload-big.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="45px" height="59px" viewBox="-1 -1 45 59" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: bin/sketchtool 1.4 (305) - http://www.bohemiancoding.com/sketch -->
+    <title>icons_upload_drop</title>
+    <desc>Created with bin/sketchtool.</desc>
+    <defs></defs>
+    <g id="03-Input" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="03_05-File-drop" sketch:type="MSArtboardGroup" transform="translate(-570.000000, -368.000000)">
+            <g id="icons_upload_drop" sketch:type="MSLayerGroup" transform="translate(570.000000, 368.000000)">
+                <g id="Rectangle-5-+-Rectangle-6" sketch:type="MSShapeGroup">
+                    <path d="M0,4.00812931 C0,1.79450062 1.78537926,0 4.00241155,0 L24.8253683,0 C24.8253683,0 42.2466793,16.8210687 42.2466793,16.8210687 L42.2466793,53.000599 C42.2466793,55.2094072 40.4583762,57 38.2531894,57 L3.99348992,57 C1.78794634,57 0,55.1999609 0,52.9918707 L0,4.00812931 Z" id="Rectangle-5" stroke="#76CFA6"></path>
+                    <path d="M40.5848017,19.419576 L29.8354335,19.419576 C26.7387692,19.419576 24.2284269,16.9063989 24.2284269,13.8067771 L24.2284269,4.88501382 L40.5848017,19.419576 Z" id="Rectangle-6-Copy" fill="#FFFFFF"></path>
+                    <path d="M42.2466793,18.3870968 L29.539478,18.3870968 C26.4130381,18.3870968 23.8785579,15.8497544 23.8785579,12.7203286 L23.8785579,0" id="Rectangle-6" stroke="#76CFA6"></path>
+                </g>
+                <path d="M31.3419737,32.9284726 C31.701384,32.9284726 32.0607942,32.8000473 32.3359677,32.5414375 C32.8825707,32.0259772 32.8825707,31.1920926 32.3359677,30.6766323 L21.622922,20.6119619 C21.076319,20.0965016 20.187153,20.0982608 19.638678,20.6102026 L8.9125289,30.6607991 C8.36405391,31.1762594 8.36218198,32.0119032 8.90878504,32.5273635 C9.4553881,33.0445831 10.344554,33.0445831 10.893029,32.530882 L19.2399573,24.7092556 L19.2437012,46.487014 C19.2437012,47.2153435 19.874541,47.8064516 20.6476474,47.8064516 C21.4244976,47.8064516 22.0515936,47.2153435 22.0515936,46.487014 L22.0478497,24.7426814 L30.3498517,32.5414375 C30.6231533,32.8000473 30.9825635,32.9284726 31.3419737,32.9284726 L31.3419737,32.9284726 Z" id="Fill-75" fill="#76CFA6" sketch:type="MSShapeGroup"></path>
+            </g>
+        </g>
+    </g>
+</svg>
diff --git a/src/skins/vector/img/video-mute.svg b/src/skins/vector/img/video-mute.svg
index 776d59ad6f..6de60ba39b 100644
--- a/src/skins/vector/img/video-mute.svg
+++ b/src/skins/vector/img/video-mute.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="28px" height="20px" viewBox="0 0 28 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+<svg width="31px" height="27px" viewBox="-2 -2 31 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
     <!-- Generator: Sketch 3.4.3 (16618) - http://www.bohemiancoding.com/sketch -->
     <title>icons_video copy</title>
     <desc>Created with Sketch.</desc>
diff --git a/src/skins/vector/img/video-unmute.svg b/src/skins/vector/img/video-unmute.svg
new file mode 100644
index 0000000000..a6c6c3b681
--- /dev/null
+++ b/src/skins/vector/img/video-unmute.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="31px" height="27px" viewBox="-1 -1 31 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>icons_video copy</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="05-Voice-and-video" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="05_2-Video-call" sketch:type="MSArtboardGroup" transform="translate(-870.000000, -666.000000)" stroke="#FFFFFF">
+            <g id="icons_video-copy" sketch:type="MSLayerGroup" transform="translate(870.000000, 666.000000)">
+                <g id="Rectangle-20-+-Path-16" transform="translate(1.000000, 0.464286)" sketch:type="MSShapeGroup">
+                    <rect id="Rectangle-20" x="0" y="0.535714286" width="20" height="20" rx="4"></rect>
+                    <path d="M20.75,10.6964286 C20.75,14.0446429 24.188247,15.7371974 24.188247,15.7371974 C25.5057636,16.651593 26.5738219,16.0843085 26.5738219,14.4868066 L26.5738219,6.90605053 C26.5738219,5.30108314 25.4784055,4.70120148 24.188247,5.65565975 C24.188247,5.65565975 20.75,7.34821429 20.75,10.6964286 Z" id="Path-16"></path>
+                </g>
+                <path d="M24,1 L0.00856596586,23.6585766" id="Path-98" sketch:type="MSShapeGroup"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/skins/vector/img/voice-mute.svg b/src/skins/vector/img/voice-mute.svg
index 74e2fd225e..336641078e 100644
--- a/src/skins/vector/img/voice-mute.svg
+++ b/src/skins/vector/img/voice-mute.svg
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="14px" height="24px" viewBox="0 0 14 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+<svg width="21px" height="26px" viewBox="-4 -1 21 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
     <!-- Generator: Sketch 3.4.3 (16618) - http://www.bohemiancoding.com/sketch -->
     <title>Audio</title>
     <desc>Created with Sketch.</desc>
diff --git a/src/skins/vector/img/voice-unmute.svg b/src/skins/vector/img/voice-unmute.svg
new file mode 100644
index 0000000000..0d7e6f429f
--- /dev/null
+++ b/src/skins/vector/img/voice-unmute.svg
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="21px" height="26px" viewBox="-1 -1 21 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>Audio</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="05-Voice-and-video" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="05_2-Video-call" sketch:type="MSArtboardGroup" transform="translate(-912.000000, -665.000000)">
+            <g id="Audio" sketch:type="MSLayerGroup" transform="translate(912.000000, 665.000000)">
+                <path d="M6.51108197,4.57927869 C6.51108197,2.62701639 8.09940984,1.03868852 10.0520656,1.03868852 C12.0047213,1.03868852 13.5930492,2.62701639 13.5930492,4.57927869 L13.5930492,12.448918 C13.5930492,14.4015738 12.0047213,15.9899016 10.0520656,15.9899016 C8.09940984,15.9899016 6.51108197,14.4015738 6.51108197,12.448918 L6.51108197,4.57927869 L6.51108197,4.57927869 Z M10.0520656,16.7767869 C12.4418361,16.7767869 14.3799344,14.839082 14.3799344,12.448918 L14.3799344,4.57927869 C14.3799344,2.18911475 12.4418361,0.251803279 10.0520656,0.251803279 C7.66229508,0.251803279 5.72419672,2.18911475 5.72419672,4.57927869 L5.72419672,12.448918 C5.72419672,14.839082 7.66229508,16.7767869 10.0520656,16.7767869 Z M15.9517377,8.51409836 L15.9517377,12.448918 C15.9517377,15.703082 13.3042623,18.3505574 10.0500984,18.3505574 C6.79554098,18.3505574 4.14845902,15.703082 4.14845902,12.448918 L4.14845902,8.51409836 L3.36157377,8.51409836 L3.36157377,12.448918 C3.36157377,16.0217705 6.17980328,18.9407213 9.70898361,19.1201311 L9.65862295,19.1201311 L9.65862295,23.080918 L6.11567213,23.080918 L6.11567213,23.8678033 L13.9845246,23.8678033 L13.9845246,23.080918 L10.4455082,23.080918 L10.4455082,19.1201311 L10.3912131,19.1201311 C13.9203934,18.9407213 16.738623,16.0217705 16.738623,12.448918 L16.738623,8.51409836 L15.9517377,8.51409836 Z" id="Fill-16" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
+                <path d="M19,3 L0.272141024,20.6874224" id="Path-98" stroke="#FFFFFF" sketch:type="MSShapeGroup"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/skins/vector/img/voip-chevron.svg b/src/skins/vector/img/voip-chevron.svg
new file mode 100644
index 0000000000..5f7cbe7153
--- /dev/null
+++ b/src/skins/vector/img/voip-chevron.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="22px" height="17px" viewBox="-1 -1 22 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
+    <title>Triangle 1</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="05-Voice-and-video" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="05_2-Video-call" sketch:type="MSArtboardGroup" transform="translate(-912.000000, -693.000000)" fill="#76CFA6">
+            <polygon id="Triangle-1" sketch:type="MSShapeGroup" transform="translate(922.000000, 700.500000) scale(1, -1) translate(-922.000000, -700.500000) " points="922 693 932 708 912 708 "></polygon>
+        </g>
+    </g>
+</svg>
\ No newline at end of file