diff --git a/css/profile_freelist.css b/css/profile_freelist.css
--- a/css/profile_freelist.css
+++ b/css/profile_freelist.css
@@ -1,38 +1,38 @@
 .typ-profile-sidebar{
     width: 310px;
 }
 .profile_share img{
     width: 90px;
     height: 28px;
 }
 .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{
     background-color: #FFDE00 !important;
     color: #000000 !important;
 }
 .nav-tabs>li>a{
     border: 1px solid #DDDDDD !important;
-    color: #898787 !important;
+    color: #000000 !important;
 }
 .profile_share{
     border: 1px solid #DDDDDD;
     padding: 15px;
 }
 .profile_share_title_promotion{
     background-color: #4e4e4e;
     margin-bottom: 2px;
     color: #f5cc22 !important;
     padding: 10px;
 }
 .profile_share_title_promotion > a > span{
     margin-left: 8px;
     color: #f5cc22 !important;
 }
 .profile_share_title_promotion:hover{
     background-color: rgba(78,78,78,0.8);
 }
 .profile_share_title{
     margin-top: 12px;
     background-color: #f5cc22;
     color: #000 !important;
     padding: 10px;
 }
\ No newline at end of file
diff --git a/src/Plugin/Block/TYPProfileShareBlock.php b/src/Plugin/Block/TYPProfileShareBlock.php
--- a/src/Plugin/Block/TYPProfileShareBlock.php
+++ b/src/Plugin/Block/TYPProfileShareBlock.php
@@ -1,1 +1,1 @@
-<?php
/**
 * @file
 * Contains \Drupal\search\Plugin\Block\SearchBlock.
 */
namespace Drupal\typ_profile\Plugin\Block;

use Drupal\Core\Block\BlockBase;
use Drupal\Core\Url;
use Drupal\typ_legacy\Service\TYPLegacyLandingPageService;
use Drupal\typ_profile\Controller\TYPProfileController;
use Drupal\typ_search\Service\TYPSearchService;
use Drupal\typ_legacy\Serivee;

/**
 * Provides a 'Search form' block.
 *
 * @Block(
 *   id = "typ_profile_share_block",
 *   admin_label = @Translation("Profile Share"),
 *   category = @Translation("TYP")
 * )
 */

class TYPProfileShareBlock extends BlockBase
{
	
	
	public function formatWorkingHour($s) {
		foreach( explode(",", $s) as $p) {
			$ps[] = $p;
		}
		return implode(", ", $ps);
	}

