diff --git a/common/js/common.js b/common/js/common.js
index 4cbf7b222..570b52afd 100644
--- a/common/js/common.js
+++ b/common/js/common.js
@@ -471,7 +471,7 @@ function setFixedPopupSize() {
 	w = $pc.width(10).height(10000).get(0).scrollWidth + offset.left*2;
 	h = $pc.height(10).width(10000).get(0).scrollHeight + offset.top*2;
 
-	if(w < 600) w = 600 + offset.left*2;
+	if(w < 800) w = 800 + offset.left*2;
 
 	dw = $win.width();
 	dh = $win.height();
diff --git a/modules/communication/lang/lang.xml b/modules/communication/lang/lang.xml
index 2915cd377..5fc3dca66 100644
--- a/modules/communication/lang/lang.xml
+++ b/modules/communication/lang/lang.xml
@@ -11,14 +11,14 @@
 		<value xml:lang="vi"><![CDATA[Thông báo]]></value>
 	</item>
 	<item name="about_communication">
-		<value xml:lang="ko"><![CDATA[회원 간의 쪽지나 친구 관리 등 커뮤니케이션 기능을 수행하는 모듈입니다.<br />이 기능을 사용하려면 [설치된 애드온] > [커뮤니케이션] 애드온을 활성화 하세요.]]></value>
+		<value xml:lang="ko"><![CDATA[회원 간의 쪽지나 친구 관리 등 커뮤니케이션 기능을 수행하는 모듈입니다. 이 기능을 사용하려면 [설치된 애드온] &gt; [커뮤니케이션] 애드온을 활성화 하세요.]]></value>
 		<value xml:lang="en"><![CDATA[This module is used for communication between members, such as exchanging messages or mamaging friends.]]></value>
 		<value xml:lang="jp"><![CDATA[会員間でメッセージや友達管理などコミュニティ機能を提供するモジュールです。]]></value>
 		<value xml:lang="zh-CN"><![CDATA[管理在线会员间短信息及好友功能的模块。]]></value>
 		<value xml:lang="zh-TW"><![CDATA[管理短訊息及好友功能的模組。]]></value>
 		<value xml:lang="fr"><![CDATA[Ce module exécute des fonctions communicatives comme Messages ou Amis]]></value>
 		<value xml:lang="ru"><![CDATA[Модуль для общения между пользователями]]></value>
-		<value xml:lang="es"><![CDATA[회원간의 쪽지나 친구 관리등 커뮤니케이션 기능을 수행하는 모듈입니다]]></value>
+		<value xml:lang="es"><![CDATA[회원간의 쪽지나 친구 관리 등 커뮤니케이션 기능을 수행하는 모듈입니다]]></value>
 		<value xml:lang="tr"><![CDATA[İletişim modülü; üyelerin, mesajlaşması ve arkadaşlarıyla iletişimleri için kullanılan modüldür.]]></value>
 		<value xml:lang="vi"><![CDATA[Module này thực hiện chức năng giao tiếp, tin nhắn hay bạn bè.]]></value>
 	</item>
diff --git a/modules/communication/tpl/colorset_list.html b/modules/communication/tpl/colorset_list.html
index 7a155cef1..9037c7e4e 100644
--- a/modules/communication/tpl/colorset_list.html
+++ b/modules/communication/tpl/colorset_list.html
@@ -1,16 +1,7 @@
-<!--@foreach($skin_info->colorset as $key => $val)-->
-	<!--@if($val->screenshot)-->
-	{@ $_img_info = getImageSize($val->screenshot); $_height = $_img_info[1]+40; $_width = $_img_info[0]+20; $_talign = "center"; }
-	<!--@else-->
-	{@ $_width = 200; $_height = 20; $_talign = "left"; }
-	<!--@end-->
-
-	<div style="float:left;text-align:{$_talign};margin-bottom:1em;width:{$_width}px;height:{$_height}px;margin-right:10px;">
-		<label cond="$type == 'P'" for="colorset_{$key}"><input type="radio" name="colorset" value="{$val->name}" id="colorset_{$key}" <!--@if($communication_config->colorset==$val->name)-->checked="checked"<!--@end-->/>{$val->title}</label>
-		<label cond="$type == 'M'" for="mcolorset_{$key}"><input type="radio" name="mcolorset" value="{$val->name}" id="mcolorset_{$key}" <!--@if($communication_config->mcolorset==$val->name)-->checked="checked"<!--@end-->/>{$val->title}</label>
-		<!--@if($val->screenshot)-->
-		<br />
-		<img src="{$val->screenshot}" alt="{$val->title}" style="border:1px solid #888888;padding:2px;margin:2px;"/>
-		<!--@end-->
+<div loop="$skin_info->colorset => $key, $val" style="padding:3px 0 0 0;display:inline-block;*display:inline;zoom:1;min-width:220px;vertical-align:top">
+	<label cond="$type == 'P'" for="colorset_{$key}"><input type="radio" name="colorset" value="{$val->name}" id="colorset_{$key}" checked="checked"|cond="$communication_config->colorset==$val->name" /> {$val->title}</label>
+	<label cond="$type == 'M'" for="mcolorset_{$key}"><input type="radio" name="mcolorset" value="{$val->name}" id="mcolorset_{$key}" checked="checked"|cond="$communication_config->mcolorset==$val->name" /> {$val->title}</label>
+	<div class="x_thumbnail" cond="$val->screenshot" style="display:inline-block;*display:inline;zoom:1;min-width:200px">
+		<img src="{$val->screenshot}" alt="{$val->title}" style="min-width:200px" />
 	</div>
-<!--@end-->
+</div>
diff --git a/modules/communication/tpl/index.html b/modules/communication/tpl/index.html
index 3e9d1c44f..46f6469f4 100644
--- a/modules/communication/tpl/index.html
+++ b/modules/communication/tpl/index.html
@@ -2,10 +2,13 @@
 <load target="../../editor/tpl/js/editor_module_config.js" usecdn="true" />
 
 <div class="x_page-header">
-	<h1>{$lang->communication} {$lang->cmd_management}</h1>
+	<h1>
+		{$lang->communication} {$lang->cmd_management}
+		<a href="#aboutCommunication" class="x_pull-right x_icon-question-sign" data-toggle style="margin-top:13px">{$lang->help}</a>
+	</h1>
 </div>
 
-<p class="x_help-block">{nl2br($lang->about_communication)}</p>
+<p class="x_alert x_alert-info" id="aboutCommunication" hidden>{nl2br($lang->about_communication)}</p>
 
 <div cond="$XE_VALIDATOR_MESSAGE" class="x_alert x_alert-{$XE_VALIDATOR_MESSAGE_TYPE}">
 	<p>{$XE_VALIDATOR_MESSAGE}</p>
@@ -23,15 +26,17 @@
 			</select>
 			<select name="sel_editor_colorset" style="display:none">
 			</select>
-			<script>//<![CDATA[
+			<script>
+			//<![CDATA[
 				getEditorSkinColorList('{$communication_config->editor_skin}','{$communication_config->editor_colorset}');
-			//]]></script>
+			//]]>
+			</script>
 		</div>
 	</div>
 	<div class="x_control-group">
 		<label class="x_control-label" for="layout">{$lang->layout}</label>
 		<div class="x_controls">
-			<select id="layout" name="layout_srl">
+			<select id="layout" name="layout_srl" style="width:auto">
 				<option value="0">{$lang->notuse}</option>
 				<option loop="$layout_list => $key,$val" value="{$val->layout_srl}" selected="selected"|cond="$val->layout_srl == $communication_config->layout_srl">{$val->title} ({$val->layout})</option>
 			</select>
@@ -40,8 +45,8 @@
 	<div class="x_control-group">
 		<label class="x_control-label" for="skin">{$lang->skin}</label>
 		<div class="x_controls">
-			<select name="skin" id="skin" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'P');return false;">
-				<option loop="$communication_skin_list => $key, $val" value="{$key}" <!--@if($key==$communication_config->skin)-->selected="selected"<!--@end-->>{$val->title}</option>
+			<select name="skin" id="skin" style="width:auto" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'P')">
+				<option loop="$communication_skin_list => $key, $val" value="{$key}" selected="selected"|cond="$key==$communication_config->skin">{$val->title}</option>
 			</select>
 		</div>
 	</div>
@@ -54,7 +59,7 @@
 	<div class="x_control-group">
 		<label class="x_control-label" for="mlayout_srl">{$lang->mobile_layout}</label>
 		<div class="x_controls">
-			<select id="mlayout_srl" name="mlayout_srl">
+			<select id="mlayout_srl" name="mlayout_srl" style="width:auto">
 				<option value="0">{$lang->notuse}</option>
 				<option loop="$mlayout_list => $key,$val" value="{$val->layout_srl}" selected="selected"|cond="$val->layout_srl == $communication_config->mlayout_srl">{$val->title} ({$val->layout})</option>
 			</select>
@@ -63,7 +68,7 @@
 	<div class="x_control-group">
 		<label class="x_control-label" for="mskin">{$lang->mobile_skin}</label>
 		<div class="x_controls">
-			<select name="mskin" id="mskin" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'M');return false;">
+			<select name="mskin" id="mskin" style="width:auto" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'M')">
 				<option loop="$communication_mobile_skin_list => $key,$val" value="{$key}" selected="selected"|cond="$key==$communication_config->mskin" >{$val->title}</option>
 			</select>
 		</div>