diff --git a/src/components/CallItem/index.js b/src/components/CallItem/index.js
index c7a5147ac3..a73bc53545 100644
--- a/src/components/CallItem/index.js
+++ b/src/components/CallItem/index.js
@@ -93,7 +93,10 @@ export default class CallItem extends Component {
     this.setState({
       selected,
     });
-    if (this.props.call.activityMatches.length > 0) {
+    if (
+      this.props.call.activityMatches.length > 0 &&
+      this.props.autoLog
+    ) {
       this.logCall({ redirect: false, selected });
     }
   }
@@ -215,13 +218,13 @@ export default class CallItem extends Component {
     const {
       call: {
         direction,
-        telephonyStatus,
-        result,
-        startTime,
-        duration,
-        activityMatches,
-        // webphoneSession,
-      },
+      telephonyStatus,
+      result,
+      startTime,
+      duration,
+      activityMatches,
+      // webphoneSession,
+    },
       currentLocale,
       areaCode,
       countryCode,
@@ -329,7 +332,7 @@ export default class CallItem extends Component {
           countryCode={countryCode}
           phoneNumber={phoneNumber}
           currentLocale={currentLocale}
-          />
+        />
         <div className={styles.details} >
           {durationEl} | {dateEl}{statusEl}
         </div>
@@ -342,8 +345,8 @@ export default class CallItem extends Component {
           onClickToDial={onClickToDial && this.clickToDial}
           onClickToSms={
             showClickToSms ?
-            () => this.clickToSms({ countryCode, areaCode })
-            : undefined
+              () => this.clickToSms({ countryCode, areaCode })
+              : undefined
           }
           phoneNumber={phoneNumber}
           disableLinks={disableLinks}
@@ -398,6 +401,7 @@ CallItem.propTypes = {
   // webphoneHangup: PropTypes.func,
   // webphoneResume: PropTypes.func,
   enableContactFallback: PropTypes.bool,
+  autoLog: PropTypes.bool,
 };
 
 CallItem.defaultProps = {
@@ -417,4 +421,5 @@ CallItem.defaultProps = {
   // webphoneHangup: () => null,
   // webphoneResume: () => null,
   enableContactFallback: undefined,
+  autoLog: false,
 };
diff --git a/src/components/CallList/index.js b/src/components/CallList/index.js
index cbe62f65a5..2fd0a14b18 100644
--- a/src/components/CallList/index.js
+++ b/src/components/CallList/index.js
@@ -39,6 +39,7 @@ function CallList({
   webphoneHangup,
   webphoneResume,
   enableContactFallback,
+  autoLog,
 }) {
   if (calls && calls.length) {
     return (
@@ -68,6 +69,7 @@ function CallList({
             webphoneHangup={webphoneHangup}
             webphoneResume={webphoneResume}
             enableContactFallback={enableContactFallback}
+            autoLog={autoLog}
           />
         ))}
       </div>
@@ -104,6 +106,7 @@ CallList.propTypes = {
   webphoneHangup: PropTypes.func,
   webphoneResume: PropTypes.func,
   enableContactFallback: PropTypes.bool,
+  autoLog: PropTypes.bool,
 };
 CallList.defaultProps = {
   className: null,
@@ -124,6 +127,7 @@ CallList.defaultProps = {
   webphoneHangup: undefined,
   webphoneResume: undefined,
   enableContactFallback: undefined,
+  autoLog: false,
 };
 
 export default CallList;
diff --git a/src/components/CallsPanel/index.js b/src/components/CallsPanel/index.js
index 7a8b4322dd..eda38f9073 100644
--- a/src/components/CallsPanel/index.js
+++ b/src/components/CallsPanel/index.js
@@ -34,6 +34,7 @@ export default function CallsPanel({
   webphoneHangup,
   webphoneResume,
   enableContactFallback,
+  autoLog,
 }) {
   const content = showSpinner ?
     <SpinnerOverlay /> :
@@ -61,6 +62,7 @@ export default function CallsPanel({
         webphoneHangup={webphoneHangup}
         webphoneResume={webphoneResume}
         enableContactFallback={enableContactFallback}
+        autoLog={autoLog}
       />
     );
   return (
@@ -100,6 +102,7 @@ CallsPanel.propTypes = {
   webphoneHangup: PropTypes.func,
   webphoneResume: PropTypes.func,
   enableContactFallback: PropTypes.bool,
+  autoLog: PropTypes.bool,
 };
 
 CallsPanel.defaultProps = {
@@ -121,4 +124,5 @@ CallsPanel.defaultProps = {
   webphoneHangup: undefined,
   webphoneResume: undefined,
   enableContactFallback: undefined,
+  autoLog: false,
 };
diff --git a/src/components/ContactDropdownList/styles.scss b/src/components/ContactDropdownList/styles.scss
index 2cf140c5e5..56186188ff 100644
--- a/src/components/ContactDropdownList/styles.scss
+++ b/src/components/ContactDropdownList/styles.scss
@@ -41,10 +41,10 @@
   }
 
   li.active {
-    color: $rc-blue;
+    color: $primary-color;
 
     .name {
-      color: $rc-blue;
+      color: $primary-color;
     }
   }
 }
diff --git a/src/components/MessageList/index.js b/src/components/MessageList/index.js
index 0bdf82e73b..d67bf18bad 100644
--- a/src/components/MessageList/index.js
+++ b/src/components/MessageList/index.js
@@ -1,7 +1,6 @@
 import React, { Component, PropTypes } from 'react';
 import classnames from 'classnames';
 import SearchInput from '../SearchInput';
-import Panel from '../Panel';
 import MessageItem from '../MessageItem';
 import styles from './styles.scss';
 import i18n from './i18n';
diff --git a/src/components/RecipientsInput/index.js b/src/components/RecipientsInput/index.js
index 0bf1d8745e..fd843486f0 100644
--- a/src/components/RecipientsInput/index.js
+++ b/src/components/RecipientsInput/index.js
@@ -8,7 +8,7 @@ function SelectedRecipientItem({
   name = phoneNumber,
   onRemove,
 }) {
-  const className = phoneNumber.length > 5 ? styles.blue : null;
+  const className = phoneNumber.length > 5 ? styles.phoneNumber : styles.extension;
   return (
     <li className={className}>
       <span>{name}</span>
diff --git a/src/components/RecipientsInput/styles.scss b/src/components/RecipientsInput/styles.scss
index d344919dc8..1c5722629e 100644
--- a/src/components/RecipientsInput/styles.scss
+++ b/src/components/RecipientsInput/styles.scss
@@ -73,7 +73,6 @@
   li {
     position: relative;
     color: #fff;
-    background-color: #66d17b;
     border-radius: 20px;
     font-size: 13px;
     line-height: 1;
@@ -90,12 +89,17 @@
     }
   }
 
-  .blue {
-    background-color: $rc-blue;
+  .phoneNumber {
+    background-color: $primary-color;
     opacity: 0.6;
   }
+  .extension {
+    background-color: $extension-background-color;
+  }
+
 }
 
+
 .removeReceiver {
   position: absolute;
   bottom: 4px;
diff --git a/src/containers/CallHistoryPage/index.js b/src/containers/CallHistoryPage/index.js
index 98c16e6a2b..d52afb41d7 100644
--- a/src/containers/CallHistoryPage/index.js
+++ b/src/containers/CallHistoryPage/index.js
@@ -45,6 +45,7 @@ function mapToProps(_, {
       (!composeText || composeText.ready) &&
       (!callLogger || callLogger.ready)
     ),
+    autoLog: callLogger.autoLog,
   };
 }
 function mapToFunctions(_, {
diff --git a/src/containers/CallMonitorPage/index.js b/src/containers/CallMonitorPage/index.js
index 1558b91db7..5fab37aa17 100644
--- a/src/containers/CallMonitorPage/index.js
+++ b/src/containers/CallMonitorPage/index.js
@@ -43,6 +43,7 @@ function mapToProps(_, {
       (!rolesAndPermissions || rolesAndPermissions.ready) &&
       (!composeText || composeText.ready)
     ),
+    autoLog: callLogger.autoLog,
   };
 }
 function mapToFunctions(_, {
diff --git a/src/lib/commonStyles/colors.scss b/src/lib/commonStyles/colors.scss
index c7b771f457..fc2ed6a66b 100644
--- a/src/lib/commonStyles/colors.scss
+++ b/src/lib/commonStyles/colors.scss
@@ -53,7 +53,7 @@ $dialer-btn-border-color: $primary-color-highlight !default;
 $call-btn-color: #4cd964  !default;
 $call-btn-press-color: rgba(76,217,100,0.4) !default;
 
-
+$extension-background-color: #66d17b !default;
 $sms-bubble-background-color: #d5f3fd !default;
 
 $brand-font-color: $rc-blue !default;