	protected $data;
	protected $result;
	public function build(){
		
		
		$fullurl = 'http://'.$_SERVER[HTTP_HOST].$_SERVER['REQUEST_URI'];
		$url = \Drupal::request()->getRequestUri();
		$language = \Drupal::languageManager()->getCurrentLanguage()->getId();
		$s = explode("/",$url);
		$bid = end($s);
		$this->data = \Drupal::service("typ.search")->getProfile($bid ,AUTO);
		$this->result = \Drupal::service('typ.unvservice')->loadListing($this->data['customerid'],NULL);
		$type = $this->result['address'][$this->data['headingcode']][$this->data['addressid']]['customertype'];
		$telno = '';$fax = '';$workinghours = '';
		if (!empty($this->data['telno'])) {
			foreach ($this->data['telno'] as $t) {
				 $telno .= TYPProfileController::FormatPhoneNumber($t);
			}
		}
		if (!empty($this->data['fax'])) {
			foreach ($this->data['fax'] as $t) {
				$fax .= TYPProfileController::FormatPhoneNumber($t);
			}
		}
		if (!empty($this->data['workinghours'])) {
			$workinghours .= $this->formatWorkingHour($this->data['workinghours']);
		}
		$body_email = format_string('<table>
							<tbody>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Address').'</b></td>
									<td>'.$this->data['fulladdr'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Tel').'</b></td>
									<td>'.$telno.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Fax').'</b></td>
									<td>'.$fax.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Email').'</b></td>
									<td>'.$this->data['email'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Website').'</b></td>
									<td>'.$this->data['website'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Work-Time').'</b></td>
									<td>'.$workinghours.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Link').'</b></td>
									<td>'.$fullurl.'</td>
								</tr>
							</tbody>
						</table>');

		switch ($type){
			case "FL":
				$email = $body_email;
				$facebook = 'https://www.facebook.com/sharer/sharer.php?u='.format_string($this->data['proddesc']).$fullurl;
				$twitter = format_string($this->data['proddesc']).$fullurl;
				$gplus = 'https://plus.google.com/share?url='.$fullurl;
				break;
			default:
				$email = $body_email;
				$facebook = 'https://www.facebook.com/sharer/sharer.php?u='.format_string($this->data['proddesc']).$fullurl;
				$twitter = format_string($this->data['proddesc']).$fullurl;
				$gplus = 'https://plus.google.com/share?url='.$fullurl;
		}
		$base_url_images = '/themes/bootstrap/typ/images/icon-service-profilepage/'.$language;
		$email = base64_encode($email);
		header('Content-Type: text/html; charset=UTF-8');
		$build = array();

        $build[] = array(
            '#markup' => format_string('
						  <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title_promotion">
						  	<a href="/update-business-info" target="_blank"><img src="/themes/bootstrap/typ/images/icon/typ-icon-database.png"><span>'.t('If you own this business contact here').'</span></a>
						  </div>
						  <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title_promotion">
						  	<a href="http://promotion.yellowpages.co.th/" target="_blank"><img src="/themes/bootstrap/typ/images/icon/typ-icon-allpromotion.png"><span>'.t('Total Promotion').'</span></a>
						  </div>
					      <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title">
								'.t('Share this business here').'
						  </div>
					      <div class="col-xs-12 col-md-12 col-lg-12 form-inline text-center profile_share" style="padding:10px 10px 10px 6px;">
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href=".profile_email" data-from="'.base64_encode($this->data['humanname']).'" data-value="'.$email.'" onclick="sendmail(this); return false" ><img class="profile_email img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-email1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" onclick="print_content()"><img class="profile_print img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-print1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" onclick="window.open(\''.$facebook.'\',\'name\',\'width=600,height=400\')" ><img class="profile_facebook img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-facebook1-'.$language.'.png"></a>
							  </div>
								<div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" data-url="'.$twitter.'" data-text="'.$this->data['humanname'].'" onclick="window.open(\'https://twitter.com/share\',\'name\',\'width=600,height=400\')" ><img class="profile_twitter img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-twitter+1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href=""  onclick="window.open(\''.$gplus.'\',\'name\',\'width=600,height=400\')" ><img class="profile_google img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-google+1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="http://promotion.yellowpages.co.th/" TARGET="_blank" ><img class="profile_promotion img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-promation1-'.$language.'.png"></a>
							  </div>
						  </div>'),
        );

		$build['#attached']['library'] = array(
			'typ_profile/profile_share'
		);
        return $build;
	}

}
?>
\ No newline at end of file
+<?php
/**
 * @file
 * Contains \Drupal\search\Plugin\Block\SearchBlock.
 */
namespace Drupal\typ_profile\Plugin\Block;

use Drupal\Core\Block\BlockBase;
use Drupal\Core\Url;
use Drupal\typ_legacy\Service\TYPLegacyLandingPageService;
use Drupal\typ_profile\Controller\TYPProfileController;
use Drupal\typ_search\Service\TYPSearchService;
use Drupal\typ_legacy\Serivee;

/**
 * Provides a 'Search form' block.
 *
 * @Block(
 *   id = "typ_profile_share_block",
 *   admin_label = @Translation("Profile Share"),
 *   category = @Translation("TYP")
 * )
 */

class TYPProfileShareBlock extends BlockBase
{
	
	
	public function formatWorkingHour($s) {
		foreach( explode(",", $s) as $p) {
			$ps[] = $p;
		}
		return implode(", ", $ps);
	}

	protected $data;
	protected $result;
	public function build(){
		
		
		$fullurl = 'http://'.$_SERVER[HTTP_HOST].$_SERVER['REQUEST_URI'];
		$url = \Drupal::request()->getRequestUri();
		$language = \Drupal::languageManager()->getCurrentLanguage()->getId();
		$s = explode("/",$url);
		$bid = end($s);
		$this->data = \Drupal::service("typ.search")->getProfile($bid ,AUTO);
		$this->result = \Drupal::service('typ.unvservice')->loadListing($this->data['customerid'],NULL);
		$type = $this->result['address'][$this->data['headingcode']][$this->data['addressid']]['customertype'];
		$telno = '';$fax = '';$workinghours = '';
		if (!empty($this->data['telno'])) {
			foreach ($this->data['telno'] as $t) {
				 $telno .= TYPProfileController::FormatPhoneNumber($t);
			}
		}
		if (!empty($this->data['fax'])) {
			foreach ($this->data['fax'] as $t) {
				$fax .= TYPProfileController::FormatPhoneNumber($t);
			}
		}
		if (!empty($this->data['workinghours'])) {
			$workinghours .= $this->formatWorkingHour($this->data['workinghours']);
		}
		$body_email = format_string('<table>
							<tbody>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Address').'</b></td>
									<td>'.$this->data['fulladdr'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Tel').'</b></td>
									<td>'.$telno.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Fax').'</b></td>
									<td>'.$fax.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Email').'</b></td>
									<td>'.$this->data['email'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Website').'</b></td>
									<td>'.$this->data['website'].'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Work-Time').'</b></td>
									<td>'.$workinghours.'</td>
								</tr>
								<tr valign="top">
									<td style="width:120px;"><b>'.t('Link').'</b></td>
									<td>'.$fullurl.'</td>
								</tr>
							</tbody>
						</table>');

		switch ($type){
			case "FL":
				$email = $body_email;
				$facebook = 'https://www.facebook.com/sharer/sharer.php?u='.format_string($this->data['proddesc']).$fullurl;
				$twitter = format_string($this->data['proddesc']).$fullurl;
				$gplus = 'https://plus.google.com/share?url='.$fullurl;
				break;
			default:
				$email = $body_email;
				$facebook = 'https://www.facebook.com/sharer/sharer.php?u='.format_string($this->data['proddesc']).$fullurl;
				$twitter = format_string($this->data['proddesc']).$fullurl;
				$gplus = 'https://plus.google.com/share?url='.$fullurl;
		}
		$base_url_images = '/themes/bootstrap/typ/images/icon-service-profilepage/'.$language;
		$email = base64_encode($email);
		header('Content-Type: text/html; charset=UTF-8');
		$build = array();

        $build[] = array(
            '#markup' => format_string('
						  <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title_promotion">
						  	<a href="/update-business-info" target="_blank"><img src="/themes/bootstrap/typ/images/icon/typ-icon-database.png"><span>'.t('If you own this business contact here').'</span></a>
						  </div>
						  <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title_promotion">
						  	<a href="http://promotion.yellowpages.co.th/" target="_blank"><img src="/themes/bootstrap/typ/images/icon/typ-icon-allpromotion.png"><span>'.t('Total Promotion').'</span></a>
						  </div>
					      <div class="col-xs-12 col-md-12 col-lg-12 text-left profile_share_title">
								'.t('Share this business here').'
						  </div>
					      <div class="col-xs-12 col-md-12 col-lg-12 form-inline text-center profile_share" style="padding:10px 10px 10px 6px;">
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href=".profile_email" data-from="'.base64_encode($this->data['humanname']).'" data-value="'.$email.'" onclick="sendmail(this); return false" ><img class="profile_email img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-email1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" onclick="print_content()"><img class="profile_print img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-print1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" onclick="window.open(\''.$facebook.'\',\'name\',\'width=600,height=400\')" ><img class="profile_facebook img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-facebook1-'.$language.'.png"></a>
							  </div>
								<div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href="#" data-url="'.$twitter.'" data-text="'.$this->data['humanname'].'" onclick="window.open(\'https://twitter.com/share\',\'name\',\'width=600,height=400\')" ><img class="profile_twitter img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-twitter+1-'.$language.'.png"></a>
							  </div>
							  <div class="col-xs-4 col-md-4 col-lg-4" style="padding: 5px !important;">
								<a href=""  onclick="window.open(\''.$gplus.'\',\'name\',\'width=600,height=400\')" ><img class="profile_google img-responsive" onmouseover="hover_share(this);" onmouseout="out_share(this);" src="'.$base_url_images.'/pf-icon-google+1-'.$language.'.png"></a>
							  </div>
						  </div>'),
        );

		$build['#attached']['library'] = array(
			'typ_profile/profile_share'
		);
        return $build;
	}

}
?>
\ No newline at end of file
diff --git a/templates/typ-profile.html.twig b/templates/typ-profile.html.twig
--- a/templates/typ-profile.html.twig
+++ b/templates/typ-profile.html.twig
@@ -1,449 +1,449 @@
 {% set base_images = 'http://media.yellowpages.co.th/yellowpages' %}
 {% set base_promotion = 'http://promotion.yellowpages.co.th/media/promotion/' %}
 
 <div class="container-fluid">
     <div class="col-xs-12 col-md-8 col-lg-8" >
 
         <div class="row">
             <div class="col-xs-12 col-md-12 col-lg-12">
                 {#{% if profile.logo %}#}
                 {#<div class="col-xs-12 col-md-5 col-lg-5">#}
                 {#<img class="img-responsive" src="{{ [base_images,"/logo/",profile.logo]|join }}"/>#}
                 {#</div>#}
                 {#{% else %}#}
                 {#<div class="col-xs-12 col-md-3 col-lg-3">#}
                 {#<img class="img-responsive" src="{{ '/themes/bootstrap/typ/images/icon-map/typ-map-default.jpg' }}"/>#}
                 {#</div>#}
                 {#{% endif %}#}
 
                 <div class="col-xs-12 col-md-12 col-lg-12" style="padding: 0px;">
                     <h4>{{ profile.humanname|raw }}</h4>
                     <b>{% trans %}Category{% endtrans %} :</b> <a href="/heading/{{ profile.ypheadingname }}">{{ profile.headingname|raw }}</a><br><br>
                 </div>
             </div>
         </div>
 
         <div class="row">
             <!-- check FL close openx -->
             {% if type != 'FL' %}
                 <div id="customertype"
                      data-customertype="{{ type }}" style="display: none"></div>
             {% endif %}
             <!-- check FL close openx -->
             <div class="col-xs-12 col-sm-12 col-lg-12">
 
                 {% if type != 'FL' %}
                     {{ profile.profile|raw}}
                 {% else %}
                     {{ profile.profile|raw|slice(0, 100)}}{% if profile.profile|length > 100 %}{{ '...</p>' }}{% endif %}
                 {% endif %}
-                <br>
+                <br><br>
                 {#{% if not profile.addr %}{% else %}#}
                 {#<b>{% trans %} Address {% endtrans %}</b>#}
                 {#{{ [profile.addr,profile.soi,profile.road,profile.subdistrictname,#}
                 {#profile.districtname,profile.cityname,profile.postcode]|join(' ') }}#}
                 {#{% endif %}#}
                 {#{% if profile.location.lat %}#}
                 {#<a href="/ypsearch?qm=#{{ profile.humanname|raw }}"><img src="/themes/bootstrap/typ/images/icon-map/icon-pin-map_r.png"></a> <br>#}
                 {#{% else %}#}
                 {#<a href="https://www.google.co.th/maps/search/{{ profile.fulladdr|url_encode     }}" target="_blank"><img src="/themes/bootstrap/typ/images/icon-map/icon-pin-map_r.png"></a> <br>#}
                 {#{% endif %}#}
 
 
                 <div class="row">
                     <div class="col-xs-12 col-sm-12 col-lg-12">
                         <table>
                             {% if not profile.addr %}{% else %}
                                 <tr valign="top">
                                     <td style="width:120px;"><b>{% trans %} Address {% endtrans %}:</b></td>
                                     <td class="table-right"> {{ [profile.addr,profile.soi,profile.road,profile.subdistrictname,profile.districtname,profile.cityname,profile.postcode]|join(' ') }}</td>
                                 </tr>
                             {% endif %}
                             {% if not profile.telno %}{% else %}
                                 <tr valign="top">
                                    <td style="width:120px;"><b>{% trans %} Tel {% endtrans %}:</b></td>
                                     <td class="table-right">
                                         {% if not profile.telno %}
                                         {% else %}
                                             {% if type == 'FL' %}
                                                 <span>{{ profile._format.telno.0 }}</span><br>
                                             {% else %}
                                                 {% for key, tel in profile._format.telno %}
                                                     {% if loop.last != key+1 %}<a href="tel:{{ tel }}">{{ tel }}</a>{{ " ," }}
                                                     {% else %}<a href="tel:{{ tel }}">{{ tel }}</a>{% endif %}
                                                 {% endfor %}<br>
                                             {% endif %}
                                         {% endif %}
                                     </td>
                                 </tr>
                             {% endif %}
                             {% if not profile.fax %}{% else %}
                                 <tr valign="top">
                                    <td  style="width:120px;"><b>{% trans %} Fax {% endtrans %}:</b></td>
                                     <td class="table-right">
                                         {% if not profile.fax %}
                                         {% else %}
                                             {% if type == 'FL' %}
                                                 <span>{{ profile._format.fax.0 }}</span><br>
                                             {% else %}
                                                 {% for key, fax in profile._format.fax %}
                                                     {% if loop.last != key+1 %}<a href="tel:{{ fax }}">{{ fax }}</a>{{ " ," }}
                                                     {% else %}<a href="tel:{{ fax }}">{{ fax }}</a>{% endif %}
                                                 {% endfor %}<br>
                                             {% endif %}
                                         {% endif %}
                                     </td>
                                 </tr>
                             {% endif %}
                             {% if not profile.email %}{% else %}
                                 <tr valign="top">
                                    <td style="width:120px;"><b>{% trans %} Email {% endtrans %}:</b></td>
                                     <td class="table-right">
                                         {% if not profile.email %}
                                         {% else %}
                                             {% if type == 'FL' %}
                                                 {% set email =  profile.email|split(',') %}
                                                 {% for key , mail in email %}
                                                     {% if loop.last != key+1 %}{{ mail }} ,<br>
                                                     {% else %}{{ mail }}<br>{% endif %}
                                                 {% endfor %}
                                             {% else %}
                                                 {% set email =  profile.email|split(',') %}
                                                 {% for key , mail in email %}
                                                     {% if loop.last != key+1 %}<a href="mailto:{{ mail }}">{{ mail }}</a> ,<br>
                                                     {% else %}<a href="mailto:{{ mail }}">{{ mail }}</a><br>{% endif %}
                                                 {% endfor %}
                                             {% endif %}
                                         {% endif %}
                                     </td>
                                 </tr>
                             {% endif %}
                             {% if not profile.website %}{% else %}
                                 <tr valign="top">
                                    <td style="width:120px;"><b>{% trans %} Website {% endtrans %}:</b></td>
                                     <td class="table-right">
                                         {% if not profile.website %}
                                         {% else %}
                                             {% set website =  profile.website|split(',') %}
                                             {% for key , web in website %}
                                                 {% if loop.last != key+1 %}<a href="http://{{ web }}" target="_blank">{{ web }}</a> ,<br>
                                                 {% else %}<a href="http://{{ web }}" target="_blank">{{ web }}</a><br>{% endif %}
                                             {% endfor %}
                                         {% endif %}
                                     </td>
                                 </tr>
                             {% endif %}
                             {% if not profile.workinghours %}{% else %}
                                 <tr valign="top">
                                    <td style="width:120px;"><b>{% trans %} Work-Time {% endtrans %}:</b></td>
                                     <td class="table-right">
                                         {% if not profile.workinghours %}
                                         {% else %}
                                             {{ profile._format.workinghours }}<br>
                                         {% endif %}
                                     </td>
                                 </tr>
                             {% endif %}
                         </table>
                     </div>
 
 
 
                     <div class="row" style="margin-left: 0px;">
                         <div class="col-xs-12 col-md-12 col-lg-12">
                             {% if type != 'FL' %}
                                 {% if not prodescription or prodescription is empty %}
                                 {% else %}
                                     <br><b>{% trans %} Product And Service {% endtrans %}</b>
                                     {{ prodescription|raw }}<br>
                                 {% endif %}
 
                                 {% if not profile.brandname %}
-                                {% else %}<br><b>{% trans %} Banner {% endtrans %}</b> <br> {{ profile.brandname|replace({"<p>":" ","</p>":" "}) }}
+                                {% else %}<b>{% trans %} Banner {% endtrans %}</b> <br> {{ profile.brandname|replace({"<p>":" ","</p>":" "}) }}
                                 {% endif %}
                             {% endif %}
 
                             <br><br>
                             {# TAB #}
                             {% if type == 'FL' %}
                                 <div class="mobile">
                                     <ul class="nav nav-tabs" {% if not promotion.promotionid and not profile.location.lat %}style="display: none;"{% endif %}>
                                         {% if promotion.promotionid %}<li class="active" ><a data-toggle="tab" href="#menu3">{% trans %} Promotion  {% endtrans %}</a></li>{% endif %}
                                         {% if profile.location.lat %}<li {% if not promotion.promotionid %}{{ 'class="active"' }}{% endif %}><a data-toggle="tab" href="#menu2">{% trans %} Digital Map {% endtrans %}</a></li>{% endif %}
                                     </ul>
 
                                     <div class="tab-content" {% if not promotion.promotionid and not profile.location.lat %}style="display: none;"{% endif %}>
 
                                         {% if promotion.promotionid %}
                                             <div id="menu3" {% if not promotion.promotionid %}{{ ' class="tab-pane fade"' }}{% else %}{{ ' class="tab-pane fade in active"' }}{% endif %}>
                                                 <br>
                                                 <div class="col-xs-12 col-md-12 col-lg-12">
                                                     <div class="col-xs-6 col-md-6 col-lg-6 text-left">
                                                         {{ profile.humanname|raw }}
                                                         <br>
                                                         <b><span style="color:red">{% trans %}Promotion{% endtrans %} : </span> </b> {{ promotion.title }}
                                                     </div>
                                                     <div class="col-xs-6 col-md-6 col-lg-6 text-right">
                                                         <b>{% trans %}Start Date{% endtrans %} :</b> {{ promotion.startdate|raw }}
                                                         <br>
                                                         <b>{% trans %}End Date{% endtrans %} :</b> {{ promotion.enddate|raw }}
                                                     </div>
                                                 </div>
 
                                                 <br><br><br>
                                                 <div class="col-xs-12 col-md-12 col-lg-12 text-center">
                                                     {% if promotion.promoimg %}
                                                         <div {% if promotion.promoimg and not promotion.promoimg2 and not promotion.promoimg3 %} class="col-xs-4 col-md-4 col-lg-4 col-xs-offset-4 col-md-offset-4 col-lg-offset-4"
                                                         {% elseif promotion.promoimg and promotion.promoimg2 and not promotion.promoimg3 %} class="col-xs-4 col-md-4 col-lg-4 col-xs-offset-4 col-md-offset-4 col-lg-offset-4"
                                                         {% else %} class="col-md-4" {% endif %} >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg }}" class="colorbox group1" title="{{ promotion.productimg }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                     {% if promotion.promoimg2 %}
                                                         <div class="col-md-4" >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg2 }}" class="colorbox group1" title="{{ promotion.productimg2 }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg2 }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                     {% if promotion.promoimg3 %}
                                                         <div class="col-md-4" >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg3 }}" class="colorbox group1" title="{{ promotion.productimg3 }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg3 }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                 </div>
                                                 <br><br><br><br><br><br>
                                                 <div style="padding-left: 29px;padding-right: 27px;">
                                                     <b>{% trans %}Detail{% endtrans %} : </b>
                                                     {{ promotion.subject|raw }}
                                                     <br><br>
                                                     <div class="text-center" style="width:80%;margin-left:10%;">
                                                         <div style="border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px;-webkit-border-radius: 10px 10px 10px 10px;border: 0px solid #e84848;background-color:red;height:50px;padding-top:13px;">
                                                             <a style="color:#ffffff" href="http://www.yellowpages.co.th/profile/get-promotion">{% trans %}How to get promotion from{% endtrans %} TYPLive Plus</a>
                                                         </div>
                                                     </div>
                                                 </div>
                                             </div>
                                         {% endif %}
 
                                         {% if profile.location.lat %}
                                             <div id="menu2" {% if promotion.promotionid %} {{ 'class="tab-pane fade"' }} {% else %} {{ 'class="tab-pane fade in active"' }} {% endif %}  >
                                                 <br>
-                                                <iframe width="100%" height="240" scrolling="no" frameborder="0" src="http://landingpage.yellowpages.co.th/yp_map.php?latitude={{ profile.location.lat }}&amp;longitude={{ profile.location.lon }}&amp;height=240&amp;width=445" allowtransparency="true" marginwidth="0" marginheight="0"></iframe>
+                                                <iframe width="100%" height="500" scrolling="no" frameborder="0" src="http://landingpage.yellowpages.co.th/yp_map.php?latitude={{ profile.location.lat }}&longitude={{ profile.location.lon }}&height=500&width=445" allowtransparency="true" marginwidth="0" marginheight="0"></iframe>
                                             </div>
                                         {% endif %}
 
                                     </div>
                                 </div>
                             {% else %}
                                 <div class="mobile">
                                     <ul class="nav nav-tabs" {% if not promotion.promotionid and not profile.location.lat and not profile.printads %} style="display: none;"  {% endif %}>
                                         {#{% if profile.picturet1 %}<li class="active"><a data-toggle="tab" href="#home">{% trans %} Picture {% endtrans %}</a></li>{% endif %}#}
                                         {% if promotion.promotionid %}<li class="active" ><a data-toggle="tab" href="#menu1">{% trans %} Promotion  {% endtrans %}</a></li>{% endif %}
                                         {% if profile.location.lat %}<li {% if not promotion.promotionid %} {{ 'class="active"' }} {% endif %}><a data-toggle="tab" href="#menu2">{% trans %} Digital Map {% endtrans %}</a></li>{% endif %}
                                         {% if profile.printads %}<li {% if not promotion.promotionid and not profile.location.lat %}{{ 'class="active"' }}{% endif %}><a data-toggle="tab" href="#menu3">{% trans %} Advertisement {% endtrans %}</a></li>{% endif %}
                                         {#{% if profile.map %}<li {% if not profile.location.lat and not profile.printads and not profile.promotion and not profile.onlinepromotion %}{{ 'class="active"' }}{% endif %}><a data-toggle="tab" href="#menu4">{% trans %} Map Picture {% endtrans %}</a></li>{% endif %}#}
                                     </ul>
 
                                     <div class="tab-content" {% if not promotion.promotionid and not profile.location.lat and not profile.printads %} style="display: none;"  {% endif %}>
                                         {#{% if profile.picturet1 %}#}
                                         {#<div id="home" class="tab-pane fade in active">#}
                                         {#<br>#}
                                         {#<div class="row">#}
                                         {#{% if profile.picturet1  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet1]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet1]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet2  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet2]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet2]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet3  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet3]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet3]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet4  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet4]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet4]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet5  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet5]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet5]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet6  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet6]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet6]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet7  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet7]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet7]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet8  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet8]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet8]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#{% if profile.picturet9  %}#}
                                         {#<div class="col-xs-4 col-sm-4 col-lg-4">#}
                                         {#<a href="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet9]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive" src="{{[base_images,"/products/th/",profile.customerid,"/",profile.picturet9]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                         {#</div>#}
                                         {#</div>#}
                                         {#{% endif %}#}
 
                                         {% if promotion.promotionid %}
                                             <div id="menu1" class="tab-pane fade in active" >
                                                 <br>
                                                 <div class="col-xs-12 col-md-12 col-lg-12">
                                                     <div class="col-xs-6 col-md-6 col-lg-6 text-left">
                                                         {{ profile.humanname|raw }}
                                                         <br>
                                                         <b><span style="color:red">{% trans %}Promotion{% endtrans %} : </span> </b> {{ promotion.title }}
                                                     </div>
                                                     <div class="col-xs-6 col-md-6 col-lg-6 text-right">
                                                         <b>{% trans %}Start Date{% endtrans %} :</b> {{ promotion.startdate|raw }}
                                                         <br>
                                                         <b>{% trans %}End Date{% endtrans %} :</b> {{ promotion.enddate|raw }}
                                                     </div>
                                                 </div>
 
                                                 <br><br><br>
                                                 <div class="col-xs-12 col-md-12 col-lg-12 text-center">
                                                     {% if promotion.promoimg %}
                                                         <div {% if promotion.promoimg and not promotion.promoimg2 and not promotion.promoimg3 %} class="col-xs-4 col-md-4 col-lg-4 col-xs-offset-4 col-md-offset-4 col-lg-offset-4"
                                                         {% elseif promotion.promoimg and promotion.promoimg2 and not promotion.promoimg3 %} class="col-xs-4 col-md-4 col-lg-4 col-xs-offset-4 col-md-offset-4 col-lg-offset-4"
                                                         {% else %} class="col-md-4" {% endif %} >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg }}" class="colorbox group1" title="{{ promotion.productimg }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                     {% if promotion.promoimg2 %}
                                                         <div class="col-md-4" >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg2 }}" class="colorbox group1" title="{{ promotion.productimg2 }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg2 }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                     {% if promotion.promoimg3 %}
                                                         <div class="col-md-4" >
                                                             <a href="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg3 }}" class="colorbox group1" title="{{ promotion.productimg3 }}"><img style="position: absolute;clip: rect(0px, 150px, 100px, 0px);object-position: center center;" class="img-responsive" src="{{ base_promotion }}/{{ promotion.customerid }}/{{ promotion.promoimg3 }}" /></a>
                                                         </div>
                                                     {% endif %}
                                                 </div>
                                                 <br><br><br><br><br><br>
                                                 <div style="padding-left: 29px;padding-right: 27px;">
                                                     <b>{% trans %}Detail{% endtrans %} : </b>
                                                     {{ promotion.subject|raw }}
                                                     <br><br>
                                                     <div class="text-center" style="width:80%;margin-left:10%;">
                                                         <div style="border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px;-webkit-border-radius: 10px 10px 10px 10px;border: 0px solid #e84848;background-color:red;height:50px;padding-top:13px;">
                                                             <a style="color:#ffffff" href="http://www.yellowpages.co.th/profile/get-promotion">{% trans %}How to get promotion from{% endtrans %} TYPLive Plus</a>
                                                         </div>
                                                     </div>
                                                 </div>
                                             </div>
                                         {% endif %}
 
                                         {% if profile.location.lat %}
                                             <div id="menu2" {% if promotion.promotionid %} {{ 'class="tab-pane fade"' }} {% else %} {{ 'class="tab-pane fade in active"' }} {% endif %}  >
                                                 <br>
                                                 <iframe width="100%" height="240" scrolling="no" frameborder="0" src="http://landingpage.yellowpages.co.th/yp_map.php?latitude={{ profile.location.lat }}&amp;longitude={{ profile.location.lon }}&amp;height=240&amp;width=445" allowtransparency="true" marginwidth="0" marginheight="0"></iframe>
                                             </div>
                                         {% endif %}
 
                                         {% if profile.printads %}
                                             <div id="menu3" {% if promotion.promotionid or profile.location.lat %}{{ ' class="tab-pane fade"' }}{% else %}{{ ' class="tab-pane fade in active"' }}{% endif %}>
                                                 <div class="row">
                                                     <div class="col-xs-12 col-sm-12 col-lg-12">
                                                         <br>
                                                         <a href="{{[base_images,"/printads/",profile.lang,"/",profile.printads,".jpg"]|join}}" class="colorbox">
                                                             <img class="img-responsive typ-profile-printads" src="{{[base_images,"/printads/",profile.lang,"/",profile.printads,".jpg"]|join}}"/>
                                                         </a>
                                                     </div>
                                                 </div>
                                             </div>
                                         {% endif %}
 
                                         {#{% if profile.map %}#}
                                         {#<div id="menu4" {% if profile.location.lat or profile.printads or profile.promotion or profile.onlinepromotion %}{{ ' class="tab-pane fade"' }}{% else %}{{ ' class="tab-pane fade in active"' }}{% endif %}>#}
                                         {#<div class="row">#}
                                         {#<div class="col-xs-12 col-sm-12 col-lg-12">#}
                                         {#<br>#}
                                         {#<a href="{{[base_images,"/map/th/",profile.map,".jpg"]|join}}" class="colorbox">#}
                                         {#<img class="img-responsive " src="{{[base_images,"/map/th/",profile.map,".jpg"]|join}}"/>#}
                                         {#</a>#}
                                         {#</div>#}
                                         {#</div>#}
                                         {#</div>#}
                                         {#{% endif %}#}
                                     </div>
                                 </div>
 
                             {% endif %}
                             
                             {#<br><br><br>#}
                             {#{% if not profile.custname %}#}
                             {#{% else %}#}
                             {#{{ profile.custname|raw }} : แสดงความคิดเห็น#}
                             {#{% endif %}#}
                             {#<br><br>#}
 
                             {# TAB #}
                             {#<div class="mobile">#}
                             {#<ul class="nav nav-tabs">#}
                             {#<li class="active"><a data-toggle="tab" href="#menu">{% trans %} Comment {% endtrans %}</a></li>#}
                             {#<li><a data-toggle="tab" href="#menu">{% trans %} Picture Concerned {% endtrans %}</a></li>#}
                             {#&#123;&#35;<li><a data-toggle="tab" href="#menu6">{% trans %} Advertise {% endtrans %}</a></li>&#35;&#125;#}
                             {#</ul>#}
 
                             {#<div class="tab-content">#}
                             {#<div id="menu4" class="tab-pane fade in active">#}
                             {#<h3>HOME</h3>#}
                             {#<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>#}
                             {#</div>#}
                             {#<div id="menu5" class="tab-pane fade">#}
                             {#<h3>Menu 1</h3>#}
                             {#<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>#}
                             {#</div>#}
                             {#&#123;&#35;<div id="menu6" class="tab-pane fade">&#35;&#125;#}
                             {#&#123;&#35;<h3>Menu 2</h3>&#35;&#125;#}
                             {#&#123;&#35;<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>&#35;&#125;#}
                             {#&#123;&#35;</div>&#35;&#125;#}
                             {#</div>#}
                             {#</div>#}
                             {# END TAB #}
                             <br><br>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </div>
 
     <div class="col-xs-12 col-md-4 col-lg-4">
         <div class="col-xs-12 col-md-12 col-lg-12">
 
         </div>
     </div>
 </div>