Merge branch 'bootstrap' of https://github.com/PrestaShop/PrestaShop into bootstrap

admin-dev/themes/default/css/admin-theme.css

@@ -30,7 +30,7 @@
  *  Email: dave@fontawesome.io
  *  Twitter: http://twitter.com/byscuits
  *  Work: Lead Product Designer @ Kyruus - http://kyruus.com
- */@font-face{font-family:'FontAwesome';src:url("../font/fontawesome-webfont.eot?v=3.2.1");src:url("../font/fontawesome-webfont.eot?#iefix&v=3.2.1") format("embedded-opentype"),url("../font/fontawesome-webfont.woff?v=3.2.1") format("woff"),url("../font/fontawesome-webfont.ttf?v=3.2.1") format("truetype"),url("../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1") format("svg");font-weight:normal;font-style:normal}[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em}[class^="icon-"]:before,[class*=" icon-"]:before{text-decoration:inherit;display:inline-block;speak:none}.icon-large:before{vertical-align:-10%;font-size:1.3333333333333333em}a [class^="icon-"],a [class*=" icon-"]{display:inline}[class^="icon-"].icon-fixed-width,[class*=" icon-"].icon-fixed-width{display:inline-block;width:1.1428571428571428em;text-align:right;padding-right:0.2857142857142857em}[class^="icon-"].icon-fixed-width.icon-large,[class*=" icon-"].icon-fixed-width.icon-large{width:1.4285714285714286em}.icons-ul{margin-left:2.142857142857143em;list-style-type:none}.icons-ul>li{position:relative}.icons-ul .icon-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;text-align:center;line-height:inherit}[class^="icon-"].hide,[class*=" icon-"].hide{display:none}.icon-muted{color:#eeeeee}.icon-light{color:#ffffff}.icon-dark{color:#333333}.icon-border{border:solid 1px #eeeeee;padding:.2em .25em .15em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.icon-2x{font-size:2em}.icon-2x.icon-border{border-width:2px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.icon-3x{font-size:3em}.icon-3x.icon-border{border-width:3px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.icon-4x{font-size:4em}.icon-4x.icon-border{border-width:4px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px}.icon-5x{font-size:5em}.icon-5x.icon-border{border-width:5px;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.pull-right,#content h3:not(.modal-title) .panel-heading-action,#content .panel-heading:not(.modal-title) .panel-heading-action,#content .panel-heading .panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header .panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header .panel-heading-action{float:right}.pull-left,.page-head h2.page-title{float:left}[class^="icon-"].pull-left,.page-head h2[class^="icon-"].page-title,[class*=" icon-"].pull-left,.page-head h2[class*=" icon-"].page-title{margin-right:.3em}[class^="icon-"].pull-right,#content h3:not(.modal-title) [class^="icon-"].panel-heading-action,#content .panel-heading [class^="icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class^="icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class^="icon-"].panel-heading-action,[class*=" icon-"].pull-right,#content h3:not(.modal-title) [class*=" icon-"].panel-heading-action,#content .panel-heading [class*=" icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class*=" icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class*=" icon-"].panel-heading-action{margin-left:.3em}[class^="icon-"],[class*=" icon-"]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0}.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],#header_infos .nav>.active>a>[class^="icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class^="icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class^="icon-"],.navbar-inverse #header_employee_box>.active>a>[class^="icon-"],#header_infos #header_employee_box>.active>a>[class^="icon-"],.navbar-inverse #header_quick>.active>a>[class^="icon-"],#header_infos #header_quick>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],#header_infos .nav>.active>a>[class*=" icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],.navbar-inverse #header_employee_box>.active>a>[class*=" icon-"],#header_infos #header_employee_box>.active>a>[class*=" icon-"],.navbar-inverse #header_quick>.active>a>[class*=" icon-"],#header_infos #header_quick>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],Line truncated
+ */@font-face{font-family:'FontAwesome';src:url("../font/fontawesome-webfont.eot?v=3.2.1");src:url("../font/fontawesome-webfont.eot?#iefix&v=3.2.1") format("embedded-opentype"),url("../font/fontawesome-webfont.woff?v=3.2.1") format("woff"),url("../font/fontawesome-webfont.ttf?v=3.2.1") format("truetype"),url("../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1") format("svg");font-weight:normal;font-style:normal}[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em}[class^="icon-"]:before,[class*=" icon-"]:before{text-decoration:inherit;display:inline-block;speak:none}.icon-large:before{vertical-align:-10%;font-size:1.3333333333333333em}a [class^="icon-"],a [class*=" icon-"]{display:inline}[class^="icon-"].icon-fixed-width,[class*=" icon-"].icon-fixed-width{display:inline-block;width:1.1428571428571428em;text-align:right;padding-right:0.2857142857142857em}[class^="icon-"].icon-fixed-width.icon-large,[class*=" icon-"].icon-fixed-width.icon-large{width:1.4285714285714286em}.icons-ul{margin-left:2.142857142857143em;list-style-type:none}.icons-ul>li{position:relative}.icons-ul .icon-li{position:absolute;left:-2.142857142857143em;width:2.142857142857143em;text-align:center;line-height:inherit}[class^="icon-"].hide,[class*=" icon-"].hide{display:none}.icon-muted{color:#eeeeee}.icon-light{color:#ffffff}.icon-dark{color:#333333}.icon-border{border:solid 1px #eeeeee;padding:.2em .25em .15em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.icon-2x{font-size:2em}.icon-2x.icon-border{border-width:2px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.icon-3x{font-size:3em}.icon-3x.icon-border{border-width:3px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.icon-4x{font-size:4em}.icon-4x.icon-border{border-width:4px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px}.icon-5x{font-size:5em}.icon-5x.icon-border{border-width:5px;-webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px}.pull-right,#content h3:not(.modal-title) .panel-heading-action,#content .panel-heading:not(.modal-title) .panel-heading-action,#content .panel-heading .panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header .panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header .panel-heading-action{float:right}.pull-left,.page-head h2.page-title{float:left}[class^="icon-"].pull-left,.page-head h2[class^="icon-"].page-title,[class*=" icon-"].pull-left,.page-head h2[class*=" icon-"].page-title{margin-right:.3em}[class^="icon-"].pull-right,#content h3:not(.modal-title) [class^="icon-"].panel-heading-action,#content .panel-heading [class^="icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class^="icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class^="icon-"].panel-heading-action,[class*=" icon-"].pull-right,#content h3:not(.modal-title) [class*=" icon-"].panel-heading-action,#content .panel-heading [class*=" icon-"].panel-heading-action,#content #header_notifs_icon_wrapper .notifs_panel .notifs_panel_header [class*=" icon-"].panel-heading-action,#header_notifs_icon_wrapper .notifs_panel #content .notifs_panel_header [class*=" icon-"].panel-heading-action{margin-left:.3em}[class^="icon-"],[class*=" icon-"]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0}.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],#header_infos .nav>.active>a>[class^="icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class^="icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class^="icon-"],.navbar-inverse #header_employee_box>.active>a>[class^="icon-"],#header_infos #header_employee_box>.active>a>[class^="icon-"],.navbar-inverse #header_quick>.active>a>[class^="icon-"],#header_infos #header_quick>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],#header_infos .nav>.active>a>[class*=" icon-"],.navbar-inverse #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],#header_infos #header_notifs_icon_wrapper>.active>a>[class*=" icon-"],.navbar-inverse #header_employee_box>.active>a>[class*=" icon-"],#header_infos #header_employee_box>.active>a>[class*=" icon-"],.navbar-inverse #header_quick>.active>a>[class*=" icon-"],#header_infos #header_quick>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],Line truncated
  * Ladda
  * http://lab.hakim.se/ladda
  * MIT licensed

admin-dev/themes/default/scss/admin-theme/_admin-commons.sass

@@ -97,5 +97,6 @@
 
 
 .overflow-y
-	height: 200px
+	max-height: 200px
+	margin-bottom: 15px
 	overflow-y: auto

admin-dev/themes/default/template/controllers/payment/restrictions.tpl

@@ -30,95 +30,101 @@
 			{$list['title']}
 		</h3>
 		<p class="help-block">{$list['desc']}</p>
-		<div class="row table-responsive clearfix overflow-y">
+		<div class="row table-responsive clearfix ">
-			<table class="table">
+			<div class="overflow-y">
-				<tr>
+				<table class="table">
-					<th width="40%"><span class="title_box">{$list['title']}<span></th>
+					<thead>
-					{foreach $payment_modules as $module}
+						<tr>
-						{if $module->active}
+							<th width="40%"><span class="title_box">{$list['title']}<span></th>
-							<th class="center">
+							{foreach $payment_modules as $module}
-								{if $list['name_id'] != 'currency' || $module->currencies_mode == 'checkbox'}
+								{if $module->active}
-									<input type="hidden" id="checkedBox_{$list['name_id']}_{$module->name}" value="checked"/>
+									<th class="text-center">
-									<a href="javascript:checkPaymentBoxes('{$list['name_id']}', '{$module->name}')">
+										{if $list['name_id'] != 'currency' || $module->currencies_mode == 'checkbox'}
-								{/if}
+											<input type="hidden" id="checkedBox_{$list['name_id']}_{$module->name}" value="checked"/>
-								&nbsp;<img src="{$ps_base_uri}modules/{$module->name}/logo.gif" alt="{$module->name}" title="{$module->displayName}"/>
+											<a href="javascript:checkPaymentBoxes('{$list['name_id']}', '{$module->name}')">
-								{if $list['name_id'] != 'currency' || $module->currencies_mode == 'checkbox'}
-									</a>
-								{/if}
-							</th>
-						{/if}
-					{/foreach}
-				</tr>
-				{foreach $list['items'] as $item}
-					<tr>
-						<td>
-							<span>{$item['name']}</span>
-						</td>
-						{foreach $payment_modules as $key_module => $module}
-							{if $module->active}
-								<td class="center">
-									{assign var='type' value='null'}
-									{if !$item['check_list'][$key_module]}
-										{* Keep $type to null *}
-									{elseif $list['name_id'] === 'currency'}
-										{if $module->currencies && $module->currencies_mode == 'checkbox'}
-											{$type = 'checkbox'}
-										{elseif $module->currencies && $module->currencies_mode == 'radio'}
-											{$type = 'radio'}
 										{/if}
-									{else}
+										{$module->displayName}
-										{$type = 'checkbox'}
+										{if $list['name_id'] != 'currency' || $module->currencies_mode == 'checkbox'}
-									{/if}
+											</a>
-									{if $type != 'null'}
+										{/if}
-										<input type="{$type}" name="{$module->name}_{$list['name_id']}[]" value="{$item[$list['identifier']]}" {if $item['check_list'][$key_module] == 'checked'}checked="checked"{/if}/>
+									</th>
-									{else}
+								{/if}
-										<input type="hidden" name="{$module->name}_{$list['name_id']}[]" value="{$item[$list['identifier']]}"/>--
+							{/foreach}
-									{/if}
+						</tr>
-								</td>
+					</thead>
-							{/if}
+					<tbody>
-						{/foreach}
+					{foreach $list['items'] as $item}
-					</tr>
+						<tr>
-				{/foreach}
+							<td>
-				{if $list['name_id'] === 'currency'}
+								<span>{$item['name']}</span>
-					<tr>
+							</td>
-						<td>
+							{foreach $payment_modules as $key_module => $module}
-							<span>{l s='Customer currency'}</span>
+								{if $module->active}
-						</td>
+									<td class="text-center">
-						{foreach $payment_modules as $module}
+										{assign var='type' value='null'}
-							{if $module->active}
+										{if !$item['check_list'][$key_module]}
-								<td>
+											{* Keep $type to null *}
-									{if $module->currencies && $module->currencies_mode == 'radio'}
+										{elseif $list['name_id'] === 'currency'}
-										<input type="radio" name="{$module->name}_{$list['name_id']}[]" value="-1"{if in_array(-1, $module->$list['name_id'])} checked="checked"
+											{if $module->currencies && $module->currencies_mode == 'checkbox'}
-									{/if} />
+												{$type = 'checkbox'}
-									{else}
+											{elseif $module->currencies && $module->currencies_mode == 'radio'}
-										--
+												{$type = 'radio'}
-									{/if}
+											{/if}
-								</td>
+										{else}
-							{/if}
+											{$type = 'checkbox'}
-						{/foreach}
+										{/if}
-					</tr>
+										{if $type != 'null'}
-					<tr>
+											<input type="{$type}" name="{$module->name}_{$list['name_id']}[]" value="{$item[$list['identifier']]}" {if $item['check_list'][$key_module] == 'checked'}checked="checked"{/if}/>
-						<td>
+										{else}
-							<span>{l s='Shop default currency'}</span>
+											<input type="hidden" name="{$module->name}_{$list['name_id']}[]" value="{$item[$list['identifier']]}"/>--
-						</td>
+										{/if}
-						{foreach $payment_modules as $module}
+									</td>
-							{if $module->active}
+								{/if}
-								<td>
+							{/foreach}
-									{if $module->currencies && $module->currencies_mode == 'radio'}
+						</tr>
-										<input type="radio" name="{$module->name}_{$list['name_id']}[]" value="-2"{if in_array(-2, $module->$list['name_id'])} checked="checked"
+					{/foreach}
-									{/if} 
+					{if $list['name_id'] === 'currency'}
-										/>
+						<tr>
-									{else}
+							<td>
-										--
+								<span>{l s='Customer currency'}</span>
-									{/if}
+							</td>
-								</td>
+							{foreach $payment_modules as $module}
-							{/if}
+								{if $module->active}
-						{/foreach}
+									<td class="text-center">
-					</tr>
+										{if $module->currencies && $module->currencies_mode == 'radio'}
-				{/if}
+											<input type="radio" name="{$module->name}_{$list['name_id']}[]" value="-1"{if in_array(-1, $module->$list['name_id'])} checked="checked"
-			</table>
+										{/if} />
+										{else}
+											--
+										{/if}
+									</td>
+								{/if}
+							{/foreach}
+						</tr>
+						<tr>
+							<td>
+								<span>{l s='Shop default currency'}</span>
+							</td>
+							{foreach $payment_modules as $module}
+								{if $module->active}
+									<td class="text-center">
+										{if $module->currencies && $module->currencies_mode == 'radio'}
+											<input type="radio" name="{$module->name}_{$list['name_id']}[]" value="-2"{if in_array(-2, $module->$list['name_id'])} checked="checked"
+										{/if} 
+											/>
+										{else}
+											--
+										{/if}
+									</td>
+								{/if}
+							{/foreach}
+						</tr>
+					{/if}
+					</tbody>
+				</table>
+			</div>
 		</div>
-		<div class="row pull-right">
+		<div class="row">
 			<button type="submit" class="btn btn-default" name="submitModule{$list['name_id']}"> 
 				<i class="icon-save"></i>
 				{l s='Save restrictions'}

classes/controller/AdminController.php

@@ -1950,7 +1950,7 @@ class AdminControllerCore extends Controller
 			_PS_JS_DIR_.'toggle.js',
 			_PS_JS_DIR_.'tools.js',
 			_PS_JS_DIR_.'ajax.js',
-			//_PS_JS_DIR_.'toolbar.js',
+			_PS_JS_DIR_.'toolbar.js',
 		));
 
 		//loads specific javascripts for the admin theme, bootstrap.js should be moved into /js root directory

classes/controller/FrontController.php

@@ -748,7 +748,6 @@ class FrontControllerCore extends Controller
 			$this->addJqueryUI('ui.sortable');
 			$this->addjqueryPlugin('fancybox');
 			$this->addJS(_PS_JS_DIR_.'hookLiveEdit.js');
-			$this->addCSS(_PS_CSS_DIR_.'jquery.fancybox-1.3.4.css', 'all'); // @TODO
 		}
 		if ($this->context->language->is_rtl)
 			$this->addCSS(_THEME_CSS_DIR_.'rtl.css');

controllers/admin/AdminImportController.php

@@ -506,7 +506,6 @@ class AdminImportControllerCore extends AdminController
 		$this->toolbar_btn = array();
 
 		// adds fancybox
-		$this->addCSS(_PS_CSS_DIR_.'jquery.fancybox-1.3.4.css', 'screen');
 		$this->addJqueryPlugin(array('fancybox'));
 
 		$entity_selected = 0;

controllers/front/ProductController.php

@@ -46,7 +46,6 @@ class ProductControllerCore extends FrontController
 		if ($this->context->getMobileDevice() == false)
 		{
 			$this->addCSS(_THEME_CSS_DIR_.'product.css');
-			$this->addCSS(_PS_CSS_DIR_.'jquery.fancybox-1.3.4.css', 'screen');
 			$this->addJqueryPlugin(array('fancybox', 'idTabs', 'scrollTo', 'serialScroll'));
 			$this->addJS(array(
 				_THEME_JS_DIR_.'tools.js',

mails/en/account.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for creating a customer account at {shop_name}.</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for creating a customer account at {shop_name}.</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your {shop_name} login details		</p>
 		<span style="color:#777">
 			Here are your login details:<br /> 
@@ -42,11 +97,11 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">Important Security Tips:</p>
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">Important Security Tips:</p>
 		<ol>
 			<li>Always keep your account details safe.</li>
 			<li>Never disclose your login details to anyone.</li>
@@ -56,19 +111,19 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>You can now place orders on our shop: <a href="{shop_url}" style="color:#337ff1">{shop_name}</a></span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/backoffice_order.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			A new order has been generated on your behalf.		</p>
 		<span style="color:#777">
 			Please go on <a href="{order_link}" style="color:#337ff1">{order_link}</a> to finalize the payment.		</span>
@@ -40,10 +95,10 @@
 
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/bankwire.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for shopping with {shop_name}!</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for shopping with {shop_name}!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Awaiting wire payment 
 		</p>
 		<span style="color:#777">
@@ -40,11 +95,11 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			You have selected to pay by wire transfer.		</p>
 		<span style="color:#777">
 			Here are the bank details for your transfer:<br /> 
@@ -56,26 +111,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/cheque.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,28 +77,28 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for shopping with {shop_name}!</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for shopping with {shop_name}!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Awaiting check payment		</p>
 		<span style="color:#777">
 			Your order with the reference <span style="color:#333"><strong>{order_name}</strong></span> has been placed successfully and will be <strong>shipped as soon as we receive your payment</strong>.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			You have selected to pay by check.		</p>
 		<span style="color:#777">
 			Here are the bank details for your check:<br /> 
@@ -55,16 +110,16 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
@@ -72,10 +127,10 @@
 
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/contact.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Message from a {shop_name} customer		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Customer e-mail address: <a href="mailto:{email}" style="color:#337ff1">{email}</a></strong></span><br /><br />
@@ -43,10 +98,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/contact_form.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your message to {shop_name} Customer Service		</p>
 		<span style="color:#777">
 			Your message has been sent successfully.<br /><br />
@@ -43,20 +98,20 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			We will answer as soon as possible.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/credit_slip.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,36 +77,36 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Credit slip created		</p>
 		<span style="color:#777">
 			We have generated a credit slip in your name for order with the reference <span style="color:#333"><strong>{order_name}</strong></span>.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review this credit slip and download your invoice from the <a href="{history_url}" style="color:#337ff1">"My credit slips"</a> section of your account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/download_product.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for your order with the reference {order_name} from <strong>{shop_name}</strong></span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for your order with the reference {order_name} from <strong>{shop_name}</strong></span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Product(s) now available for download		</p>
 		<span style="color:#777">
 			You have <span style="color:#333"><strong>{nbProducts}</strong></span> product(s) now available for download using the following link(s):<br/><br/>
@@ -41,26 +96,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}?id_order={order_name}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/employee_password.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your {shop_name} login information		</p>
 		<span style="color:#777">
 			Here is your personal login information for <span style="color:#333"><strong>{shop_name}</strong></span>:<br/><br/>
@@ -44,10 +99,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/forward_msg.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Customer service - Forwarded discussion		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>{employee}</strong></span> wanted to forward this discussion to you. <br /><br />
@@ -42,10 +97,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/guest_to_customer.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your customer account creation		</p>
 		<span style="color:#777">
 			Your guest account for <span style="color:#333"><strong>{shop_name}</strong></span> has been transformed into a customer account. <br /><br />
@@ -41,16 +96,16 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			Please be careful when sharing these login details with others.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can access your customer account on our shop: <strong>{shop_url}</strong>
 		</span>
@@ -58,10 +113,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/header.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

mails/en/in_transit.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;In transit		</p>
 		<span style="color:#777">
 			Your order with the reference <span style="color:#333"><strong>{order_name}</strong></span> is currently in transit. <br /><br />
@@ -40,26 +95,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/log_alert.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			You have received a new log alert		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Warning:</strong></span> you have received a new log alert in your Back Office.<br /><br />
@@ -40,10 +95,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/newsletter.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,21 +77,21 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		{message}
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_canceled.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Order cancelled		</p>
 		<span style="color:#777">
 			Your order with the reference <span style="color:#333"><strong>{order_name}</strong></span> from <span style="color:#333"><strong>{shop_name}</strong></span> has been cancelled.<br />
@@ -39,26 +94,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_changed.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Order changed		</p>
 		<span style="color:#777">
 			Your order with the reference <span style="color:#333"><strong>{order_name}</strong></span> from <span style="color:#333"><strong>{shop_name}</strong></span> has been changed by the merchant.<br />
@@ -39,26 +94,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_conf.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for shopping with {shop_name}!</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for shopping with {shop_name}!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order details		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Order:</strong></span> {order_name} Placed on {date}<br /><br />
@@ -42,58 +97,58 @@
 </tr>
 <tr>
 	<td style="border:none;padding:7px 0">
-		<table class="table table-recap" bgcolor="#ffffff" style="width:285px;margin:auto;display:block;background-color:#fff"><!-- Title -->
+		<table class="table table-recap" bgcolor="#ffffff" style="width:100%;background-color:#fff"><!-- Title -->
-			<thead style="display:block">
+			<thead>
-				<tr style="display:block">
+				<tr>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Reference</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Reference</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Product</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Product</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Unit price</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Unit price</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Quantity</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Quantity</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Total price</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Total price</th>
 				</tr>
 			</thead>
 			<tbody>
-				<tr style="display:block">
+				<tr>
-					<td colspan="5" style="color:#777;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">
+					<td colspan="5" style="color:#777;padding:10px!important;border:1px solid #DDD!important">
 						{products}
 					</td>
 				</tr>
-				<tr style="display:block">
+				<tr>
-					<td colspan="5" style="color:#777;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">
+					<td colspan="5" style="color:#777;padding:10px!important;border:1px solid #DDD!important">
 						{discounts}
 					</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Products</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Products</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_products}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_products}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Discounts</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Discounts</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_discounts}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_discounts}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Gift-wrapping</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Gift-wrapping</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_wrapping}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_wrapping}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Shipping</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Shipping</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_shipping}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_shipping}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Total Tax paid</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Total Tax paid</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_tax_paid}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_tax_paid}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" class="total" style="color:#555454;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important;font-size:18px;font-weight:500;font-family:Open-sans, sans-serif"><strong>Total paid</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" class="total" style="color:#555454;padding:10px!important;border:1px solid #DDD!important;font-size:18px;font-weight:500;font-family:Open-sans, sans-serif"><strong>Total paid</strong></td>
-					<td bgcolor="#fbfbfb" align="right" class="total_amount" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important;font-size:21px;font-weight:500;font-family:Open-sans, sans-serif">{total_paid}</td>
+					<td bgcolor="#fbfbfb" align="right" class="total_amount" style="color:#333;padding:10px!important;border:1px solid #DDD!important;font-size:21px;font-weight:500;font-family:Open-sans, sans-serif">{total_paid}</td>
 				</tr>
 			</tbody>
 		</table>
 	</td>
 </tr>
 <tr>
-	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Shipping		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Carrier:</strong></span> {carrier}<br /><br />
@@ -102,22 +157,22 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
 	<td style="border:none;padding:7px 0">
-		<table class="table" style="width:285px;margin:auto;background-color:#fff">
+		<table class="table" style="width:100%;background-color:#fff">
 			<tr>
-				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block;margin-bottom:10px">
+				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 						Delivery address					</p>
 					<span style="color:#777">
 						{delivery_block_html}
 					</span>
 				</td>
-				<td width="20" class="space_address" style="display:none;border:none;padding:7px 0">&nbsp;</td>
+				<td width="20" class="space_address" style="border:none;padding:7px 0">&nbsp;</td>
-				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block;margin-bottom:10px">
+				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 						Billing address					</p>
 					<span style="color:#777">
 						{invoice_block_html}
@@ -128,26 +183,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_customer_comment.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Message from a customer		</p>
 		<span style="color:#777">
 			You have received a new message regarding order with the reference <span style="color:#333"><strong>{order_name}</strong></span>.<br /><br />
@@ -42,10 +97,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_merchant_comment.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Message from {shop_name}		</p>
 		<span style="color:#777">
 			You have received a new message from <span style="color:#333"><strong>{shop_name}</strong></span> regarding order with the reference <span style="color:#333"><strong>{order_name}</strong></span>.<br /><br />
@@ -41,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/order_return_state.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Return #{id_order_return} - update		</p>
 		<span style="color:#777">
 			We have updated the progress on your return #{id_order_return}, the new status is: <span style="color:#333"><strong>"{state_order_return}"</strong></span><br /><br />
@@ -40,20 +95,20 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/outofstock.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,43 +77,43 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thanks for your order with the reference {order_name} from {shop_name}.</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thanks for your order with the reference {order_name} from {shop_name}.</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Item(s) out of stock		</p>
 		<span style="color:#777">
 			Unfortunately, one or more items are currently out of stock. This may cause a slight delay in your delivery. Please accept our apologies and rest assured that we are working hard to rectify this.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/password.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your new {shop_name} login details		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>E-mail address:</strong></span> {email}<br/>
@@ -40,26 +95,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/password_query.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Password reset request for {shop_name}		</p>
 		<span style="color:#777">
 			You have requested to reset your <span style="color:#333"><strong>{shop_name}</strong></span> login details.<br/><br/>
@@ -42,10 +97,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/payment.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,43 +77,43 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for shopping with {shop_name}!</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for shopping with {shop_name}!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Payment processed		</p>
 		<span style="color:#777">
 			Your payment for order with the reference <strong><span style="color:#333">{order_name}</span></strong> was successfully processed.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/payment_error.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Payment processing error		</p>
 		<span style="color:#777">
 			There is a problem with your payment for <strong><span style="color:#333">{shop_name}</span></strong> order with the reference <strong><span style="color:#333">{order_name}</span></strong>. Please contact us at your earliest convenience.<br/>
@@ -40,26 +95,26 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/preparation.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,42 +77,42 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Processing		</p>
 		<span style="color:#777">
 			We are currently processing your <strong><span style="color:#333">{shop_name}</span></strong> order with the reference <strong><span style="color:#333">{order_name}</span></strong>.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/refund.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,42 +77,42 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Refund processed		</p>
 		<span style="color:#777">
 			We have processed your <strong><span style="color:#333">{shop_name}</span></strong> refund for order with the reference <strong><span style="color:#333">{order_name}</span></strong>.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/reply_msg.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,39 +77,39 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>{reply}</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can review your order and download your invoice from the <a href="{history_url}" style="color:#337ff1">"Order history"</a> section of your customer account by clicking <a href="{my_account_url}" style="color:#337ff1">"My account"</a> on our shop.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			If you have a guest account, you can follow your order via the <a href="{guest_tracking_url}" style="color:#337ff1">"Guest Tracking"</a> section on our shop.		</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/shipped.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for shopping with {shop_name}!</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for shopping with {shop_name}!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Shipped		</p>
 		<span style="color:#777">
 			Your order with the reference <span style="color:#333"><strong>{order_name}</strong></span> has been shipped.<br /> 
@@ -40,7 +95,7 @@
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			You can now place orders on our shop: <a href="{shop_url}" style="color:#337ff1">{shop_name}</a>
 		</span>
@@ -48,10 +103,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/test.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,15 +77,15 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hello</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hello</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>
 			This is a <strong>test e-mail</strong> from your shop.<br /><br /> If you can read this, the test was successful!.
 		</span>
@@ -38,10 +93,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/voucher.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order {order_name}&nbsp;-&nbsp;Voucher created		</p>
 		<span style="color:#777">
 			A voucher has been created in your name as a result of your order with the reference <span style="color:#333"><strong>{order_name}</strong></span>.<br/><br/>
@@ -41,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

mails/en/voucher_new.html

@@ -6,15 +6,70 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -22,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			This is to inform you about the creation of a voucher.		</p>
 		<span style="color:#777">
 			Here is the code of your voucher: <span style="color:#333"><strong>{voucher_num}</strong></span><br/><br/>
@@ -39,10 +94,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/blocknewsletter/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/blocknewsletter/mails/en/newsletter_conf.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,25 +77,25 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777"><strong>
 			Thank you for subscribing to our newsletter.		</strong></span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/blocknewsletter/mails/en/newsletter_verif.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,15 +77,15 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777">
 			Thank you for subscribing to our newsletter, please confirm your request by clicking the link below :<br/>
 			<span style="color:#333"><strong><a href="{verif_url}" style="color:#337ff1">{verif_url}</a></strong></span>
@@ -38,10 +94,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/blocknewsletter/mails/en/newsletter_voucher.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Newsletter subscription		</p>
 		<span style="color:#777">
 			Regarding your newsletter subscription, we are pleased to offer you the following voucher: <span style="color:#333"><strong>{discount}</strong></span>
@@ -39,10 +95,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/blockwishlist/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/blockwishlist/mails/en/wishlink.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Message from {shop_name}		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>{shop_name}</strong></span> invites you to send this link to your friends, so they can see your wishlist: <span style="color:#333"><strong>{wishlist}</strong></span><br /><br />
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/blockwishlist/mails/en/wishlist.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Message from {shop_name}		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>{firstname} {lastname}</strong></span> indicated you may want to see his/her wishlist: <span style="color:#333"><strong>{wishlist}</strong></span><br /><br />
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/followup/mails/en/followup_1.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your cart at {shop_name}		</p>
 		<span style="color:#777">
 			We noticed that during your last visit on {shop_name}, you did not complete the order you had started.<br /> <br /> 
@@ -39,11 +95,11 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your {shop_name} login details		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Here is your coupon:</strong></span> {voucher_num}<br />
@@ -52,10 +108,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/followup/mails/en/followup_2.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for your order at {shop_name}.</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for your order at {shop_name}.</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777">
 			As our way of saying thanks, we want to give you a discount of <span style="color:#333"><strong>{amount}</strong></span>% off your next order! This offer is valid for <span style="color:#333"><strong>{days}</strong></span> days, so do not waste a moment!<br /> <br /> 
 			<span style="color:#333"><strong>Here is your coupon:</strong></span> {voucher_num}<br /><br />
@@ -39,10 +95,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/followup/mails/en/followup_3.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thanks for your trust.</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thanks for your trust.</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			You are one of our best customers and as such we want to thank you for your continued patronage.		</p>
 		<span style="color:#777">
 			As appreciation for your loyalty, we want to give you a discount of <span style="color:#333"><strong>{amount}</strong></span>% valid on your next order! This offer is valid for <span style="color:#333"><strong>{days}</strong></span> days, so do not waste a moment!<br /> <br /> 
@@ -41,10 +97,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/followup/mails/en/followup_4.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Your cart at {shop_name}		</p>
 		<span style="color:#777">
 			You are one of our best customers, however you have not placed an order in {days_threshold} days.<br /> <br /> 
@@ -39,10 +95,10 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777">
 			<span style="color:#333"><strong>Here is your coupon:</strong></span> {voucher_num}<br /><br />
 			Enter this code in your shopping cart to get your discount.		</span>
@@ -50,10 +106,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/followup/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/mailalerts/mails/en/customer_qty.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			{product} is now available.		</p>
 		<span style="color:#777">
 			This item is once again in-stock.<br /><br /> 
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/mailalerts/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/mailalerts/mails/en/new_order.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,21 +77,21 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Congratulations!</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Congratulations!</span>
 	</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>A new order was placed on {shop_name} from the following customer: {firstname} {lastname} ({email})</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Order details		</p>
 		<span style="color:#777">
 			<span style="color:#333"><strong>Order:</strong></span> {order_name} Placed on {date}<br /><br />
@@ -45,53 +101,53 @@
 </tr>
 <tr>
 	<td style="border:none;padding:7px 0">
-		<table class="table table-recap" bgcolor="#ffffff" style="width:285px;margin:auto;display:block;background-color:#fff"><!-- Title -->
+		<table class="table table-recap" bgcolor="#ffffff" style="width:100%;background-color:#fff"><!-- Title -->
-			<thead style="display:block">
+			<thead>
-				<tr style="display:block">
+				<tr>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Reference</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Reference</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Product</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Product</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Unit price</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Unit price</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Quantity</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Quantity</th>
-					<th style="display:block;border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Total price</th>
+					<th style="border:1px solid #DDD!important;background-color:#fbfbfb;font-family:Arial;color:#333;font-size:13px;padding:10px">Total price</th>
 				</tr>
 			</thead>
 			<tbody>
-				<tr style="display:block">
+				<tr>
-					<td colspan="5" style="color:#777;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">
+					<td colspan="5" style="color:#777;padding:10px!important;border:1px solid #DDD!important">
 						{items}
 					</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Products</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Products</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_products}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_products}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Discounts</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Discounts</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_discounts}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_discounts}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Gift-wrapping</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Gift-wrapping</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_wrapping}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_wrapping}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Shipping</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Shipping</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_shipping}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_shipping}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important"><strong>Total Tax paid</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" style="color:#333;padding:10px!important;border:1px solid #DDD!important"><strong>Total Tax paid</strong></td>
-					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important">{total_tax_paid}</td>
+					<td bgcolor="#fbfbfb" align="right" style="color:#333;padding:10px!important;border:1px solid #DDD!important">{total_tax_paid}</td>
 				</tr>
-				<tr class="conf_body" style="display:block">
+				<tr class="conf_body">
-					<td bgcolor="#fbfbfb" align="right" colspan="4" class="total" style="color:#555454;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important;font-size:18px;font-weight:500;font-family:Open-sans, sans-serif"><strong>Total paid</strong></td>
+					<td bgcolor="#fbfbfb" align="right" colspan="4" class="total" style="color:#555454;padding:10px!important;border:1px solid #DDD!important;font-size:18px;font-weight:500;font-family:Open-sans, sans-serif"><strong>Total paid</strong></td>
-					<td bgcolor="#fbfbfb" align="right" class="total_amount" style="color:#333;padding:10px!important;display:block;text-align:center;border:1px solid #DDD!important;font-size:21px;font-weight:500;font-family:Open-sans, sans-serif">{total_paid}</td>
+					<td bgcolor="#fbfbfb" align="right" class="total_amount" style="color:#333;padding:10px!important;border:1px solid #DDD!important;font-size:21px;font-weight:500;font-family:Open-sans, sans-serif">{total_paid}</td>
 				</tr>
 			</tbody>
 		</table>
 	</td>
 </tr>
 <tr>
-	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Carrier:		</p>
 		<span style="color:#777">
 			{carrier}
@@ -99,22 +155,22 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
 	<td style="border:none;padding:7px 0">
-		<table class="table" style="width:285px;margin:auto;background-color:#fff">
+		<table class="table" style="width:100%;background-color:#fff">
 			<tr>
-				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block;margin-bottom:10px">
+				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 						Delivery address					</p>
 					<span style="color:#777">
 						{delivery_block_html}
 					</span>
 				</td>
-				<td width="20" class="space_address" style="display:none;border:none;padding:7px 0">&nbsp;</td>
+				<td width="20" class="space_address" style="border:none;padding:7px 0">&nbsp;</td>
-				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block;margin-bottom:10px">
+				<td class="box address" width="310" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+					<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 						Billing address					</p>
 					<span style="color:#777">
 						{invoice_block_html}
@@ -125,11 +181,11 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" colspan="3" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Customer message:		</p>
 		<span style="color:#777">
 			{message}
@@ -138,10 +194,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/mailalerts/mails/en/productcoverage.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			{product} is almost out of stock.		</p>
 		<span style="color:#777">
 			The stock cover is now less than the specified minimum of: <strong><span style="color:#333">{warning_coverage}.</span></strong><br /><br /> 
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/mailalerts/mails/en/productoutofstock.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi,</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			{product} is nearly out of stock.		</p>
 		<span style="color:#777">
 			The remaining stock is now less than the specified minimum of <strong><span style="color:#333">{last_qty}.</span></strong><br /><br /> 
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/referralprogram/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/referralprogram/mails/en/referralprogram-congratulations.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,34 +77,34 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Congratulations!</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Congratulations!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777">
 			Your referred friend <span style="color:#333"><strong>{sponsored_firstname} {sponsored_lastname}</strong></span> has placed his or her first order on <a href="{shop_url}" style="color:#337ff1">{shop_name}</a>!<br /><br /> 
 			We are pleased to offer you a voucher worth <span style="color:#333"><strong>{discount_display} (voucher # {discount_name})</strong></span> that you can use on your next order.		</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>Best regards,</span>
 	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/referralprogram/mails/en/referralprogram-invitation.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,15 +77,15 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">{firstname_friend} {lastname_friend}, join us!</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">{firstname_friend} {lastname_friend}, join us!</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
 		<span style="color:#777">
 			Your friend <span style="color:#333"><strong>{firstname} {lastname}</strong></span> wants to refer you on <a href="{shop_url}" style="color:#337ff1">{shop_name}</a>!<br /><br /> 
 			We are pleased to offer you a voucher worth <span style="color:#333"><strong>{discount_display} (voucher # {discount_name})</strong></span> that you can use on your next order.			
@@ -38,19 +94,19 @@
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="linkbelow" style="width:auto;display:block;border:none;padding:7px 0">
+	<td class="linkbelow" style="border:none;padding:7px 0">
 		<span>When signing up, don&#039;t forget to provide the e-mail address of your referring friend: <span><strong>{email}</strong></span>.<br/><br/>
 		<span>Best regards,	</td>
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/referralprogram/mails/en/referralprogram-voucher.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,16 +77,16 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {firstname} {lastname},</span>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {firstname} {lastname},</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			Referral Program		</p>
 		<span style="color:#777">
 			We have created a voucher in your name for referring a friend.<br /> 
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/sendtoafriend/mails/en/header.html

@@ -6,14 +6,14 @@
 		<title>Message from {shop_name}</title>
 		
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>

modules/sendtoafriend/mails/en/send_to_a_friend.html

@@ -3,17 +3,73 @@
 <html>
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
 		<title>Message from {shop_name}</title>
 		
+
+		<style>
+			/****** responsive ********/
+			@media only screen and (max-width: 300px){ 
+				body {
+					width:218px !important;
+					margin:auto !important;
+				}
+				.table {width:195px !important;margin:auto !important;}
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto !important;display: block !important;}		
+				span.title{font-size:20px !important;line-height: 23px !important}
+				span.subtitle{font-size: 14px !important;line-height: 18px !important;padding-top:10px !important;display:block !important;}		
+				td.box p{font-size: 12px !important;font-weight: bold !important;}
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 200px!important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+							
+			@media only screen and (min-width: 301px) and (max-width: 500px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}	
+				.table-recap table, .table-recap thead, .table-recap tbody, .table-recap th, .table-recap td, .table-recap tr { 
+					display: block !important; 
+				}
+				.table-recap{width: 293px !important;}
+				.table-recap tr td, .conf_body td{text-align:center !important;}
+				
+			} 
+
+			@media only screen and (min-width: 501px) and (max-width: 768px) {
+				body {width:478px!important;margin:auto!important;}
+				.table {width:450px!important;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}			
+			}
+
+						
+			/* Mobile */
+
+			@media only screen and (max-device-width: 480px) { 
+				body {width:308px!important;margin:auto!important;}
+				.table {width:285px;margin:auto!important;}	
+				.logo, .titleblock, .linkbelow, .box, .footer, .space_footer{width:auto!important;display: block!important;}
+				
+				.table-recap{width: 285px!important;}
+				.table-recap tr td, .conf_body td{text-align:center!important;}	
+				.address{display: block !important;margin-bottom: 10px !important;}
+				.space_address{display: none !important;}	
+			} 
+		</style>
+
 	</head>
-	<body style="background-color:#fff;width:308px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
+	<body style="background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
-		<table class="table table-mail" style="width:285px;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid;margin:auto">
+		<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
 			<tr>
 				<td class="space" style="width:20px;border:none;padding:7px 0">&nbsp;</td>
 				<td align="center" style="border:none;padding:7px 0">
-					<table class="table" style="width:285px;margin:auto;background-color:#fff">
+					<table class="table" style="width:100%;background-color:#fff">
 						<tr>
-							<td align="center" class="logo" style="border-bottom:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td align="center" class="logo" style="border-bottom:4px solid #333!important;border:none;padding:7px 0">
 								<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
 									<img src="{shop_logo}" alt="{shop_name}" />
 								</a>
@@ -21,17 +77,17 @@
 						</tr>
 
 <tr>
-	<td align="center" class="titleblock" style="width:auto;display:block;border:none;padding:7px 0">
+	<td align="center" class="titleblock" style="border:none;padding:7px 0">
-		<span class="title" style="font-weight:500;font-size:20px;text-transform:uppercase;line-height:23px">Hi {name},</span><br/>
+		<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi {name},</span><br/>
-		<span class="subtitle" style="font-weight:500;font-size:14px;text-transform:uppercase;line-height:18px;padding-top:10px;display:block">Thank you for creating a customer account at {shop_name}.</span>
+		<span class="subtitle" style="font-weight:500;font-size:16px;text-transform:uppercase;line-height:25px">Thank you for creating a customer account at {shop_name}.</span>
 	</td>
 </tr>
 <tr>
-	<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+	<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 </tr>
 <tr>
-	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important;width:auto;display:block">
+	<td class="box" style="background-color:#fbfbfb;border:1px solid #d6d4d4!important;padding:10px!important">
-		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:700;font-size:12px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
+		<p style="margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;border-bottom:1px solid #d6d4d4!important;padding-bottom:10px">
 			{customer} has sent you a link to a product that (s)he thinks may interest you.		</p>
 		<span style="color:#777">
 			Click here to view this item: <a href="{product_link}" style="color:#337ff1">{product}</a>
@@ -40,10 +96,10 @@
 </tr>
 
 						<tr>
-							<td class="space_footer" style="padding:0!important;width:auto;display:block;border:none">&nbsp;</td>
+							<td class="space_footer" style="padding:0!important;border:none">&nbsp;</td>
 						</tr>
 						<tr>
-							<td class="footer" style="border-top:4px solid #333!important;width:auto;display:block;border:none;padding:7px 0">
+							<td class="footer" style="border-top:4px solid #333!important;border:none;padding:7px 0">
 								<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop&trade;</a></span>
 							</td>
 						</tr>

modules/themeconfigurator/config.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+        <module>
+            <name>themeconfigurator</name>
+            <displayName><![CDATA[Theme configurator]]></displayName>
+            <version><![CDATA[0.1]]></version>
+            <description><![CDATA[Configure elements of your theme]]></description>
+            <author><![CDATA[]]></author>
+            <tab><![CDATA[front_office_features]]></tab>
+            <is_configurable>1</is_configurable>
+            <need_instance>1</need_instance>
+	<limited_countries></limited_countries>
+        </module>

modules/themeconfigurator/themeconfigurator.php

@@ -0,0 +1,181 @@
+<?php
+/*
+* 2007-2013 PrestaShop
+*
+* NOTICE OF LICENSE
+*
+* This source file is subject to the Academic Free License (AFL 3.0)
+* that is bundled with this package in the file LICENSE.txt.
+* It is also available through the world-wide-web at this URL:
+* http://opensource.org/licenses/afl-3.0.php
+* If you did not receive a copy of the license and are unable to
+* obtain it through the world-wide-web, please send an email
+* to license@prestashop.com so we can send you a copy immediately.
+*
+* DISCLAIMER
+*
+* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+* versions in the future. If you wish to customize PrestaShop for your
+* needs please refer to http://www.prestashop.com for more information.
+*
+*  @author PrestaShop SA <contact@prestashop.com>
+*  @copyright  2007-2013 PrestaShop SA
+*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
+*  International Registered Trademark & Property of PrestaShop SA
+*/
+
+if (!defined('_PS_VERSION_'))
+	exit;	
+	
+class ThemeConfigurator extends Module
+{
+	public function __construct()
+	{
+		$this->name = 'themeconfigurator';
+		$this->tab = 'front_office_features';
+		$this->version = '0.1';
+		parent::__construct();	
+		$this->displayName = $this->l('Theme configurator');
+		$this->description = $this->l('Configure elements of your theme');
+	}
+	
+	
+	public function getContent()
+	{
+		if (Tools::isSubmit('submitModule'))
+		{
+			Configuration::updateValue('PS_QUICK_VIEW', (int)Tools::getValue('quick_view'));
+			foreach($this->getConfigurableModules() as $module)
+			{
+				if (!isset($module['is_module']) || !$module['is_module'] || !Validate::isModuleName($module['name']))
+					continue;
+
+				$module_instance = Module::getInstanceByName($module['name']);
+				if ($module_instance === false || !is_object($module_instance))
+					continue;
+
+				$is_installed = (int)Validate::isLoadedObject($module_instance);
+				if ($is_installed)
+				{
+					if (($active = (int)Tools::getValue($module['name'])) == $module_instance->active)
+						continue;
+
+					if ($active)
+						$module_instance->enable();
+					else
+						$module_instance->disable();
+				}
+				else
+					if ((int)Tools::getValue($module['name']))
+						$module_instance->install();
+			}			
+		}
+		return $this->renderForm();
+	}
+
+	public function renderForm()
+	{
+
+		$inputs = array();
+		foreach ($this->getConfigurableModules() as $module)
+			$inputs[] = array(
+				'type' => 'switch',
+				'label' => $module['label'],
+				'name' => $module['name'],
+				'desc' => (isset($module['desc']) ? $module['desc'] : ''),
+				'values' => array(
+							array(
+								'id' => 'active_on',
+								'value' => 1,
+								'label' => $this->l('Enabled')
+							),
+							array(
+								'id' => 'active_off',
+								'value' => 0,
+								'label' => $this->l('Disabled')
+							)
+						),
+				);
+		
+		$fields_form = array(
+			'form' => array(
+				'legend' => array(
+					'title' => $this->l('Settings'),
+					'icon' => 'icon-cogs'
+				),
+				'input' => $inputs,
+				'submit' => array(
+					'title' => $this->l('Save'),
+					'class' => 'btn btn-primary')
+				),
+		);
+		
+		$helper = new HelperForm();
+		$helper->show_toolbar = false;
+		$helper->table = $this->table;
+		$lang = new Language((int)Configuration::get('PS_LANG_DEFAULT'));
+		$helper->default_form_language = $lang->id;
+		$helper->allow_employee_form_lang = Configuration::get('PS_BO_ALLOW_EMPLOYEE_FORM_LANG') ? Configuration::get('PS_BO_ALLOW_EMPLOYEE_FORM_LANG') : 0;
+		$this->fields_form = array();
+
+		$helper->identifier = $this->identifier;
+		$helper->submit_action = 'submitModule';
+		$helper->currentIndex = $this->context->link->getAdminLink('AdminModules', false).'&configure='.$this->name.'&tab_module='.$this->tab.'&module_name='.$this->name;
+		$helper->token = Tools::getAdminTokenLite('AdminModules');
+		$helper->tpl_vars = array(
+			'fields_value' => $this->getConfigFieldsValues(),
+			'languages' => $this->context->controller->getLanguages(),
+			'id_language' => $this->context->language->id
+		);
+
+		return $helper->generateForm(array($fields_form));
+	}
+	
+	protected function getConfigurableModules()
+	{
+		return array(
+			array(
+				'label' => $this->l('Display the reinsurance block'),
+				'name' => 'blockreinsurance',
+				'desc' => '<a href="#">'.$this->l('Configure the reinsurance block').'</a>',
+				'value' => (int)(Validate::isLoadedObject($module = Module::getInstanceByName('blockreinsurance')) && $module->active),
+				'is_module' => true,
+			),
+			array(
+				'label' => $this->l('Display the social following links'),
+				'name' => 'blocksocial',
+				'desc' => '<a href="#">'.$this->l('Configure the social following links').'</a>',
+				'value' => (int)(Validate::isLoadedObject($module = Module::getInstanceByName('blocksocial')) && $module->active),
+				'is_module' => true,
+			),
+			array(
+				'label' => $this->l('Display contact information'),
+				'name' => 'blockcontactinfos',
+				'desc' => '<a href="#">'.$this->l('Configure the contact information of your store').'</a>',
+				'value' => (int)(Validate::isLoadedObject($module = Module::getInstanceByName('blockcontactinfos')) && $module->active),
+				'is_module' => true,
+			),
+			array(
+				'label' => $this->l('Display social buttons on the products page'),
+				'name' => 'addsharethis',
+				'desc' => '<a href="#">'.$this->l('Configure').'</a>',
+				'value' => (int)(Validate::isLoadedObject($module = Module::getInstanceByName('addsharethis')) && $module->active),
+				'is_module' => true,
+			),
+			array(
+				'label' => $this->l('Enable Quick view'),
+				'name' => 'quick_view',
+				'value' => (int)Tools::getValue('PS_QUICK_VIEW', Configuration::get('PS_QUICK_VIEW'))
+			)
+		);
+	}
+
+	public function getConfigFieldsValues()
+	{		
+		$values = array();		
+		foreach ($this->getConfigurableModules() as $module)
+			$values[$module['name']] = $module['value'];
+		return $values;
+
+	}		
+}

themes/default-bootstrap/footer.tpl

@@ -40,9 +40,6 @@
             	<div class="container">
                     <footer id="footer" class="row">
                         {$HOOK_FOOTER}
-                        {if $PS_ALLOW_MOBILE_DEVICE}
-                            <p class="text-center"><a href="{$link->getPageLink('index', true)}?mobile_theme_ok">{l s='Browse the mobile site'}</a></p>
-                        {/if}
                     </footer>
                 </div>
             </div>

themes/default/404.tpl

@@ -1,44 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-<div class="pagenotfound">
-	<h1>{l s='This page is not available'}</h1>
-
-	<p>
-		{l s='We\'re sorry, but the Web address you\'ve entered is no longer available.'}
-	</p>
-
-	<h3>{l s='To find a product, please type its name in the field below.'}</h3>
-	<form action="{$link->getPageLink('search')|escape:'html'}" method="post" class="std">
-		<fieldset>
-			<p>
-				<label for="search">{l s='Search our product catalog:'}</label>
-				<input id="search_query" name="search_query" type="text" />
-				<input type="submit" name="Submit" value="OK" class="button_small" />
-			</p>
-		</fieldset>
-	</form>
-
-	<p><a href="{$base_dir}" title="{l s='Home'}"><img src="{$img_dir}icon/home.gif" alt="{l s='Home'}" class="icon" /> {l s='Home'}</a></p>
-</div>

themes/default/address.tpl

@@ -1,250 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-<script type="text/javascript">
-// <![CDATA[
-var idSelectedCountry = {if isset($smarty.post.id_state)}{$smarty.post.id_state|intval}{else}{if isset($address->id_state)}{$address->id_state|intval}{else}false{/if}{/if};
-var countries = new Array();
-var countriesNeedIDNumber = new Array();
-var countriesNeedZipCode = new Array();
-{foreach from=$countries item='country'}
-	{if isset($country.states) && $country.contains_states}
-		countries[{$country.id_country|intval}] = new Array();
-		{foreach from=$country.states item='state' name='states'}
-			countries[{$country.id_country|intval}].push({ldelim}'id' : '{$state.id_state}', 'name' : '{$state.name|addslashes}'{rdelim});
-		{/foreach}
-	{/if}
-	{if $country.need_identification_number}
-		countriesNeedIDNumber.push({$country.id_country|intval});
-	{/if}
-	{if isset($country.need_zip_code)}
-		countriesNeedZipCode[{$country.id_country|intval}] = {$country.need_zip_code};
-	{/if}
-{/foreach}
-$(function(){ldelim}
-	$('.id_state option[value={if isset($smarty.post.id_state)}{$smarty.post.id_state|intval}{else}{if isset($address->id_state)}{$address->id_state|intval}{/if}{/if}]').attr('selected', true);
-{rdelim});
-{literal}
-	$(document).ready(function() {
-		$('#company').on('input',function(){
-			vat_number();
-		});
-		vat_number();
-		function vat_number()
-		{
-			if ($('#company').val() != '')
-				$('#vat_number').show();
-			else
-				$('#vat_number').hide();
-		}
-	});
-{/literal}
-//]]>
-</script>
-
-{capture name=path}{l s='Your addresses'}{/capture}
-{include file="$tpl_dir./breadcrumb.tpl"}
-
-<h1>{l s='Your addresses'}</h1>
-
-<h3>
-{if isset($id_address) && (isset($smarty.post.alias) || isset($address->alias))}
-	{l s='Modify address'} 
-	{if isset($smarty.post.alias)}
-		"{$smarty.post.alias}"
-	{else}
-		{if isset($address->alias)}"{$address->alias|escape:'html'}"{/if}
-	{/if}
-{else}
-	{l s='To add a new address, please fill out the form below.'}
-{/if}
-</h3>
-
-{include file="$tpl_dir./errors.tpl"}
-
-<p class="required"><sup>*</sup> {l s='Required field'}</p>
-
-<form action="{$link->getPageLink('address', true)|escape:'html'}" method="post" class="std" id="add_address">
-	<fieldset>
-		<h3>{if isset($id_address)}{l s='Your address'}{else}{l s='New address'}{/if}</h3>
-		<p class="required text dni">
-			<label for="dni">{l s='Identification number'} <sup>*</sup></label>
-			<input type="text" class="text" name="dni" id="dni" value="{if isset($smarty.post.dni)}{$smarty.post.dni}{else}{if isset($address->dni)}{$address->dni|escape:'html'}{/if}{/if}" />
-			<span class="form_info">{l s='DNI / NIF / NIE'}</span>
-		</p>
-	{assign var="stateExist" value=false}
-	{assign var="postCodeExist" value=false}
-	{foreach from=$ordered_adr_fields item=field_name}
-		{if $field_name eq 'company'}
-		<p class="text">
-			<label for="company">{l s='Company'}</label>
-			<input type="text" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company}{else}{if isset($address->company)}{$address->company|escape:'html'}{/if}{/if}" onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'vat_number'}
-			<div id="vat_area">
-				<div id="vat_number">
-					<p class="text">
-						<label for="vat_number">{l s='VAT number'}</label>
-						<input type="text" class="text" name="vat_number" value="{if isset($smarty.post.vat_number)}{$smarty.post.vat_number}{else}{if isset($address->vat_number)}{$address->vat_number|escape:'html'}{/if}{/if}" onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-					</p>
-				</div>
-			</div>
-		{/if}
-		{if $field_name eq 'firstname'}
-		<p class="required text">
-			<label for="firstname">{l s='First name'} <sup>*</sup></label>
-			<input type="text" name="firstname" id="firstname" value="{if isset($smarty.post.firstname)}{$smarty.post.firstname}{else}{if isset($address->firstname)}{$address->firstname|escape:'html'}{/if}{/if}"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'lastname'}
-		<p class="required text">
-			<label for="lastname">{l s='Last name'} <sup>*</sup></label>
-			<input type="text" id="lastname" name="lastname" value="{if isset($smarty.post.lastname)}{$smarty.post.lastname}{else}{if isset($address->lastname)}{$address->lastname|escape:'html'}{/if}{/if}"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'address1'}
-		<p class="required text">
-			<label for="address1">{l s='Address'} <sup>*</sup></label>
-			<input type="text" id="address1" name="address1" value="{if isset($smarty.post.address1)}{$smarty.post.address1}{else}{if isset($address->address1)}{$address->address1|escape:'html'}{/if}{/if}"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'address2'}
-		<p class="required text">
-			<label for="address2">{l s='Address (Line 2)'}</label>
-			<input type="text" id="address2" name="address2" value="{if isset($smarty.post.address2)}{$smarty.post.address2}{else}{if isset($address->address2)}{$address->address2|escape:'html'}{/if}{/if}"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'postcode'}
-		{assign var="postCodeExist" value=true}
-		<p class="required postcode text">
-			<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-			<input type="text" id="postcode" name="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{else}{if isset($address->postcode)}{$address->postcode|escape:'html'}{/if}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase()); if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}
-		{if $field_name eq 'city'}
-		<p class="required text">
-			<label for="city">{l s='City'} <sup>*</sup></label>
-			<input type="text" name="city" id="city" value="{if isset($smarty.post.city)}{$smarty.post.city}{else}{if isset($address->city)}{$address->city|escape:'html'}{/if}{/if}" maxlength="64"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{*
-			if customer hasn't update his layout address, country has to be verified
-			but it's deprecated
-		*}
-		{/if}
-		{if $field_name eq 'Country:name' || $field_name eq 'country'}
-		<p class="required select">
-			<label for="id_country">{l s='Country'} <sup>*</sup></label>
-			<select id="id_country" name="id_country">{$countries_list}</select>
-		</p>
-		{if $vatnumber_ajax_call}
-		<script type="text/javascript">
-		var ajaxurl = '{$ajaxurl}';
-		{literal}
-				$(document).ready(function(){
-					$('#id_country').change(function() {
-						$.ajax({
-							type: "GET",
-							url: ajaxurl+"vatnumber/ajax.php?id_country="+$('#id_country').val(),
-							success: function(isApplicable){
-								if(isApplicable == "1")
-								{
-									$('#vat_area').show();
-									$('#vat_number').show();
-								}
-								else
-								{
-									$('#vat_area').hide();
-								}
-							}
-						});
-					});
-				});
-		{/literal}
-		</script>
-		{/if}
-		{/if}
-		{if $field_name eq 'State:name'}
-		{assign var="stateExist" value=true}
-		<p class="required id_state select">
-			<label for="id_state">{l s='State'} <sup>*</sup></label>
-			<select name="id_state" id="id_state">
-				<option value="">-</option>
-			</select>
-		</p>
-		{/if}
-		{/foreach}
-		{if !$postCodeExist}
-		<p class="required postcode text hidden">
-			<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-			<input type="text" id="postcode" name="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{else}{if isset($address->postcode)}{$address->postcode|escape:'html'}{/if}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase());"
-				onkeyup="if (validate_{$address_validation.$field_name.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		{/if}		
-		{if !$stateExist}
-		<p class="required id_state select">
-			<label for="id_state">{l s='State'} <sup>*</sup></label>
-			<select name="id_state" id="id_state">
-				<option value="">-</option>
-			</select>
-		</p>
-		{/if}
-		<p class="textarea">
-			<label for="other">{l s='Additional information'}</label>
-			<textarea id="other" name="other" cols="26" rows="3" 
-				onkeyup="if (validate_{$address_validation.other.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');">{if isset($smarty.post.other)}{$smarty.post.other}{else}{if isset($address->other)}{$address->other|escape:'html'}{/if}{/if}</textarea>
-		</p>
-		{if isset($one_phone_at_least) && $one_phone_at_least}
-			<p class="inline-infos required">{l s='You must register at least one phone number.'}</p>
-		{/if}
-		<p class="text">
-			<label for="phone">{l s='Home phone'}</label>
-			<input type="text" id="phone" name="phone" value="{if isset($smarty.post.phone)}{$smarty.post.phone}{else}{if isset($address->phone)}{$address->phone|escape:'html'}{/if}{/if}" 
-				onkeyup="if (validate_{$address_validation.phone.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		<p class="{if isset($one_phone_at_least) && $one_phone_at_least}required {/if}text">
-			<label for="phone_mobile">{l s='Mobile phone'}{if isset($one_phone_at_least) && $one_phone_at_least} <sup>*</sup>{/if}</label>
-			<input type="text" id="phone_mobile" name="phone_mobile" value="{if isset($smarty.post.phone_mobile)}{$smarty.post.phone_mobile}{else}{if isset($address->phone_mobile)}{$address->phone_mobile|escape:'html'}{/if}{/if}" onkeyup="if (validate_{$address_validation.phone_mobile.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-		<p class="required text" id="adress_alias">
-			<label for="alias">{l s='Please assign an address title for future reference.'} <sup>*</sup></label>
-			<input type="text" id="alias" name="alias" value="{if isset($smarty.post.alias)}{$smarty.post.alias}{else if isset($address->alias)}{$address->alias|escape:'html'}{elseif !$select_address}{l s='My address'}{/if}" 
-				onkeyup="if (validate_{$address_validation.alias.validate}($(this).val())) $(this).css('background-color', '#DFF0D8'); else $(this).css('background-color', '#F2DEDE');" />
-		</p>
-	</fieldset>
-	<p class="submit2">
-		{if isset($id_address)}<input type="hidden" name="id_address" value="{$id_address|intval}" />{/if}
-		{if isset($back)}<input type="hidden" name="back" value="{$back}" />{/if}
-		{if isset($mod)}<input type="hidden" name="mod" value="{$mod}" />{/if}
-		{if isset($select_address)}<input type="hidden" name="select_address" value="{$select_address|intval}" />{/if}
-		<input type="hidden" name="token" value="{$token}" />		
-		<input type="submit" name="submitAddress" id="submitAddress" value="{l s='Save'}" class="button" />
-	</p>
-</form>

themes/default/addresses.tpl

@@ -1,130 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-{*
-** Retro compatibility for PrestaShop version < 1.4.2.5 with a recent theme
-*}
-
-{* Two variable are necessaries to display the address with the new layout system *}
-{* Will be deleted for 1.5 version and more *}
-{if !isset($multipleAddresses)}
-	{$ignoreList.0 = "id_address"}
-	{$ignoreList.1 = "id_country"}
-	{$ignoreList.2 = "id_state"}
-	{$ignoreList.3 = "id_customer"}
-	{$ignoreList.4 = "id_manufacturer"}
-	{$ignoreList.5 = "id_supplier"}
-	{$ignoreList.6 = "date_add"}
-	{$ignoreList.7 = "date_upd"}
-	{$ignoreList.8 = "active"}
-	{$ignoreList.9 = "deleted"}
-
-	{* PrestaShop < 1.4.2 compatibility *}
-	{if isset($addresses)}
-		{$address_number = 0}
-		{foreach from=$addresses key=k item=address}
-			{counter start=0 skip=1 assign=address_key_number}
-			{foreach from=$address key=address_key item=address_content}
-				{if !in_array($address_key, $ignoreList)}
-					{$multipleAddresses.$address_number.ordered.$address_key_number = $address_key}
-					{$multipleAddresses.$address_number.formated.$address_key = $address_content}
-					{counter}
-				{/if}
-			{/foreach}
-		{$multipleAddresses.$address_number.object = $address}
-		{$address_number = $address_number  + 1}
-		{/foreach}
-	{/if}
-{/if}
-
-{* Define the style if it doesn't exist in the PrestaShop version*}
-{* Will be deleted for 1.5 version and more *}
-{if !isset($addresses_style)}
-	{$addresses_style.company = 'address_company'}
-	{$addresses_style.vat_number = 'address_company'}
-	{$addresses_style.firstname = 'address_name'}
-	{$addresses_style.lastname = 'address_name'}
-	{$addresses_style.address1 = 'address_address1'}
-	{$addresses_style.address2 = 'address_address2'}
-	{$addresses_style.city = 'address_city'}
-	{$addresses_style.country = 'address_country'}
-	{$addresses_style.phone = 'address_phone'}
-	{$addresses_style.phone_mobile = 'address_phone_mobile'}
-	{$addresses_style.alias = 'address_title'}
-{/if}
-
-<script type="text/javascript">
-//<![CDATA[
-	{literal}
-	$(document).ready(function()
-	{
-			resizeAddressesBox();
-	});
-	{/literal}
-//]]>
-</script>
-
-{capture name=path}<a href="{$link->getPageLink('my-account', true)|escape:'html'}">{l s='My account'}</a><span class="navigation-pipe">{$navigationPipe}</span>{l s='My addresses'}{/capture}
-{include file="$tpl_dir./breadcrumb.tpl"}
-
-<h1>{l s='My addresses'}</h1>
-<p>{l s='Please configure your default billing and delivery addresses when placing an order. You may also add additional addresses, which can be useful for sending gifts or receiving an order at your office.'}</p>
-
-{if isset($multipleAddresses) && $multipleAddresses}
-<div class="addresses">
-	<h3>{l s='Your addresses are listed below.'}</h3>
-	<p>{l s='Be sure to update your personal information if it has changed.'}</p>
-	{assign var="adrs_style" value=$addresses_style}
-	<div class="bloc_adresses clearfix">
-	{foreach from=$multipleAddresses item=address name=myLoop}
-		<ul class="address {if $smarty.foreach.myLoop.last}last_item{elseif $smarty.foreach.myLoop.first}first_item{/if} {if $smarty.foreach.myLoop.index % 2}alternate_item{else}item{/if}">
-			<li class="address_title">{$address.object.alias}</li>
-			{foreach from=$address.ordered name=adr_loop item=pattern}
-				{assign var=addressKey value=" "|explode:$pattern}
-				<li>
-				{foreach from=$addressKey item=key name="word_loop"}
-					<span{if isset($addresses_style[$key])} class="{$addresses_style[$key]}"{/if}>
-						{$address.formated[$key|replace:',':'']|escape:'htmlall':'UTF-8'}
-					</span>
-				{/foreach}
-				</li>
-			{/foreach}
-			<li class="address_update"><a href="{$link->getPageLink('address', true, null, "id_address={$address.object.id|intval}")|escape:'html'}" title="{l s='Update'}">&raquo; {l s='Update'}</a></li>
-			<li class="address_delete"><a href="{$link->getPageLink('address', true, null, "id_address={$address.object.id|intval}&delete")|escape:'html'}" onclick="return confirm('{l s='Are you sure?' js=1}');" title="{l s='Delete'}">&raquo; {l s='Delete'}</a></li>
-		</ul>
-	{/foreach}
-	</div>
-	<p class="clear" />
-</div>
-{else}
-	<p class="warning">{l s='No addresses are available.'}&nbsp;<a href="{$link->getPageLink('address', true)|escape:'html'}">{l s='Add a new address'}</a></p>
-{/if}
-
-<div class="clear address_add"><a href="{$link->getPageLink('address', true)|escape:'html'}" title="{l s='Add an address'}" class="button_large">{l s='Add an address'}</a></div>
-
-<ul class="footer_links">
-	<li><a href="{$link->getPageLink('my-account', true)|escape:'html'}"><img src="{$img_dir}icon/my-account.gif" alt="" class="icon" /> {l s='Back to your account'}</a></li>
-	<li class="f_right"><a href="{$base_dir}"><img src="{$img_dir}icon/home.gif" alt="" class="icon" /> {l s='Home'}</a></li>
-</ul>

themes/default/authentication.tpl

@@ -1,721 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-{capture name=path}
-	{if !isset($email_create)}{l s='Authentication'}{else}
-		<a href="{$link->getPageLink('authentication', true)|escape:'html'}" rel="nofollow" title="{l s='Authentication'}">{l s='Authentication'}</a>
-		<span class="navigation-pipe">{$navigationPipe}</span>{l s='Create your account'}
-	{/if}
-{/capture}
-	{include file="$tpl_dir./breadcrumb.tpl"}
-
-<script type="text/javascript">
-// <![CDATA[
-var idSelectedCountry = {if isset($smarty.post.id_state)}{$smarty.post.id_state|intval}{else}false{/if};
-var countries = new Array();
-var countriesNeedIDNumber = new Array();
-var countriesNeedZipCode = new Array();
-{if isset($countries)}
-	{foreach from=$countries item='country'}
-		{if isset($country.states) && $country.contains_states}
-			countries[{$country.id_country|intval}] = new Array();
-			{foreach from=$country.states item='state' name='states'}
-				countries[{$country.id_country|intval}].push({ldelim}'id' : '{$state.id_state|intval}', 'name' : '{$state.name|addslashes}'{rdelim});
-			{/foreach}
-		{/if}
-		{if $country.need_identification_number}
-			countriesNeedIDNumber.push({$country.id_country|intval});
-		{/if}
-		{if isset($country.need_zip_code)}
-			countriesNeedZipCode[{$country.id_country|intval}] = {$country.need_zip_code};
-		{/if}
-	{/foreach}
-{/if}
-//]]>
-{literal}
-$(document).ready(function() {
-	$('#company').on('input',function(){
-		vat_number();
-	});
-	$('#company_invoice').on('input',function(){
-		vat_number_invoice();
-	});
-	function vat_number()
-	{
-		if (($('#company').length) && ($('#company').val() != '')) 
-			$('#vat_number').show();
-		else
-			$('#vat_number').hide();
-	}
-	function vat_number_invoice()
-	{
-		if (($('#company_invoice').length) && ($('#company_invoice').val() != '')) 
-			$('#vat_number_block_invoice').show();
-		else
-			$('#vat_number_block_invoice').hide();
-	}
-	vat_number();
-	vat_number_invoice();
-{/literal}
-	$('.id_state option[value={if isset($smarty.post.id_state)}{$smarty.post.id_state|intval}{/if}]').prop('selected', true);
-{literal}
-});
-{/literal}
-</script>
-
-<h1>{if !isset($email_create)}{l s='Authentication'}{else}{l s='Create an account'}{/if}</h1>
-{if !isset($back) || $back != 'my-account'}{assign var='current_step' value='login'}{include file="$tpl_dir./order-steps.tpl"}{/if}
-{include file="$tpl_dir./errors.tpl"}
-{assign var='stateExist' value=false}
-{assign var="postCodeExist" value=false}
-{if !isset($email_create)}
-	<script type="text/javascript">
-	{literal}
-	$(document).ready(function(){
-		// Retrocompatibility with 1.4
-		if (typeof baseUri === "undefined" && typeof baseDir !== "undefined")
-		baseUri = baseDir;
-		$('#create-account_form').submit(function(){
-			submitFunction();
-			return false;
-		});
-		$('#invoice_address').click(function() {
-			bindCheckbox();
-		});
-		bindCheckbox();
-	});
-	function submitFunction()
-	{
-		$('#create_account_error').html('').hide();
-		//send the ajax request to the server
-		$.ajax({
-			type: 'POST',
-			url: baseUri,
-			async: true,
-			cache: false,
-			dataType : "json",
-			data: {
-				controller: 'authentication',
-				SubmitCreate: 1,
-				ajax: true,
-				email_create: $('#email_create').val(),
-				back: $('input[name=back]').val(),
-				token: token
-			},
-			success: function(jsonData)
-			{
-				if (jsonData.hasError)
-				{
-					var errors = '';
-					for(error in jsonData.errors)
-						//IE6 bug fix
-						if(error != 'indexOf')
-							errors += '<li>'+jsonData.errors[error]+'</li>';
-					$('#create_account_error').html('<ol>'+errors+'</ol>').show();
-				}
-				else
-				{
-					// adding a div to display a transition
-					$('#center_column').html('<div id="noSlide">'+$('#center_column').html()+'</div>');
-					$('#noSlide').fadeOut('slow', function(){
-						$('#noSlide').html(jsonData.page);
-						// update the state (when this file is called from AJAX you still need to update the state)
-						bindStateInputAndUpdate();
-						$(this).fadeIn('slow', function(){
-							document.location = '#account-creation';
-						});
-					});
-				}
-			},
-			error: function(XMLHttpRequest, textStatus, errorThrown)
-			{
-				alert("TECHNICAL ERROR: unable to load form.\n\nDetails:\nError thrown: " + XMLHttpRequest + "\n" + 'Text status: ' + textStatus);
-			}
-		});
-	}
-	function bindCheckbox()
-	{
-		if ($('#invoice_address:checked').length > 0)
-		{
-			$('#opc_invoice_address').slideDown('slow');
-			if ($('#company_invoice').val() == '')
-				$('#vat_number_block_invoice').hide();
-			updateState('invoice');
-			updateNeedIDNumber('invoice');
-			updateZipCode('invoice');
-{/literal}
-			$('.id_state option[value={if isset($smarty.post.id_state)}{$smarty.post.id_state|intval}{/if}]').prop('selected', true);
-			$('.id_state_invoice option[value={if isset($smarty.post.id_state_invoice)}{$smarty.post.id_state_invoice|intval}{/if}]').prop('selected', true);
-{literal}
-		}
-		else
-			$('#opc_invoice_address').slideUp('slow');
-	}
-	{/literal}
-	</script>
-	<!--{if isset($authentification_error)}
-	<div class="error">
-		{if {$authentification_error|@count} == 1}
-			<p>{l s='There\'s at least one error'} :</p>
-			{else}
-			<p>{l s='There are %s errors' sprintf=[$account_error|@count]} :</p>
-		{/if}
-		<ol>
-			{foreach from=$authentification_error item=v}
-				<li>{$v}</li>
-			{/foreach}
-		</ol>
-	</div>
-	{/if}-->
-	<form action="{$link->getPageLink('authentication', true)|escape:'html'}" method="post" id="create-account_form" class="std">
-		<fieldset>
-			<h3>{l s='Create an account'}</h3>
-			<div class="form_content clearfix">
-				<p class="title_block">{l s='Please enter your email address to create an account.'}</p>
-				<div class="error" id="create_account_error" style="display:none"></div>
-				<p class="text">
-					<label for="email_create">{l s='Email address'}</label>
-					<span><input type="text" id="email_create" name="email_create" value="{if isset($smarty.post.email_create)}{$smarty.post.email_create|stripslashes}{/if}" class="account_input" /></span>
-				</p>
-				<p class="submit">
-					{if isset($back)}<input type="hidden" class="hidden" name="back" value="{$back}" />{/if}
-					<input type="submit" id="SubmitCreate" name="SubmitCreate" class="button_large" value="{l s='Create an account'}" />
-					<input type="hidden" class="hidden" name="SubmitCreate" value="{l s='Create an account'}" />
-				</p>
-			</div>
-		</fieldset>
-	</form>
-
-	<form action="{$link->getPageLink('authentication', true)|escape:'html'}" method="post" id="login_form" class="std">
-		<fieldset>
-			<h3>{l s='Already registered?'}</h3>
-			<div class="form_content clearfix">
-				<p class="text">
-					<label for="email">{l s='Email address'}</label>
-					<span><input type="text" id="email" name="email" value="{if isset($smarty.post.email)}{$smarty.post.email|stripslashes}{/if}" class="account_input" /></span>
-				</p>
-				<p class="text">
-					<label for="passwd">{l s='Password'}</label>
-					<span><input type="password" id="passwd" name="passwd" value="{if isset($smarty.post.passwd)}{$smarty.post.passwd|stripslashes}{/if}" class="account_input" /></span>
-				</p>
-				<p class="lost_password"><a href="{$link->getPageLink('password')|escape:'html'}" title="{l s='Recover your forgotten password'}" rel="nofollow">{l s='Forgot your password?'}</a></p>
-				<p class="submit">
-					{if isset($back)}<input type="hidden" class="hidden" name="back" value="{$back|escape:'htmlall':'UTF-8'}" />{/if}
-					<input type="submit" id="SubmitLogin" name="SubmitLogin" class="button" value="{l s='Authentication'}" />
-				</p>
-			</div>
-		</fieldset>
-	</form>
-
-	{if isset($inOrderProcess) && $inOrderProcess && $PS_GUEST_CHECKOUT_ENABLED}
-	<form action="{$link->getPageLink('authentication', true, NULL, "back=$back")|escape:'html'}" method="post" id="new_account_form" class="std clearfix">
-		<fieldset>
-			<h3>{l s='Instant checkout'}</h3>
-			<div id="opc_account_form" style="display: block; ">
-				<!-- Account -->
-				<p class="required text">
-					<label for="guest_email">{l s='Email address'} <sup>*</sup></label>
-					<input type="text" class="text" id="guest_email" name="guest_email" value="{if isset($smarty.post.guest_email)}{$smarty.post.guest_email}{/if}" />
-				</p>
-				<p class="radio required">
-					<span>{l s='Title'}</span>
-					{foreach from=$genders key=k item=gender}
-						<input type="radio" name="id_gender" id="id_gender{$gender->id}" value="{$gender->id}"{if isset($smarty.post.id_gender) && $smarty.post.id_gender == $gender->id} checked="checked"{/if} />
-						<label for="id_gender{$gender->id}" class="top">{$gender->name}</label>
-					{/foreach}
-				</p>
-				<p class="required text">
-					<label for="firstname">{l s='First name'} <sup>*</sup></label>
-					<input type="text" class="text" id="firstname" name="firstname" onblur="$('#customer_firstname').val($(this).val());" value="{if isset($smarty.post.firstname)}{$smarty.post.firstname}{/if}" />
-					<input type="hidden" class="text" id="customer_firstname" name="customer_firstname" value="{if isset($smarty.post.firstname)}{$smarty.post.firstname}{/if}" />
-				</p>
-				<p class="required text">
-					<label for="lastname">{l s='Last name'} <sup>*</sup></label>
-					<input type="text" class="text" id="lastname" name="lastname" onblur="$('#customer_lastname').val($(this).val());" value="{if isset($smarty.post.lastname)}{$smarty.post.lastname}{/if}" />
-					<input type="hidden" class="text" id="customer_lastname" name="customer_lastname" value="{if isset($smarty.post.lastname)}{$smarty.post.lastname}{/if}" />
-				</p>
-				<p class="select">
-					<span>{l s='Date of Birth'}</span>
-					<select id="days" name="days">
-						<option value="">-</option>
-						{foreach from=$days item=day}
-							<option value="{$day}" {if ($sl_day == $day)} selected="selected"{/if}>{$day}&nbsp;&nbsp;</option>
-						{/foreach}
-					</select>
-				{*
-						  {l s='January'}
-						  {l s='February'}
-						  {l s='March'}
-						  {l s='April'}
-						  {l s='May'}
-						  {l s='June'}
-						  {l s='July'}
-						  {l s='August'}
-						  {l s='September'}
-						  {l s='October'}
-						  {l s='November'}
-						  {l s='December'}
-					  *}
-					<select id="months" name="months">
-						<option value="">-</option>
-						{foreach from=$months key=k item=month}
-							<option value="{$k}" {if ($sl_month == $k)} selected="selected"{/if}>{l s=$month}&nbsp;</option>
-						{/foreach}
-					</select>
-					<select id="years" name="years">
-						<option value="">-</option>
-						{foreach from=$years item=year}
-							<option value="{$year}" {if ($sl_year == $year)} selected="selected"{/if}>{$year}&nbsp;&nbsp;</option>
-						{/foreach}
-					</select>
-				</p>
-				{if isset($newsletter) && $newsletter}
-					<p class="checkbox">
-						<input type="checkbox" name="newsletter" id="newsletter" value="1" {if isset($smarty.post.newsletter) && $smarty.post.newsletter == '1'}checked="checked"{/if} autocomplete="off"/>
-						<label for="newsletter">{l s='Sign up for our newsletter!'}</label>
-					</p>
-					<p class="checkbox">
-						<input type="checkbox" name="optin" id="optin" value="1" {if isset($smarty.post.optin) && $smarty.post.optin == '1'}checked="checked"{/if} autocomplete="off"/>
-						<label for="optin">{l s='Receive special offers from our partners!'}</label>
-					</p>
-				{/if}
-				<h3>{l s='Delivery address'}</h3>
-				{foreach from=$dlv_all_fields item=field_name}
-					{if $field_name eq "company" && $b2b_enable}
-						<p class="text">
-							<label for="company">{l s='Company'}</label>
-							<input type="text" class="text" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company}{/if}" />
-						</p>
-					{elseif $field_name eq "vat_number"}
-						<div id="vat_number" style="display:none;">
-							<p class="text">
-								<label for="vat_number">{l s='VAT number'}</label>
-								<input type="text" class="text" name="vat_number" value="{if isset($smarty.post.vat_number)}{$smarty.post.vat_number}{/if}" />
-							</p>
-						</div>
-						<p class="required text dni">
-							<label for="dni">{l s='Identification number'}</label>
-							<input type="text" class="text" name="dni" id="dni" value="{if isset($smarty.post.dni)}{$smarty.post.dni}{/if}" />
-							<span class="form_info">{l s='DNI / NIF / NIE'}</span>
-						</p>
-					{elseif $field_name eq "address1"}
-						<p class="required text">
-							<label for="address1">{l s='Address'} <sup>*</sup></label>
-							<input type="text" class="text" name="address1" id="address1" value="{if isset($smarty.post.address1)}{$smarty.post.address1}{/if}" />
-						</p>
-					{elseif $field_name eq "postcode"}
-					{assign var='postCodeExist' value=true}
-						<p class="required postcode text">
-							<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-							<input type="text" class="text" name="postcode" id="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{/if}" onblur="$('#postcode').val($('#postcode').val().toUpperCase());" />
-						</p>
-					{elseif $field_name eq "city"}
-						<p class="required text">
-							<label for="city">{l s='City'} <sup>*</sup></label>
-							<input type="text" class="text" name="city" id="city" value="{if isset($smarty.post.city)}{$smarty.post.city}{/if}" />
-						</p>
-						<!--
-							   if customer hasn't update his layout address, country has to be verified
-							   but it's deprecated
-						   -->
-					{elseif $field_name eq "Country:name" || $field_name eq "country"}
-						<p class="required select">
-							<label for="id_country">{l s='Country'} <sup>*</sup></label>
-							<select name="id_country" id="id_country">
-								{foreach from=$countries item=v}
-									<option value="{$v.id_country}"{if (isset($smarty.post.id_country) AND  $smarty.post.id_country == $v.id_country) OR (!isset($smarty.post.id_country) && $sl_country == $v.id_country)} selected="selected"{/if}>{$v.name}</option>
-								{/foreach}
-							</select>
-						</p>
-					{elseif $field_name eq "State:name"}
-						{assign var='stateExist' value=true}
-						<p class="required id_state select">
-							<label for="id_state">{l s='State'} <sup>*</sup></label>
-							<select name="id_state" id="id_state">
-								<option value="">-</option>
-							</select>
-						</p>
-					{/if}
-				{/foreach}
-				{if $stateExist eq false}
-					<p class="required id_state select hidden">
-						<label for="id_state">{l s='State'} <sup>*</sup></label>
-						<select name="id_state" id="id_state">
-							<option value="">-</option>
-						</select>
-					</p>
-				{/if}
-				{if $postCodeExist eq false}
-					<p class="required postcode text hidden">
-						<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-						<input type="text" class="text" name="postcode" id="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{/if}" onblur="$('#postcode').val($('#postcode').val().toUpperCase());" />
-					</p>
-				{/if}
-				<p class="{if isset($one_phone_at_least) && $one_phone_at_least}required {/if}text">
-					<label for="phone_mobile">{l s='Mobile phone'}{if isset($one_phone_at_least) && $one_phone_at_least} <sup>*</sup>{/if}</label>
-					<input type="text" class="text" name="phone_mobile" id="phone_mobile" value="{if isset($smarty.post.phone_mobile)}{$smarty.post.phone_mobile}{/if}" />
-				</p>
-				<input type="hidden" name="alias" id="alias" value="{l s='My address'}" />
-				<input type="hidden" name="is_new_customer" id="is_new_customer" value="0" />
-				<p class="checkbox">
-					<input type="checkbox" name="invoice_address" id="invoice_address"{if isset($smarty.post.invoice_address) && $smarty.post.invoice_address} checked="checked"{/if} autocomplete="off"/>
-					<label for="invoice_address"><b>{l s='Please use another address for invoice'}</b></label>
-				</p>
-				<div id="opc_invoice_address" class="hidden">
-					{assign var=stateExist value=false}
-					{assign var=postCodeExist value=false}
-					<h3>{l s='Invoice address'}</h3>
-					{foreach from=$inv_all_fields item=field_name}
-					{if $field_name eq "company" &&  $b2b_enable}
-					<p class="text">
-						<label for="company_invoice">{l s='Company'}</label>
-						<input type="text" class="text" id="company_invoice" name="company_invoice" value="{if isset($smarty.post.company_invoice)}{$smarty.post.company_invoice}{/if}" />
-					</p>
-					{elseif $field_name eq "vat_number"}
-					<div id="vat_number_block_invoice" class="hidden">
-						<p class="text">
-							<label for="vat_number_invoice">{l s='VAT number'}</label>
-							<input type="text" class="text" id="vat_number_invoice" name="vat_number_invoice" value="{if isset($smarty.post.vat_number_invoice)}{$smarty.post.vat_number_invoice}{/if}" />
-						</p>
-					</div>
-					<p class="required text dni_invoice">
-						<label for="dni">{l s='Identification number'}</label>
-						<input type="text" class="text" name="dni_invoice" id="dni_invoice" value="{if isset($smarty.post.dni_invoice)}{$smarty.post.dni_invoice}{/if}" />
-						<span class="form_info">{l s='DNI / NIF / NIE'}</span>
-					</p>
-					{elseif $field_name eq "firstname"}
-					<p class="required text">
-						<label for="firstname_invoice">{l s='First name'} <sup>*</sup></label>
-						<input type="text" class="text" id="firstname_invoice" name="firstname_invoice" value="{if isset($smarty.post.firstname_invoice)}{$smarty.post.firstname_invoice}{/if}" />
-					</p>
-					{elseif $field_name eq "lastname"}
-					<p class="required text">
-						<label for="lastname_invoice">{l s='Last name'} <sup>*</sup></label>
-						<input type="text" class="text" id="lastname_invoice" name="lastname_invoice" value="{if isset($smarty.post.firstname_invoice)}{$smarty.post.firstname_invoice}{/if}" />
-					</p>
-					{elseif $field_name eq "address1"}
-					<p class="required text">
-						<label for="address1_invoice">{l s='Address'} <sup>*</sup></label>
-						<input type="text" class="text" name="address1_invoice" id="address1_invoice" value="{if isset($smarty.post.address1_invoice)}{$smarty.post.address1_invoice}{/if}" />
-					</p>
-					{elseif $field_name eq "postcode"}
-					{$postCodeExist = true}
-					<p class="required postcode_invoice text">
-						<label for="postcode_invoice">{l s='Zip / Postal Code'} <sup>*</sup></label>
-						<input type="text" class="text" name="postcode_invoice" id="postcode_invoice" value="{if isset($smarty.post.postcode_invoice)}{$smarty.post.postcode_invoice}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase());" />
-					</p>
-					{elseif $field_name eq "city"}
-					<p class="required text">
-						<label for="city_invoice">{l s='City'} <sup>*</sup></label>
-						<input type="text" class="text" name="city_invoice" id="city_invoice" value="{if isset($smarty.post.city_invoice)}{$smarty.post.city_invoice}{/if}" />
-					</p>
-					{elseif $field_name eq "country" || $field_name eq "Country:name"}
-					<p class="required select">
-						<label for="id_country_invoice">{l s='Country'} <sup>*</sup></label>
-						<select name="id_country_invoice" id="id_country_invoice">
-							<option value="">-</option>
-							{foreach from=$countries item=v}
-							<option value="{$v.id_country}"{if (isset($smarty.post.id_country_invoice) && $smarty.post.id_country_invoice == $v.id_country) OR (!isset($smarty.post.id_country_invoice) && $sl_country == $v.id_country)} selected="selected"{/if}>{$v.name|escape:'htmlall':'UTF-8'}</option>
-							{/foreach}
-						</select>
-					</p>
-					{elseif $field_name eq "state" || $field_name eq 'State:name'}
-					{$stateExist = true}
-					<p class="required id_state_invoice select" style="display:none;">
-						<label for="id_state_invoice">{l s='State'} <sup>*</sup></label>
-						<select name="id_state_invoice" id="id_state_invoice">
-							<option value="">-</option>
-						</select>
-					</p>
-					{/if}
-					{/foreach}
-					{if !$postCodeExist}
-					<p class="required postcode_invoice text hidden">
-						<label for="postcode_invoice">{l s='Zip / Postal Code'} <sup>*</sup></label>
-						<input type="text" class="text" name="postcode_invoice" id="postcode_invoice" value="{if isset($smarty.post.postcode_invoice)}{$smarty.post.postcode_invoice}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase());" />
-					</p>
-					{/if}					
-					{if !$stateExist}
-					<p class="required id_state_invoice select hidden">
-						<label for="id_state_invoice">{l s='State'} <sup>*</sup></label>
-						<select name="id_state_invoice" id="id_state_invoice">
-							<option value="">-</option>
-						</select>
-					</p>
-					{/if}
-					<p class="{if isset($one_phone_at_least) && $one_phone_at_least}required {/if}text">
-						<label for="phone_mobile_invoice">{l s='Mobile phone'}{if isset($one_phone_at_least) && $one_phone_at_least} <sup>*</sup>{/if}</label>
-						<input type="text" class="text" name="phone_mobile_invoice" id="phone_mobile_invoice" value="{if isset($smarty.post.phone_mobile_invoice)}{$smarty.post.phone_mobile_invoice}{/if}" />
-					</p>
-					<input type="hidden" name="alias_invoice" id="alias_invoice" value="{l s='My Invoice address'}" />
-				</div>
-			</div>
-		</fieldset>
-		{$HOOK_CREATE_ACCOUNT_FORM}
-		<p class="cart_navigation required submit">
-			<span><sup>*</sup>{l s='Required field'}</span>
-			<input type="hidden" name="display_guest_checkout" value="1" />
-			<input type="submit" class="exclusive" name="submitGuestAccount" id="submitGuestAccount" value="{l s='Continue'}" />
-		</p>
-	</form>
-	{/if}
-{else}
-	<!--{if isset($account_error)}
-	<div class="error">
-		{if {$account_error|@count} == 1}
-			<p>{l s='There\'s at least one error'} :</p>
-			{else}
-			<p>{l s='There are %s errors' sprintf=[$account_error|@count]} :</p>
-		{/if}
-		<ol>
-			{foreach from=$account_error item=v}
-				<li>{$v}</li>
-			{/foreach}
-		</ol>
-	</div>
-	{/if}-->
-<form action="{$link->getPageLink('authentication', true)|escape:'html'}" method="post" id="account-creation_form" class="std">
-	{$HOOK_CREATE_ACCOUNT_TOP}
-	<fieldset class="account_creation">
-		<h3>{l s='Your personal information'}</h3>
-		<p class="radio required">
-			<span>{l s='Title'}</span>
-			{foreach from=$genders key=k item=gender}
-				<input type="radio" name="id_gender" id="id_gender{$gender->id}" value="{$gender->id}" {if isset($smarty.post.id_gender) && $smarty.post.id_gender == $gender->id}checked="checked"{/if} />
-				<label for="id_gender{$gender->id}" class="top">{$gender->name}</label>
-			{/foreach}
-		</p>
-		<p class="required text">
-			<label for="customer_firstname">{l s='First name'} <sup>*</sup></label>
-			<input onkeyup="$('#firstname').val(this.value);" type="text" class="text" id="customer_firstname" name="customer_firstname" value="{if isset($smarty.post.customer_firstname)}{$smarty.post.customer_firstname}{/if}" />
-		</p>
-		<p class="required text">
-			<label for="customer_lastname">{l s='Last name'} <sup>*</sup></label>
-			<input onkeyup="$('#lastname').val(this.value);" type="text" class="text" id="customer_lastname" name="customer_lastname" value="{if isset($smarty.post.customer_lastname)}{$smarty.post.customer_lastname}{/if}" />
-		</p>
-		<p class="required text">
-			<label for="email">{l s='Email'} <sup>*</sup></label>
-			<input type="text" class="text" id="email" name="email" value="{if isset($smarty.post.email)}{$smarty.post.email}{/if}" />
-		</p>
-		<p class="required password">
-			<label for="passwd">{l s='Password'} <sup>*</sup></label>
-			<input type="password" class="text" name="passwd" id="passwd" />
-			<span class="form_info">{l s='(Five characters minimum)'}</span>
-		</p>
-		<p class="select">
-			<span>{l s='Date of Birth'}</span>
-			<select id="days" name="days">
-				<option value="">-</option>
-				{foreach from=$days item=day}
-					<option value="{$day}" {if ($sl_day == $day)} selected="selected"{/if}>{$day}&nbsp;&nbsp;</option>
-				{/foreach}
-			</select>
-			{*
-				{l s='January'}
-				{l s='February'}
-				{l s='March'}
-				{l s='April'}
-				{l s='May'}
-				{l s='June'}
-				{l s='July'}
-				{l s='August'}
-				{l s='September'}
-				{l s='October'}
-				{l s='November'}
-				{l s='December'}
-			*}
-			<select id="months" name="months">
-				<option value="">-</option>
-				{foreach from=$months key=k item=month}
-					<option value="{$k}" {if ($sl_month == $k)} selected="selected"{/if}>{l s=$month}&nbsp;</option>
-				{/foreach}
-			</select>
-			<select id="years" name="years">
-				<option value="">-</option>
-				{foreach from=$years item=year}
-					<option value="{$year}" {if ($sl_year == $year)} selected="selected"{/if}>{$year}&nbsp;&nbsp;</option>
-				{/foreach}
-			</select>
-		</p>
-		{if $newsletter}
-		<p class="checkbox" >
-			<input type="checkbox" name="newsletter" id="newsletter" value="1" {if isset($smarty.post.newsletter) AND $smarty.post.newsletter == 1} checked="checked"{/if} autocomplete="off"/>
-			<label for="newsletter">{l s='Sign up for our newsletter!'}</label>
-		</p>
-		<p class="checkbox" >
-			<input type="checkbox"name="optin" id="optin" value="1" {if isset($smarty.post.optin) AND $smarty.post.optin == 1} checked="checked"{/if} autocomplete="off"/>
-			<label for="optin">{l s='Receive special offers from our partners!'}</label>
-		</p>
-		{/if}
-	</fieldset>
-	{if $b2b_enable}
-	<fieldset class="account_creation">
-		<h3>{l s='Your company information'}</h3>
-		<p class="text">
-			<label for="">{l s='Company'}</label>
-			<input type="text" class="text" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company}{/if}" />
-		</p>
-		<p class="text">
-			<label for="siret">{l s='SIRET'}</label>
-			<input type="text" class="text" id="siret" name="siret" value="{if isset($smarty.post.siret)}{$smarty.post.siret}{/if}" />
-		</p>
-		<p class="text">
-			<label for="ape">{l s='APE'}</label>
-			<input type="text" class="text" id="ape" name="ape" value="{if isset($smarty.post.ape)}{$smarty.post.ape}{/if}" />
-		</p>
-		<p class="text">
-			<label for="website">{l s='Website'}</label>
-			<input type="text" class="text" id="website" name="website" value="{if isset($smarty.post.website)}{$smarty.post.website}{/if}" />
-		</p>
-	</fieldset>
-	{/if}
-	{if isset($PS_REGISTRATION_PROCESS_TYPE) && $PS_REGISTRATION_PROCESS_TYPE}
-	<fieldset class="account_creation">
-		<h3>{l s='Your address'}</h3>
-		{foreach from=$dlv_all_fields item=field_name}
-			{if $field_name eq "company"}
-				{if !$b2b_enable}
-					<p class="text">
-						<label for="company">{l s='Company'}</label>
-						<input type="text" class="text" id="company" name="company" value="{if isset($smarty.post.company)}{$smarty.post.company}{/if}" />
-					</p>
-				{/if}
-			{elseif $field_name eq "vat_number"}
-				<div id="vat_number" style="display:none;">
-					<p class="text">
-						<label for="vat_number">{l s='VAT number'}</label>
-						<input type="text" class="text" name="vat_number" value="{if isset($smarty.post.vat_number)}{$smarty.post.vat_number}{/if}" />
-					</p>
-				</div>
-			{elseif $field_name eq "firstname"}
-				<p class="required text">
-					<label for="firstname">{l s='First name'} <sup>*</sup></label>
-					<input type="text" class="text" id="firstname" name="firstname" value="{if isset($smarty.post.firstname)}{$smarty.post.firstname}{/if}" />
-				</p>
-			{elseif $field_name eq "lastname"}
-				<p class="required text">
-					<label for="lastname">{l s='Last name'} <sup>*</sup></label>
-					<input type="text" class="text" id="lastname" name="lastname" value="{if isset($smarty.post.lastname)}{$smarty.post.lastname}{/if}" />
-				</p>
-			{elseif $field_name eq "address1"}
-				<p class="required text">
-					<label for="address1">{l s='Address'} <sup>*</sup></label>
-					<input type="text" class="text" name="address1" id="address1" value="{if isset($smarty.post.address1)}{$smarty.post.address1}{/if}" />
-					<span class="inline-infos">{l s='Street address, P.O. Box, Company name, etc.'}</span>
-				</p>
-			{elseif $field_name eq "address2"}
-				<p class="text">
-					<label for="address2">{l s='Address (Line 2)'}</label>
-					<input type="text" class="text" name="address2" id="address2" value="{if isset($smarty.post.address2)}{$smarty.post.address2}{/if}" />
-					<span class="inline-infos">{l s='Apartment, suite, unit, building, floor, etc...'}</span>
-				</p>
-			{elseif $field_name eq "postcode"}
-			{assign var='postCodeExist' value=true}
-				<p class="required postcode text">
-					<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-					<input type="text" class="text" name="postcode" id="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase());" />
-				</p>
-			{elseif $field_name eq "city"}
-				<p class="required text">
-					<label for="city">{l s='City'} <sup>*</sup></label>
-					<input type="text" class="text" name="city" id="city" value="{if isset($smarty.post.city)}{$smarty.post.city}{/if}" />
-				</p>
-				<!--
-					if customer hasn't update his layout address, country has to be verified
-					but it's deprecated
-				-->
-			{elseif $field_name eq "Country:name" || $field_name eq "country"}
-				<p class="required select">
-					<label for="id_country">{l s='Country'} <sup>*</sup></label>
-					<select name="id_country" id="id_country">
-						<option value="">-</option>
-						{foreach from=$countries item=v}
-						<option value="{$v.id_country}"{if (isset($smarty.post.id_country) AND $smarty.post.id_country == $v.id_country) OR (!isset($smarty.post.id_country) && $sl_country == $v.id_country)} selected="selected"{/if}>{$v.name}</option>
-						{/foreach}
-					</select>
-				</p>
-			{elseif $field_name eq "State:name" || $field_name eq 'state'}
-				{assign var='stateExist' value=true}
-				<p class="required id_state select">
-					<label for="id_state">{l s='State'} <sup>*</sup></label>
-					<select name="id_state" id="id_state">
-						<option value="">-</option>
-					</select>
-				</p>
-			{/if}
-		{/foreach}
-		{if $postCodeExist eq false}
-			<p class="required postcode text hidden">
-				<label for="postcode">{l s='Zip / Postal Code'} <sup>*</sup></label>
-				<input type="text" class="text" name="postcode" id="postcode" value="{if isset($smarty.post.postcode)}{$smarty.post.postcode}{/if}" onkeyup="$('#postcode').val($('#postcode').val().toUpperCase());" />
-			</p>
-		{/if}
-		{if $stateExist eq false}
-			<p class="required id_state select hidden">
-				<label for="id_state">{l s='State'} <sup>*</sup></label>
-				<select name="id_state" id="id_state">
-					<option value="">-</option>
-				</select>
-			</p>
-		{/if}
-		<p class="textarea">
-			<label for="other">{l s='Additional information'}</label>
-			<textarea name="other" id="other" cols="26" rows="3">{if isset($smarty.post.other)}{$smarty.post.other}{/if}</textarea>
-		</p>
-		{if isset($one_phone_at_least) && $one_phone_at_least}
-			<p class="inline-infos required">{l s='You must register at least one phone number.'}</p>
-		{/if}								
-		<p class="text">
-			<label for="phone">{l s='Home phone'}</label>
-			<input type="text" class="text" name="phone" id="phone" value="{if isset($smarty.post.phone)}{$smarty.post.phone}{/if}" />
-		</p>
-		<p class="{if isset($one_phone_at_least) && $one_phone_at_least}required {/if}text">
-			<label for="phone_mobile">{l s='Mobile phone'}{if isset($one_phone_at_least) && $one_phone_at_least} <sup>*</sup>{/if}</label>
-			<input type="text" class="text" name="phone_mobile" id="phone_mobile" value="{if isset($smarty.post.phone_mobile)}{$smarty.post.phone_mobile}{/if}" />
-		</p>
-		<p class="required text" id="address_alias">
-			<label for="alias">{l s='Assign an address alias for future reference.'} <sup>*</sup></label>
-			<input type="text" class="text" name="alias" id="alias" value="{if isset($smarty.post.alias)}{$smarty.post.alias}{else}{l s='My address'}{/if}" />
-		</p>
-	</fieldset>
-	<fieldset class="account_creation dni">
-		<h3>{l s='Tax identification'}</h3>
-		<p class="required text">
-			<label for="dni">{l s='Identification number'} <sup>*</sup></label>
-			<input type="text" class="text" name="dni" id="dni" value="{if isset($smarty.post.dni)}{$smarty.post.dni}{/if}" />
-			<span class="form_info">{l s='DNI / NIF / NIE'}</span>
-		</p>
-	</fieldset>
-	{/if}
-	{$HOOK_CREATE_ACCOUNT_FORM}
-	<p class="cart_navigation required submit">
-		<input type="hidden" name="email_create" value="1" />
-		<input type="hidden" name="is_new_customer" value="1" />
-		{if isset($back)}<input type="hidden" class="hidden" name="back" value="{$back|escape:'htmlall':'UTF-8'}" />{/if}
-		<input type="submit" name="submitAccount" id="submitAccount" value="{l s='Register'}" class="exclusive" />
-		<span><sup>*</sup>{l s='Required field'}</span>
-	</p>
-</form>
-{/if}

themes/default/best-sales.tpl

@@ -1,54 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-{capture name=path}{l s='Top sellers'}{/capture}
-{include file="$tpl_dir./breadcrumb.tpl"}
-
-<h1>{l s='Top sellers'}</h1>
-
-{if $products}
-	<div class="content_sortPagiBar">
-		{include file="$tpl_dir./pagination.tpl"}
-
-		<div class="sortPagiBar clearfix">
-			{include file="./product-sort.tpl"}
-			{include file="./product-compare.tpl"}
-			{include file="./nbr-product-page.tpl"}
-		</div>
-	</div>
-
-	{include file="./product-list.tpl" products=$products}
-
-	<div class="content_sortPagiBar">
-		<div class="sortPagiBar clearfix">
-			{include file="./product-sort.tpl" paginationId='bottom'}
-			{include file="./product-compare.tpl" paginationId='bottom'}
-			{include file="./nbr-product-page.tpl" paginationId='bottom'}
-		</div>
-		{include file="./pagination.tpl" paginationId='bottom'}
-	</div>
-	{else}
-	<p class="warning">{l s='No top sellers for the moment.'}</p>
-{/if}

themes/default/breadcrumb.tpl

@@ -1,39 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-<!-- Breadcrumb -->
-{if isset($smarty.capture.path)}{assign var='path' value=$smarty.capture.path}{/if}
-<div class="breadcrumb">
-	<a href="{$base_dir}" title="{l s='Return to Home'}"><img src="{$img_dir}icon/home.gif" height="26" width="26" alt="{l s='Home'}" /></a>
-	{if isset($path) AND $path}
-		<span class="navigation-pipe" {if isset($category) && isset($category->id_category) && $category->id_category == 1}style="display:none;"{/if}>{$navigationPipe|escape:html:'UTF-8'}</span>
-		{if !$path|strpos:'span'}
-			<span class="navigation_page">{$path}</span>
-		{else}
-			{$path}
-		{/if}
-	{/if}
-</div>
-<!-- /Breadcrumb -->

themes/default/cache/index.php

@@ -1,35 +0,0 @@
-<?php
-/*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*/
-			    	
-header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
-header("Last-Modified: ".gmdate("D, d M Y H:i:s")." GMT");
-	
-header("Cache-Control: no-store, no-cache, must-revalidate");
-header("Cache-Control: post-check=0, pre-check=0", false);
-header("Pragma: no-cache");
-	
-header("Location: ../");
-exit;

themes/default/category-cms-tree-branch.tpl

@@ -1,52 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-<li {if isset($last) && $last == 'true'}class="last"{/if}>
-	<strong><a href="{$node.link|escape:'htmlall':'UTF-8'}" title="{$node.name|escape:'htmlall':'UTF-8'}">{$node.name|escape:'htmlall':'UTF-8'}</a></strong>
-	{if isset($node.children) && $node.children|@count > 0}
-		<ul>
-		{foreach from=$node.children item=child name=categoryCmsTreeBranch}
-			{if isset($child.children) && $child.children|@count > 0 || isset($child.cms) && $child.cms|@count > 0}
-				{if $smarty.foreach.categoryCmsTreeBranch.last && $node.cms|@count == 0}
-					{include file="$tpl_dir./category-cms-tree-branch.tpl" node=$child last='true'}
-				{else}
-					{include file="$tpl_dir./category-cms-tree-branch.tpl" node=$child}
-				{/if}
-			{/if}
-		{/foreach}
-		{if isset($node.cms) && $node.cms|@count > 0}
-			{foreach from=$node.cms item=cms name=cmsTreeBranch}
-				<li {if $smarty.foreach.cmsTreeBranch.last}class="last"{/if} ><a href="{$cms.link|escape:'htmlall':'UTF-8'}" title="{$cms.meta_title|escape:'htmlall':'UTF-8'}">{$cms.meta_title|escape:'htmlall':'UTF-8'}</a></li>
-			{/foreach}
-		{/if}
-		</ul>
-	{elseif isset($node.cms) && $node.cms|@count > 0}
-		<ul>
-		{foreach from=$node.cms item=cms name=cmsTreeBranch}
-			<li {if $smarty.foreach.cmsTreeBranch.last}class="last"{/if} ><a href="{$cms.link|escape:'htmlall':'UTF-8'}" title="{$cms.meta_title|escape:'htmlall':'UTF-8'}">{$cms.meta_title|escape:'htmlall':'UTF-8'}</a></li>
-		{/foreach}
-		</ul>
-	{/if}
-</li>

themes/default/category-count.tpl

@@ -1,34 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @version  Release: $Revision$
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-{if $category->id == 1 OR $nb_products == 0}
-	{l s='There are no products in  this category'}
-{else}
-	{if $nb_products == 1}
-		{l s='There is %d product.' sprintf=$nb_products}
-	{else}
-		{l s='There are %d products.' sprintf=$nb_products}
-	{/if}
-{/if}

themes/default/category-tree-branch.tpl

@@ -1,39 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-<li {if isset($last) && $last == 'true'}class="last"{/if}>
-	<a href="{$node.link|escape:'htmlall':'UTF-8'}" {if isset($currentCategoryId) && $node.id == $currentCategoryId}class="selected"{/if} title="{$node.desc|escape:'htmlall':'UTF-8'}">{$node.name|escape:'htmlall':'UTF-8'}</a>
-	{if $node.children|@count > 0}
-		<ul>
-		{foreach from=$node.children item=child name=categoryTreeBranch}
-			{if $smarty.foreach.categoryTreeBranch.last}
-				{include file="$tpl_dir./category-tree-branch.tpl" node=$child last='true'}
-			{else}
-				{include file="$tpl_dir./category-tree-branch.tpl" node=$child last='false'}
-			{/if}
-		{/foreach}
-		</ul>
-	{/if}
-</li>

themes/default/category.tpl

@@ -1,120 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-{include file="$tpl_dir./breadcrumb.tpl"}
-{include file="$tpl_dir./errors.tpl"}
-
-{if isset($category)}
-	{if $category->id AND $category->active}
-		<h1>
-			{strip}
-				{$category->name|escape:'htmlall':'UTF-8'}
-				{if isset($categoryNameComplement)}
-					{$categoryNameComplement|escape:'htmlall':'UTF-8'}
-				{/if}
-			{/strip}
-		</h1>
-		
-		<div class="resumecat category-product-count">
-			{include file="$tpl_dir./category-count.tpl"}
-		</div>
-		
-		{if $scenes || $category->description || $category->id_image}
-		<div class="content_scene_cat">
-			{if $scenes}
-				<!-- Scenes -->
-				{include file="$tpl_dir./scenes.tpl" scenes=$scenes}
-			{else}
-				<!-- Category image -->
-				{if $category->id_image}
-				<div class="align_center">
-					<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')|escape:'html'}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />
-				</div>
-				{/if}
-			{/if}
-
-			{if $category->description}
-				<div class="cat_desc">
-				{if strlen($category->description) > 120}
-					<div id="category_description_short">{$category->description|truncate:120}</div>
-					<div id="category_description_full" style="display:none;">{$category->description}</div>
-					<a href="#" onclick="$('#category_description_short').hide(); $('#category_description_full').show(); $(this).hide(); return false;" class="lnk_more">{l s='More'}</a>
-				{else}
-					<p>{$category->description}</p>
-				{/if}
-				</div>
-			{/if}
-		</div>
-		{/if}
-		{if isset($subcategories)}
-		<!-- Subcategories -->
-		<div id="subcategories">
-			<h3>{l s='Subcategories'}</h3>
-			<ul class="inline_list">
-			{foreach from=$subcategories item=subcategory}
-				<li class="clearfix">
-					<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}" class="img">
-						{if $subcategory.id_image}
-							<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium_default')|escape:'html'}" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />
-						{else}
-							<img src="{$img_cat_dir}default-medium_default.jpg" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />
-						{/if}
-					</a>
-					<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" class="cat_name">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>
-					{if $subcategory.description}
-						<p class="cat_desc">{$subcategory.description}</p>
-					{/if}
-				</li>
-			{/foreach}
-			</ul>
-			<br class="clear"/>
-		</div>
-		{/if}
-
-		{if $products}
-			<div class="content_sortPagiBar">
-				{include file="$tpl_dir./pagination.tpl"}
-				<div class="sortPagiBar clearfix">
-					{include file="./product-sort.tpl"}
-					{include file="./product-compare.tpl"}
-					{include file="./nbr-product-page.tpl"}
-				</div>
-			</div>
-			
-			{include file="./product-list.tpl" products=$products}
-			
-			<div class="content_sortPagiBar">
-				<div class="sortPagiBar clearfix">
-					{include file="./product-sort.tpl" paginationId='bottom'}
-					{include file="./product-compare.tpl" paginationId='bottom'}
-					{include file="./nbr-product-page.tpl" paginationId='bottom'}
-				</div>
-				{include file="./pagination.tpl" paginationId='bottom'}
-			</div>
-		{/if}
-	{elseif $category->id}
-		<p class="warning">{l s='This category is currently unavailable.'}</p>
-	{/if}
-{/if}

themes/default/cms.tpl

@@ -1,74 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-{if ($content_only == 0)}
-	{include file="$tpl_dir./breadcrumb.tpl"}
-{/if}
-{if isset($cms) && !isset($cms_category)}
-	{if !$cms->active}
-		<br />
-		<div id="admin-action-cms">
-			<p>{l s='This CMS page is not visible to your customers.'}
-			<input type="hidden" id="admin-action-cms-id" value="{$cms->id}" />
-			<input type="submit" value="{l s='Publish'}" class="exclusive" onclick="submitPublishCMS('{$base_dir}{$smarty.get.ad|escape:'htmlall':'UTF-8'}', 0, '{$smarty.get.adtoken|escape:'htmlall':'UTF-8'}')"/>
-			<input type="submit" value="{l s='Back'}" class="exclusive" onclick="submitPublishCMS('{$base_dir}{$smarty.get.ad|escape:'htmlall':'UTF-8'}', 1, '{$smarty.get.adtoken|escape:'htmlall':'UTF-8'}')"/>
-			</p>
-			<div class="clear" ></div>
-			<p id="admin-action-result"></p>
-			</p>
-		</div>
-	{/if}
-	<div class="rte{if $content_only} content_only{/if}">
-		{$cms->content}
-	</div>
-{elseif isset($cms_category)}
-	<div class="block-cms">
-		<h1><a href="{if $cms_category->id eq 1}{$base_dir}{else}{$link->getCMSCategoryLink($cms_category->id, $cms_category->link_rewrite)}{/if}">{$cms_category->name|escape:'htmlall':'UTF-8'}</a></h1>
-		{if isset($sub_category) && !empty($sub_category)}	
-			<p class="title_block">{l s='List of sub categories in %s:' sprintf=$cms_category->name}</p>
-			<ul class="bullet">
-				{foreach from=$sub_category item=subcategory}
-					<li>
-						<a href="{$link->getCMSCategoryLink($subcategory.id_cms_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>
-					</li>
-				{/foreach}
-			</ul>
-		{/if}
-		{if isset($cms_pages) && !empty($cms_pages)}
-		<p class="title_block">{l s='List of pages in %s:' sprintf=$cms_category->name}</p>
-			<ul class="bullet">
-				{foreach from=$cms_pages item=cmspages}
-					<li>
-						<a href="{$link->getCMSLink($cmspages.id_cms, $cmspages.link_rewrite)|escape:'htmlall':'UTF-8'}">{$cmspages.meta_title|escape:'htmlall':'UTF-8'}</a>
-					</li>
-				{/foreach}
-			</ul>
-		{/if}
-	</div>
-{else}
-	<div class="error">
-		{l s='This page does not exist.'}
-	</div>
-{/if}
-<br />

themes/default/config.xml

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-<theme>
-	<version value="1.4">
-		<ccc available="true" />
-		<guest_checkout available="true" />
-		<one_page_checkout available="true" />
-		<store_locator available="true" />
-	</version>
-</theme>

themes/default/contact-form.tpl

@@ -1,132 +0,0 @@
-{*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*}
-
-{capture name=path}{l s='Contact'}{/capture}
-{include file="$tpl_dir./breadcrumb.tpl"}
-
-<h1>{l s='Customer service'} - {if isset($customerThread) && $customerThread}{l s='Your reply'}{else}{l s='Contact us'}{/if}</h1>
-
-{if isset($confirmation)}
-	<p>{l s='Your message has been successfully sent to our team.'}</p>
-	<ul class="footer_links">
-		<li><a href="{$base_dir}"><img class="icon" alt="" src="{$img_dir}icon/home.gif"/></a><a href="{$base_dir}">{l s='Home'}</a></li>
-	</ul>
-{elseif isset($alreadySent)}
-	<p>{l s='Your message has already been sent.'}</p>
-	<ul class="footer_links">
-		<li><a href="{$base_dir}"><img class="icon" alt="" src="{$img_dir}icon/home.gif"/></a><a href="{$base_dir}">{l s='Home'}</a></li>
-	</ul>
-{else}
-	<p class="bold">{l s='For questions about an order or for more information about our products'}.</p>
-	{include file="$tpl_dir./errors.tpl"}
-	<form action="{$request_uri|escape:'htmlall':'UTF-8'}" method="post" class="std" enctype="multipart/form-data">
-		<fieldset>
-			<h3>{l s='send a message'}</h3>
-			<p class="select">
-				<label for="id_contact">{l s='Subject Heading'}</label>
-			{if isset($customerThread.id_contact)}
-				{foreach from=$contacts item=contact}
-					{if $contact.id_contact == $customerThread.id_contact}
-						<input type="text" id="contact_name" name="contact_name" value="{$contact.name|escape:'htmlall':'UTF-8'}" readonly="readonly" />
-						<input type="hidden" name="id_contact" value="{$contact.id_contact}" />
-					{/if}
-				{/foreach}
-			</p>
-			{else}
-				<select id="id_contact" name="id_contact" onchange="showElemFromSelect('id_contact', 'desc_contact')">
-					<option value="0">{l s='-- Choose --'}</option>
-				{foreach from=$contacts item=contact}
-					<option value="{$contact.id_contact|intval}" {if isset($smarty.request.id_contact) && $smarty.request.id_contact == $contact.id_contact}selected="selected"{/if}>{$contact.name|escape:'htmlall':'UTF-8'}</option>
-				{/foreach}
-				</select>
-			</p>
-			<p id="desc_contact0" class="desc_contact">&nbsp;</p>
-				{foreach from=$contacts item=contact}
-					<p id="desc_contact{$contact.id_contact|intval}" class="desc_contact" style="display:none;">
-						{$contact.description|escape:'htmlall':'UTF-8'}
-					</p>
-				{/foreach}
-			{/if}
-			<p class="text">
-				<label for="email">{l s='Email address'}</label>
-				{if isset($customerThread.email)}
-					<input type="text" id="email" name="from" value="{$customerThread.email|escape:'htmlall':'UTF-8'}" readonly="readonly" />
-				{else}
-					<input type="text" id="email" name="from" value="{$email|escape:'htmlall':'UTF-8'}" />
-				{/if}
-			</p>
-		{if !$PS_CATALOG_MODE}
-			{if (!isset($customerThread.id_order) || $customerThread.id_order > 0)}
-			<p class="text select">
-				<label for="id_order">{l s='Order reference'}</label>
-				{if !isset($customerThread.id_order) && isset($isLogged) && $isLogged == 1}
-					<select name="id_order" >
-						<option value="0">{l s='-- Choose --'}</option>
-						{foreach from=$orderList item=order}
-							<option value="{$order.value|intval}" {if $order.selected|intval}selected="selected"{/if}>{$order.label|escape:'htmlall':'UTF-8'}</option>
-						{/foreach}
-					</select>
-				{elseif !isset($customerThread.id_order) && !isset($isLogged)}
-					<input type="text" name="id_order" id="id_order" value="{if isset($customerThread.id_order) && $customerThread.id_order|intval > 0}{$customerThread.id_order|intval}{else}{if isset($smarty.post.id_order) && !empty($smarty.post.id_order)}{$smarty.post.id_order|intval}{/if}{/if}" />
-				{elseif $customerThread.id_order|intval > 0}
-					<input type="text" name="id_order" id="id_order" value="{$customerThread.id_order|intval}" readonly="readonly" />
-				{/if}
-			</p>
-			{/if}
-			{if isset($isLogged) && $isLogged}
-			<p class="text select">
-			<label for="id_product">{l s='Product'}</label>
-				{if !isset($customerThread.id_product)}
-				{foreach from=$orderedProductList key=id_order item=products name=products}
-					<select name="id_product" id="{$id_order}_order_products" class="product_select" style="width:300px;{if !$smarty.foreach.products.first} display:none; {/if}" {if !$smarty.foreach.products.first}disabled="disabled" {/if}>
-						<option value="0">{l s='-- Choose --'}</option>
-						{foreach from=$products item=product}
-							<option value="{$product.value|intval}">{$product.label|escape:'htmlall':'UTF-8'}</option>
-						{/foreach}
-					</select>
-				{/foreach}
-				{elseif $customerThread.id_product > 0}
-					<input type="text" name="id_product" id="id_product" value="{$customerThread.id_product|intval}" readonly="readonly" />
-				{/if}
-			</p>
-			{/if}
-		{/if}
-		{if $fileupload == 1}
-			<p class="text">
-			<label for="fileUpload">{l s='Attach File'}</label>
-				<input type="hidden" name="MAX_FILE_SIZE" value="2000000" />
-				<input type="file" name="fileUpload" id="fileUpload" />
-			</p>
-		{/if}
-		<p class="textarea">
-			<label for="message">{l s='Message'}</label>
-			 <textarea id="message" name="message" rows="15" cols="10">{if isset($message)}{$message|escape:'htmlall':'UTF-8'|stripslashes}{/if}</textarea>
-		</p>
-		<p class="submit">
-			<input type="submit" name="submitMessage" id="submitMessage" value="{l s='Send'}" class="button_large" />
-		</p>
-	</fieldset>
-</form>
-{/if}

themes/default/css/addresses.css

@@ -1,102 +0,0 @@
-div.addresses {
-   position:relative;
-   padding:15px;
-   border:1px solid #ccc;
-	font-size:12px;
-   background:#f8f8f8
-}
-
-ul.address {
-   list-style-type:none;
-   float:left;
-   position:relative;
-   width:345px !important
-}
-#address_delivery {margin-right:35px;}
-#address_invoice {margin-right:0}
-#delivery_address {margin-right:65px;}
-
-ul.address li {
-	padding:0 15px;
-	font-weight:bold;
-	line-height:18px;
-	text-transform:uppercase
-}
-
-ul.address li.address_title {
-   height: 29px;
-   font-weight: bold;
-   line-height:29px;
-   color:#fff;
-    text-shadow:0 1px 0 #666;
-   background:url(../img/bg_table_th.png) repeat-x 0 -10px #999
-}
-ul.address .address_alias {
-	font-weight: normal;
-	text-transform: none;
-}
-ul.address >li:first-child + li {
-	margin-top:8px
-}
-
-ul.address  li.address_update {
-	margin-top:20px
-}
-ul.address  li.address_update,
-ul.address li.address_delete {
-	font-size:11px;
-   text-transform:none
-}
-.address_add {
-   padding:20px 0
-}
-.address_select {
-	border:1px solid #ccc;
-	width: 200px;
-	margin-left: 10px;
-}
-label[for=id_address_delivery], label[for=id_address_invoice] {
-	float: left;
-	width: 225px;
-}
-.addressesAreEquals label {
-	margin-left: 5px;
-}
-.addressesAreEquals input {
-	float: left;
-}
-p.address_delivery, p.addressesAreEquals {
-	padding-bottom: 14px
-}
-/* PAGE ADRESSES ******************************************************************************* */
-.addresses ul.address {
-   list-style-type:none;
-   float:left;
-   position:relative;
-	margin:30px 30px 0 0;
-   width:345px !important
-}
-.addresses ul.address.alternate_item,
-.addresses ul.address.last_item {margin-right:0}
-.addresses ul.address li {
-	padding:0 15px;
-	font-weight:bold;
-	line-height:18px;
-	text-transform:uppercase
-}
-.addresses ul.address .address_title {
-	margin-bottom:5px;
-	height: 29px;
-   font-weight: bold;
-   line-height:29px;
-   color:#fff;
-    text-shadow:0 1px 0 #666;
-   background:url(../img/bg_table_th.png) repeat-x 0 -10px #999
-}
-.addresses ul.address .address_update {margin-top:20px}
-.addresses ul.address .address_update,
-.addresses ul.address .address_delete {
-	font-size:11px;
-   text-transform:none
-}
-

themes/default/css/authentication.css

@@ -1,81 +0,0 @@
-#account-creation_form fieldset, fieldset.account_creation {
-	padding:0 0 15px 0;
-	border:1px solid #ccc;
-	background:#f8f8f8;
-}
-#account-creation_form h3 {
-	margin:0 0 15px 0;
-	padding:8px;
-	font-size:14px;
-	color:#fff;
-	text-transform:uppercase;
-	background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898;
-}
-#center_column #account-creation_form p {margin:0; padding:0 0 10px 0}
-#account-creation_form p.required {color:#222}
-#account-creation_form p.required  sup {color:#990000}
-#account-creation_form p.radio span,
-#account-creation_form p.text label,
-#account-creation_form p.password label,
-#account-creation_form p.select label,
-#account-creation_form p.select span,
-#account-creation_form p.textarea label {
-	display:inline-block;
-	padding:6px 15px;
-	width:230px;/* 260 */
-	font-size:14px;
-	text-align:right;
-}
-#account-creation_form p.radio label {
-	float:none;
-	padding-right:10px;
-	width:auto;
-	font-size:14px;
-}
-#account-creation_form p.radio input {
-	position: relative;
-	bottom: -3px;
-}
-#account-creation_form p.checkbox label {
-	float:none;
-	width:auto;
-	font-size:12px;
-}
-#account-creation_form p.text input,
-#account-creation_form p.password input,
-#account-creation_form p.select input {
-	padding:0 5px;
-	height:22px;
-	width:360px;/* 370 */
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666;
-}
-#account-creation_form span.inline-infos{display:inline-block;}
-#account-creation_form p.checkbox input {
-	margin-left:260px;
-}
-#account-creation_form p.select select {
-	margin-right:10px;
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666;
-}
-#account-creation_form p.textarea textarea {
-	height:80px;
-	width:370px;
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666;
-}
-#account-creation_form span.form_info, #account-creation_form p.inline-infos {
-	display:block;
-	margin:5px 0 0 265px!important;
-	color:#666;
-}
-#account-creation_form .id_state, #account-creation_form .dni, #account-creation_form .postcode {
-	display: none;
-}
-#center_column #account-creation_form p.cart_navigation {
-	margin:20px 0;
-}

themes/default/css/category.css

@@ -1,64 +0,0 @@
-h1{margin-bottom:10px;}
-
-.resumecat {
-	margin:15px 0 10px 0;
-	padding:8px 7px;
-	color:#000;
-	background:#f0f0f0;
-}
-
-.content_scene_cat {
-	padding:5px;
-	border:1px solid #ccc;
-	-moz-border-radius: 3px;
-	-webkit-border-radius: 3px;
-	border-radius: 3px;
-	-moz-box-shadow: 0 1px 1px #e2e2e2;
-	-webkit-box-shadow: 0 1px 1px #e2e2e2;
-	box-shadow: 0 1px 1px #e2e2e2;
-}
-
-.cat_desc {
-	font-size:12px;
-	line-height:18px;
-}
-.cat_desc p {padding:0 10px 5px 10px}
-.cat_desc .lnk_more {
-   padding:0 10px;
-   color:#0088CC;
-	background:url(../img/arrow_right_1.png) no-repeat 100% 4px transparent;
-}
-
-
-/* ************************************************************************************************
-      SUB CATEGORIES
-************************************************************************************************ */
-#subcategories {margin-top:15px}
-#subcategories h3 {
-	padding:14px 12px;
-	font-size:13px;
-	color:#fff;
-	text-transform:uppercase;
-	text-shadow:0 1px 0 #666;
-	background:url(../img/bg_table_th.png) repeat-x 0 0 #999
-}
-
-.inline_list {
-	list-style-type:none;
-	margin-top:10px;
-}
-.inline_list  li {
-	padding:10px 0;
-	border-bottom:1px dotted #ccc
-}
-.inline_list  li .img {
-	float:left;
-	margin-right:15px
-}
-.inline_list  li img {
-	border:1px solid #ccc
-}
-.inline_list  li .cat_name {
-	font-weight:bold;
-	font-size:13px
-}

themes/default/css/cms.css

@@ -1,6 +0,0 @@
-/* CMS pages ****************************************************************************** */
-#cms #center_column ul,
-#cms #center_column ol,
-#cms #center_column dl { margin-left:25px; margin-bottom:20px }
-
-#cms #center_column li { margin-bottom:5px }

themes/default/css/comparator.css

@@ -1,98 +0,0 @@
-table#product_comparison {
-	width:100%;
-	border-right:1px solid #ccc;
-	border-bottom:1px solid #ccc;
-}
-#product_comparison tr.comparison_header {font-weight:bold}
-#product_comparison td {
-	padding:6px;
-	border-top:1px solid #ccc;
-	border-left:1px solid #ccc;
-	border-right:1px solid #ccc;
-	vertical-align:top
-}
-#product_comparison td.td_empty{
-	border:none;
-	background:#fff;
-}
-#product_comparison tr.comparison_header,
-#product_comparison td.comparison_feature_even {background:#f8f8f8}
-
-#product_comparison .product_image {
-	display:block;
-	text-align:center
-}
-#product_comparison .product_image img {border:1px solid #ccc}
-#product_comparison .s_title_block {
-	margin-bottom:10px;
-	font-size:12px;
-	color:#000;
-	font-weight:bold;
-	 padding-bottom: 0;
-}
-#product_comparison .product_desc {
-	padding-bottom:5px;
-	height:40px;
-	color:#666
-}
-#product_comparison .lnk_more {
-	display:block;
-	margin-bottom:10px;
-	padding-left:10px;
-	color:#0088cc;
-	background:url(../img/arrow_right_1.png) no-repeat 0 4px transparent;
-}
-
-.prices_container {height:50px}
-.price_container {padding-bottom:10px}
-#product_comparison .price {
-	font-weight:bold;
-	font-size:14px;
-	color:#990000
-}
-.discount {
-   display:inline-block;
-   padding:1px 5px;
-   font-size:10px;
-   font-weight:bold;
-   color:#fff;
-   text-transform:uppercase;
-	background:#9B0000
-}
-
-.comparison_availability_statut {display:none}
-
-#product_comparison .cmp_remove {
-	display:block;
-	margin-bottom:10px;
-	padding-right:16px;
-   font-weight:bold;
-	text-align:right;
-	background:url(../img/icon/delete.gif) no-repeat 100% 1px transparent;
-}
-
-.ajax_add_to_cart_button {
-	margin-left:9px;
-	padding-left:20px !important
-}
-.ajax_add_to_cart_button span {
-   display: block;
-   position: absolute;
-   top: -1px;
-   height: 26px;
-   left: -12px;
-   width: 26px;
-	background: url(../img/icon/pict_add_cart.png) no-repeat 0 0 transparent
-}
-
-
-
-
-
-
-
-
-
-
-
-

themes/default/css/contact-form.css

@@ -1,51 +0,0 @@
-
-	#contact  fieldset {
-		padding:0 0 15px 0;
-		border:1px solid #ccc;
-		background:#f8f8f8
-	}
-		#contact  h3 {
-			margin:0 0 15px 0;
-			padding:8px;
-			font-size:14px;
-			color:#fff;
-			text-transform:uppercase;
-			background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898
-		}
-		#contact #center_column p {margin:0; padding:0 0 10px 0;}
-		#contact #center_column p.desc_contact { text-align: center; padding-left: 10px; padding-right: 10px; }
-		
-		#contact p.text label,
-		#contact p.select label,
-		#contact p.select span,
-		#contact p.textarea label {
-			display:inline-block;
-			padding:6px 15px;
-			width:150px;/* 180 */
-			font-size:12px;
-			text-align:right
-		}
-		#contact p.textarea label {vertical-align:top}
-		#contact p.text input,
-		#contact p.select input {
-			padding:0 5px;
-			height:22px;
-			width:260px;/* 270 */
-			border:1px solid #ccc;
-			font-size: 12px;
-			color:#666
-		}
-		#contact p.select select {
-			margin-right:10px;
-			border:1px solid #ccc;
-			font-size: 12px;
-			color:#666
-		}
-		#contact p.textarea textarea {
-			height:80px;
-			width:270px;
-			border:1px solid #ccc;
-			font-size: 12px;
-			color:#666
-		}
-		#contact p.submit input {margin-left:185px;}

themes/default/css/grid_prestashop.css

@@ -1,138 +0,0 @@
-/*
-	Variable Grid System.
-	Learn more ~ http://www.spry-soft.com/grids/
-	Based on 960 Grid System - http://960.gs/
-
-	Licensed under GPL and MIT.
-*/
-
-/* Containers
-----------------------------------------------------------------------------------------------------*/
-.container_9 {
-	margin:0 auto;
-	width: 980px;
-}
-
-
-/* Grid >> Global
-----------------------------------------------------------------------------------------------------*/
-.grid_1,
-.grid_2,
-.grid_3,
-.grid_4,
-.grid_5,
-.grid_6,
-.grid_7,
-.grid_8,
-.grid_9 {
-	display:inline;
-	float: left;
-	position: relative;
-	margin-right: 20px;
-}
-
-
-/* Grid >> Children (Alpha ~ First, Omega ~ Last)
-----------------------------------------------------------------------------------------------------*/
-.alpha {margin-left: 0;}
-.omega {margin-right: 0;}
-
-
-/* Grid >> 9 Columns
-----------------------------------------------------------------------------------------------------*/
-.container_9 .grid_1 {width:91px;}
-.container_9 .grid_2 {width:202px;}
-.container_9 .grid_3 {width:313px;}
-.container_9 .grid_4 {width:424px;}
-.container_9 .grid_5 {width:535px;}
-.container_9 .grid_6 {width:646px;}
-.container_9 .grid_7 {width:757px;}
-.container_9 .grid_8 {width:868px;}
-.container_9 .grid_9 {width:980px;}
-
-
-/* Prefix Extra Space >> 9 Columns
-----------------------------------------------------------------------------------------------------*/
-.container_9 .prefix_1 {padding-left:111px;}
-.container_9 .prefix_2 {padding-left:222px;}
-.container_9 .prefix_3 {padding-left:333px;}
-.container_9 .prefix_4 {padding-left:444px;}
-.container_9 .prefix_5 {padding-left:555px;}
-.container_9 .prefix_6 {padding-left:666px;}
-.container_9 .prefix_7 {padding-left:777px;}
-.container_9 .prefix_8 {padding-left:888px;}
-
-
-/* Suffix Extra Space >> 9 Columns
-----------------------------------------------------------------------------------------------------*/
-.container_9 .suffix_1 {padding-right:111px;}
-.container_9 .suffix_2 {padding-right:222px;}
-.container_9 .suffix_3 {padding-right:333px;}
-.container_9 .suffix_4 {padding-right:444px;}
-.container_9 .suffix_5 {padding-right:555px;}
-.container_9 .suffix_6 {padding-right:666px;}
-.container_9 .suffix_7 {padding-right:777px;}
-.container_9 .suffix_8 {padding-right:888px;}
-
-
-/* Push Space >> 9 Columns
-----------------------------------------------------------------------------------------------------*/
-.container_9 .push_1 {left:111px;}
-.container_9 .push_2 {left:222px;}
-.container_9 .push_3 {left:333px;}
-.container_9 .push_4 {left:444px;}
-.container_9 .push_5 {left:555px;}
-.container_9 .push_6 {left:666px;}
-.container_9 .push_7 {left:777px;}
-.container_9 .push_8 {left:888px;}
-
-
-/* Pull Space >> 9 Columns
-----------------------------------------------------------------------------------------------------*/
-.container_9 .pull_1 {left:-111px;}
-.container_9 .pull_2 {left:-222px;}
-.container_9 .pull_3 {left:-333px;}
-.container_9 .pull_4 {left:-444px;}
-.container_9 .pull_5 {left:-555px;}
-.container_9 .pull_6 {left:-666px;}
-.container_9 .pull_7 {left:-777px;}
-.container_9 .pull_8 {left:-888px;}
-
-
-/* Clear Floated Elements
-----------------------------------------------------------------------------------------------------*/
-
-/* http://sonspring.com/journal/clearing-floats */
-.clear {
-	/*clear: both;
-	display: block;
-	overflow: hidden;
-	visibility: hidden;
-	width: 0;
-	height: 0;*/
-}
-
-/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack
-
-.clearfix:after {
-	clear: both;
-	content: ' ';
-	display: block;
-	font-size: 0;
-	line-height: 0;
-	visibility: hidden;
-	width: 0;
-	height: 0;
-}
-
-.clearfix {	display: inline-block;
-}
-
-* html .clearfix {
-	height: 1%;
-}
-
-.clearfix {
-	display: block;
-}
- */

themes/default/css/history.css

@@ -1,83 +0,0 @@
-#history #left_column {display:none}
-#history #center_column{width:757px}
-#history #center_column h1{margin-top:20px}
-#history #center_column .title_block {
-	margin:20px 0;
-	padding:15px 20px;
-	background:#ccc
-}
-#history #center_column .title_block  input {
-	position: relative;
-   top: -8px;
-	float:right;
-}
-
-.info-order {
-	margin-bottom:20px;
-}
-.info-order p {padding-bottom:10px}
-.info-order p .icon {
-	position:relative;
-	top:2px;
-	left:0
-}
-
-#order-list {
-	margin-bottom:20px;
-	width:100%;
-	border:1px solid #999;
-	border-bottom:none
-}
-#order-list  th {
-	padding:14px 12px;
-	color:#fff;
-	text-transform:uppercase;
-	text-shadow:0 1px 0 #000;
-	background:url(../img/bg_table_th.png) repeat-x 0 0 #999
-}
-#order-list tr.alternate_item {background-color: #f3f3f3}
-#order-list  td {
-	padding:12px;
-	border-right:1px solid #e9e9e9;
-	border-bottom:1px solid #e9e9e9;
-	font-weight:bold;
-	font-size:12px;
-	vertical-align:top
-}
-#order-list  td.history_detail {border-right:none;}
-
-#order-list .last_item  td {border-bottom:1px solid #999}
-
-.adresses_bloc {margin-bottom:20px}
-.adresses_bloc  .item {margin-right:60px}
-
-.detail_step_by_step {width:100%}
-.detail_step_by_step tr.last_item td {border-bottom:1px solid #999}
-
-#order-detail-content table {width:100%}
-#order-detail-content table .order_qte_input {display:none}
-#order-detail-content table tr.totalprice td {border-bottom:1px solid #999}
-#order-detail-content table tr:nth-child(even) {background:#f3f3f3;}
-
-#sendOrderMessage {margin-bottom:20px}
-#sendOrderMessage p {padding-bottom:10px}
-
-#returnOrderMessage .textarea textarea,
-#sendOrderMessage .textarea textarea {
-	width:100%;
-	border:1px solid #999
-}
-
-
-
-
-
-
-
-
-
-
-
-
-
-

themes/default/css/identity.css

@@ -1,71 +0,0 @@
-#identity #left_column {display:none}
-#identity #center_column{width:757px}
-#identity h3 {
-	font-weight:normal;
-	font-size:13px;
-}
-#identity p {
-	padding-bottom:10px;
-}
-#identity form.std fieldset {
-	margin-top:0;
-	padding:10px;
-	-moz-border-radius:3px;
-	-webkit-border-radius:3px;
-	border-radius:3px;
-	background:#eee;
-}
-#identity .std p.required {color:#333}
-#identity .std p.text label,
-#identity .std p.password label,
-#identity .std p.select label {
-	display:inline-block;
-	padding-right:10px;
-	width:174px;/* 184 */
-	font-weight:bold;
-	font-size:12px;
-	text-align:right;
-}
-#identity .std p.text label sup,
-#identity .std p.password label sup,
-#identity .std p.select label sup {color:#990000;}
-#identity .std p.text input,
-#identity .std p.password input {
-	padding:0 5px;
-	height:20px;
-	width:253px;/* 263 */
-	border:1px solid #ccc;
-	background:url(../img/bg_input.png) repeat-x 0 0 #fff;
-}
-#identity .std p.select select {
-	border:1px solid #ccc;
-}
-#identity .std p.radio span {
-	display:inline-block;
-	padding-right:10px;
-	width:174px;/* 184 */
-	font-weight:bold;
-	font-size:12px;
-	text-align:right;
-}
-#identity .std p.radio input {
-	padding:0 5px;
-	height:auto;
-	width:auto;
-	border:none;
-	background:none;
-	position: relative;
-	bottom: -3px;
-}
-#identity .std p.checkbox input {
-	position:relative;
-	top:2px;
-	left:0;
-	margin:0 2px 0 187px;
-}
-#identity .std p.submit {padding:10px 0 20px 187px}
-#identity .std p.submit .button {padding:5px 25px}
-#identity .std #security_informations {
-	padding:0 0 0 187px;
-	font-size:11px;
-}

themes/default/css/index.php

@@ -1,35 +0,0 @@
-<?php
-/*
-* 2007-2013 PrestaShop
-*
-* NOTICE OF LICENSE
-*
-* This source file is subject to the Academic Free License (AFL 3.0)
-* that is bundled with this package in the file LICENSE.txt.
-* It is also available through the world-wide-web at this URL:
-* http://opensource.org/licenses/afl-3.0.php
-* If you did not receive a copy of the license and are unable to
-* obtain it through the world-wide-web, please send an email
-* to license@prestashop.com so we can send you a copy immediately.
-*
-* DISCLAIMER
-*
-* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
-* versions in the future. If you wish to customize PrestaShop for your
-* needs please refer to http://www.prestashop.com for more information.
-*
-*  @author PrestaShop SA <contact@prestashop.com>
-*  @copyright  2007-2013 PrestaShop SA
-*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
-*  International Registered Trademark & Property of PrestaShop SA
-*/
-
-header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
-header("Last-Modified: ".gmdate("D, d M Y H:i:s")." GMT");
-
-header("Cache-Control: no-store, no-cache, must-revalidate");
-header("Cache-Control: post-check=0, pre-check=0", false);
-header("Pragma: no-cache");
-
-header("Location: ../");
-exit;

themes/default/css/maintenance.css

@@ -1,12 +0,0 @@
-#maintenance {
-	margin:0 auto;
-	width:940px;
-	font:normal 30px Arial, Verdana, sans-serif;
-	color:#333;
-}
-#maintenance #message {
-	margin:0 20px;
-	padding:50px 310px 0 0;
-	height:360px;
-	background:url(../img/bg_maintenance.png) no-repeat 100% 0 #fff
-}

themes/default/css/my-account.css

@@ -1,21 +0,0 @@
-#my-account  #left_column {display:none}
-#my-account #center_column {width:757px}
-#my-account #center_column h1 {margin-bottom:20px}
-
-#my-account #center_column .title_block  {
-	font-weight:normal;
-	font-size:12px;
-	color:#666
-}
-
-#my-account .myaccount_lnk_list {list-style-type:none}
-#my-account .myaccount_lnk_list li {
-	font-size:13px;
-	line-height:36px
-}
-#my-account .myaccount_lnk_list img.icon,
-#my-account p img.icon {
-	position:relative;
-	top:6px;
-	left:0
-}

themes/default/css/order-opc.css

@@ -1,93 +0,0 @@
-#orderopc  #left_column {display:none}
-#orderopc #center_column{width:757px}
-#orderopc  #left_column h2 {margin-top:20px}
-#opc_account_choice {padding:0 15px;}
-#opc_account_choice .opc_float {
-	float:left;
-	width:350px
-}
-#opc_account_choice .opc_float ul {margin:0 0 20px 30px}
-#new_account_form  fieldset {
-		padding:0 0 15px 0;
-		border:1px solid #ccc;
-		background:#f8f8f8
-}
-#new_account_form  h3 {
-	margin:0 0 15px 0;
-	padding:8px;
-	font-size:14px;
-	color:#fff;
-	text-transform:uppercase;
-	background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898
-}
-#center_column #new_account_form p {margin:0; padding:0 0 10px 0;}
-#new_account_form p.required {color:#222;}
-#new_account_form p.required  sup {color:#990000;}
-
-#new_account_form p.radio label {
-	padding-right:10px;
-	font-size:14px;
-}
-#new_account_form p.radio span,
-#new_account_form p.text label,
-#new_account_form p.password label,
-#new_account_form p.select label,
-#new_account_form p.select span,
-#new_account_form p.textarea label {
-	display:inline-block;
-	padding:6px 15px;
-	width:230px;/* 260 */
-	font-size:14px;
-	text-align:right
-}
-#new_account_form p.checkbox label {
-	font-size:12px;
-}
-#new_account_form p.text input,
-#new_account_form p.password input,
-#new_account_form p.select input {
-	padding:0 5px;
-	height:22px;
-	width:360px;/* 370 */
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666
-}
-#new_account_form p.checkbox input {
-	margin-left:260px;
-}
-#new_account_form p.select select {
-	margin-right:10px;
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666
-}
-#new_account_form p.textarea textarea {
-	height:80px;
-	width:370px;
-	border:1px solid #ccc;
-	font-size: 12px;
-	color:#666
-}
-#new_account_form span.form_info,
-#new_account_form span.inline-infos, #new_account_form p.inline-infos {
-	display:block;
-	margin:5px 0 0 265px!important;
-	color:#666
-}
-#new_account_form .id_state, #new_account_form .dni, #new_account_form .postcode {
-	display: none;
-}
-#opc_account_errors {
-	margin: 10px;
-	margin-bottom: 15px;
-}
-#center_column #new_account_form p#opc_account_saved {
-	color: green;
-	float: right;
-	margin-right: 20px;
-	padding: 0;
-}
-#address_invoice_form {
-	padding: 0px;
-}

themes/default/css/product.css

@@ -1,534 +0,0 @@
-/* product desc */
-/* primary_block ***************************************************************************** */
-#primary_block {
-	margin-top:15px;
-}
-
-/* pb-right-column ***************************************************************************** */
-#pb-right-column {
-	float:left;
-	width:266px;
-}
-
-#pb-right-column #image-block {
-	position:relative;
-}
-
-#pb-right-column #image-block img {
-	border:1px solid #cdcdcd;
-}
-
-#pb-right-column #image-block #view_full_size {
-	display:block;
-	cursor:pointer;
-}
-
-#pb-right-column #image-block #view_full_size .span_link {
-	position:absolute;
-	bottom:10px;
-	left:32%;
-	display:block;
-	padding:0 12px 0 30px;
-	line-height:20px;
-	color:#fff;
-	text-shadow:0 1px 0 #000;
-	text-align:center;
-	text-transform:uppercase;
-	background-image:url(../img/icon/zoom.png);
-	background-repeat:no-repeat;
-	background-position:10px 2px;
-	background-color:#000;
-	background-color:rgba(0,0,0,0.5);
-	border-radius:12px;
-	-moz-border-radius:12px;
-	-webkit-border-radius:12px;
-}
-
-#pb-right-column #image-block #view_full_size .span_link img {
-	position:relative;
-	top:3px;
-	left:-3px;
-	border:none;
-	padding-right:2px;
-}
-
-/* miniatures */
-#pb-right-column #views_block {
-	margin-top:10px;
-	width:266px;
-}
-
-#thumbs_list {
-	float:left;
-	overflow:hidden;
-	margin-left:4px;
-	width:216px;
-}
-
-#thumbs_list ul#thumbs_list_frame {
-	list-style-type:none;
-	padding-left:0;
-}
-
-#thumbs_list li {
-	float:left;
-	height:60px;
-	width:72px;
-	cursor:pointer;
-}
-
-#thumbs_list li img {
-	margin:0 6px;
-	border:1px solid #cdcdcd;
-}
-
-span.view_scroll_spacer {
-	float:left;
-	height:16px;
-	width:21px;
-}
-
-#view_scroll_left,#view_scroll_right {
-	float:left;
-	margin-top:20px;
-	padding:0 4px;
-	height:18px;
-	width:9px;
-	text-indent:-3000px;
-	background:url(../img/thumbs_left.gif) no-repeat center center transparent;
-}
-
-#view_scroll_right {
-	margin-left:4px;
-	background-image:url(../img/thumbs_right.gif);
-}
-
-.resetimg {
-	padding:10px 0 0;
-}
-
-/* link list */
-#usefull_link_block {
-	list-style-type:none;
-	margin-top:20px;
-}
-
-#usefull_link_block li {
-	padding:2px 0;
-}
-
-#usefull_link_block li.print {
-	padding-left:20px;
-	background:url(../img/icon/print.gif) no-repeat 0 0;
-}
-
-#usefull_link_block li.sendtofriend {
-	padding-left:20px;
-	background:url(../img/icon/send_friend.gif) no-repeat 0 0;
-}
-
-#usefull_link_block li#left_share_fb {
-	padding-left:20px;
-	background:url(../img/icon/picto_fb.png) no-repeat 0 0;
-}
-
-/* pb-left-column ****************************************************************************** */
-#pb-left-column {
-	float:left;
-	margin-left:14px;
-	width:255px;
-}
-
-#pb-left-column h1 {
-	padding-bottom:5px;
-	font-size:18px;
-}
-
-#pb-left-column #short_description_block {
-	color:#666;
-}
-
-#pb-left-column #short_description_block .buttons_bottom_block {
-	display:none;
-}
-
-/* form */
-#pb-left-column #buy_block {
-	margin-top:10px;
-}
-
-#buy_block p {
-	padding-bottom:10px;
-}
-
-#pb-left-column #buy_block label {
-	display:inline-block;
-	width:125px;
-	font-weight:700;
-	font-size:12px;
-	text-align:right;
-}
-
-.ie7 #pb-left-column #buy_block label {margin-right:5px;float:left}
-
-/* color_picker */
-#pb-left-column #color_picker p {
-	padding-bottom:5px;
-	font-weight:700;
-}
-
-#attributes fieldset {
-	padding-bottom:10px;
-}
-
-#attributes fieldset label {
-	vertical-align:top;
-}
-
-#attributes .attribute_list {
-	display:inline-block;
-}
-
-.ie7 #attributes .attribute_list {
-	display:inline;
-	zoom:1;
-	float:right
-}
-
-#attributes .attribute_list ul{
-	list-style:none
-}
-
-#attributes .attribute_list ul li{
-	clear:both
-}
-
-#attributes .attribute_list input.attribute_radio{float: left;margin-left: 3px;}
-#attributes .attribute_list span{float: left;margin-bottom: 5px;margin-left: 3px;}
-
-.ie7 #attributes .attribute_list span{margin-top:1px}
-
-#attributes .attribute_list #color_to_pick_list {
-	list-style-type:none;
-	width:125px;
-}
-
-#attributes .attribute_list #color_to_pick_list li {
-	float:left;
-	margin:0 8px 8px 0;
-	padding:1px;
-	border:1px solid #ccc;
-	clear:none
-}
-
-#attributes .attribute_list #color_to_pick_list li.selected {
-	border:1px solid #000;
-}
-
-#attributes .attribute_list #color_to_pick_list a.color_pick {
-	display:block;
-	height:20px;
-	width:20px;
-}
-
-.product_attributes {
-	padding:10px 0 0;
-	border-top:1px solid #ccc;
-}
-
-/* attributes */
-#attributes select {
-	width:120px;
-	border:1px solid #cdcdcd;
-}
-
-/* quantity_wanted */
-#quantity_wanted_p input {
-	width:50px;
-	border:1px solid #cdcdcd;
-}
-
-/* availability_statut */
-#availability_statut {
-	margin: 10px 0 0 0;
-	min-width: 255px;
-}
-
-#availability_statut span#availability_label, 
-#availability_date_label {
-	display:inline-block;
-	width:125px;
-	font-weight:700;
-	font-size:12px;
-	text-align:right;
-}
-
-#availability_statut #availability_value {
-		background-color:green;
-		color:#ffffff;
-		text-shadow:none;
-		padding:0 10px;
-		text-transform: uppercase;
-		font-size:10px;
-		font-weight: bold;
-		display:inline-block;
-}
-
-#availability_statut #availability_value.warning_inline {
-	background-color:#9B0000;
-}
-
-/* prices */
-.content_prices {
-	margin-top:10px;
-	padding-top:10px;
-	border-top:1px solid #ccc;
-	text-align:right;
-}
-
-#buy_block p.price {
-	padding:0;
-}
-
-.discount {
-	display:none;
-}
-
-#buy_block p#old_price {
-	padding-bottom:15px;
-	font-size:14px;
-	text-decoration:line-through;
-}
-
-.our_price_display {
-	padding-bottom:10px;
-	font-weight:700;
-	font-size:24px;
-	line-height:18px;
-	color:#9b0000;
-}
-
-#reduction_percent,#reduction_amount {
-	display:block;
-	float:right;
-	margin-left:10px;
-	padding:0 0 0 10px;
-	font-weight:700;
-	font-size:12px;
-	color:#fff;
-	background:url(../img/bg_reduction.png) no-repeat 0 0 transparent;
-}
-
-#reduction_percent span,#reduction_amount span {
-	display:block;
-	padding:1px 5px 1px 0;
-	background:url(../img/bg_reduction.png) no-repeat 100% 0 transparent;
-}
-
-/* online_only */
-#buy_block p.online_only {
-	font-weight:700;
-	font-size:11px;
-	color:#900;
-	text-align:left;
-	text-transform:uppercase;
-}
-
-/* add_to_cart */
-.content_prices #add_to_cart {
-	position:relative;
-	float:right;
-	padding:0;
-}
-
-.content_prices #add_to_cart .exclusive,.content_prices #add_to_cart .exclusive_disabled {
-	height: 26px;
-    padding: 5px 7px 5px 15px;
-}
-
-@media screen and (-webkit-min-device-pixel-ratio:0) { /*hack Chrome and Safari */
- 
-    .content_prices #add_to_cart .exclusive,.content_prices #add_to_cart .exclusive_disabled {
-		padding:6px 7px 4px 15px;
-	}
-
-}
-
-.ie9 .content_prices #add_to_cart .exclusive, .ie9 .content_prices #add_to_cart .exclusive_disabled,
-.ie8 .content_prices #add_to_cart .exclusive, .ie8 .content_prices #add_to_cart .exclusive_disabled,
-.ie7 .content_prices #add_to_cart .exclusive, .ie7 .content_prices #add_to_cart .exclusive_disabled {
-		padding:8px 7px 4px 15px;
-		line-height:12px;
-	}
-
-:first-child+html .content_prices #add_to_cart .exclusive {
-	padding:4px 3px 4px 11px;
-}
-
-.content_prices #add_to_cart span {
-	z-index:10;
-	display:block;
-	position:absolute;
-	top:0;
-	left:-12px;
-	height:26px;
-	width:26px;
-	background:url(../img/icon/pict_add_cart.png) no-repeat 0 0 transparent;
-}
-
-/* */
-.buttons_bottom_block {
-	clear:both;
-	padding-top:20px;
-}
-
-.buttons_bottom_block #wishlist_button {
-	font-weight:700;
-}
-
-/* SEND TO FRIEND (pop-in) ##################################################################### */
-#send_friend_form {
-}
-
-#send_friend_form h2 {
-	padding:8px 11px;
-	font-size:12px;
-	color:#fff;
-	text-shadow:0 1px 0 #000;
-	text-transform:uppercase;
-	background:#383838;
-}
-
-#send_friend_form .product {
-	margin:20px 10px;
-}
-
-#send_friend_form .product img {
-	float:left;
-	margin:0 10px 0 0;
-	border:1px solid #ccc;
-}
-
-#send_friend_form .product .product_desc {
-	float:left;
-	width:380px;
-}
-
-#send_friend_form .product .product_desc p {
-	padding:0 10px 0 0;
-	color:#333;
-}
-
-#send_friend_form .product .product_desc p.product_name {
-	font-size:12px;
-	color:#000;
-}
-
-#send_friend_form .send_friend_form_content {
-	margin:0 10px 20px;
-}
-
-#send_friend_form .form_container {
-	padding:10px 15px;
-	border:1px solid #ccc;
-	background:#eee;
-}
-
-#send_friend_form .form_container p.intro_form {
-	padding-bottom:14px;
-	font-weight:700;
-	font-size:13px;
-	color:#333;
-}
-
-#send_friend_form .form_container p.txt_required {
-	padding-bottom:0;
-	color:/* SEND TO FRIEND (pop-in) ##################################################################### */
-#666;
-}
-
-#send_friend_form .form_container .text {
-	padding-bottom:10px;
-}
-
-#send_friend_form .form_container .text label {
-	display:inline-block;
-	padding:6px 15px;
-	width:180px;
-/* 210 */
-	font-size:12px;
-	text-align:right;
-}
-
-#send_friend_form .form_container .text input {
-	padding:0 5px;
-	height:22px;
-	width:260px;
-	border:1px solid #ccc;
-	font-size:12px;
-	color:#666;
-}
-
-#send_friend_form .submit {
-	margin-top:20px;
-	padding-bottom:0;
-	text-align:right;
-}
-
-/* PACK ##################################################################### */
-#blockpack {
-	margin-top:20px;
-	padding-top:20px;
-	border-top:1px dotted #999;
-}
-
-/* PERSONNALISATION ##################################################################### */
-.customization_block {
-}
-
-.customization_block p.infoCustomizable {
-	margin:10px 0 20px;
-	padding:0 0 0 20px;
-	background:url(../img/icon/infos.gif) no-repeat 0 0 transparent;
-}
-
-ul#uploadable_files,ul#text_fields {
-	list-style-type:none;
-}
-
-.customizableProductsFile,.customizableProductsText {
-	margin-bottom:20px;
-	padding-bottom:10px;
-	border-bottom:1px dotted #ccc;
-}
-
-.customizationUploadLine {
-	padding-bottom:10px;
-}
-.customizationUploadBrowse img + a {
-	position: relative;
-	top: -51px;
-}
-.customizationUploadLine label {
-	display:inline-block;
-	width:150px;
-	vertical-align:top;
-}
-
-.customizationUploadLine textarea {
-	height:50px;
-	width:300px;
-	border:1px solid #ccc;
-}
-
-#customizedDatas {
-	float:right;
-}
-
-.accessories_block div ul li a {
-	display:inline-block;
-}
-
-.accessories_block div ul li .s_title_block a, .accessories_block div ul li .s_title_block span  {
-	font-weight:bold;
-}

themes/default/css/product_list.css

@@ -1,148 +0,0 @@
-ul#product_list {
-	list-style-type: none
-}
-#product_list li {
-	margin-bottom: 14px;
-	padding: 12px 8px;
-	border: 1px solid #eee;
-	-moz-border-radius: 3px;
-	-webkit-border-radius: 3px;
-	border-radius: 3px
-}
-#product_list li a {
-	color: #374853;
-	text-decoration: none
-}
-#product_list li .left_block {
-	float:left;
-	padding-top:58px;
-	width:15px
-}
-#product_list li .left_block  .compare label {display:none;}
-
-#product_list li p.compare input {
-	vertical-align: text-bottom
-}
-#product_list li .center_block {
-   float: left;
-	padding:0 7px;
-   width: 342px;/* 356 */
-	border-right:1px dotted #ccc
-}
-#product_list a.product_img_link {
-	overflow:hidden;
-	position:relative;
-	float: left;
-	display:block;
-	margin-right: 14px;
-	border: 1px solid #ccc
-}
-#product_list a.product_img_link img {
-	display: block;
-	vertical-align: bottom
-}
-#product_list li span.new {
-	display: block;
-	position: absolute;
-	top: 15px;
-	right:-30px;
-	padding: 1px 4px;
-	width: 101px;
-	font-size:10px;
-	color: #fff;
-	text-align: center;
-	text-transform: uppercase;
-	-moz-transform: rotate(45deg);
-	-webkit-transform: rotate(45deg);
-	-o-transform:rotate(45deg);
-	background-color: #990000;
-	transform: rotate(45deg); 
-	-ms-transform: rotate(45deg);			/* Newer browsers */
-}
-
-.ie8 #product_list li span.new{top:111px;right:0;width:94%}
-.ie7 #product_list li span.new {top:111px;right:0;width:94%}
-#product_list li h3 {
-	padding:0 0 10px 0;
-	font-size:13px;
-	color:#000
-}
-#product_list li a {
-	color: #000;
-	text-decoration: none;
-}
-#product_list li p.product_desc {
-	overflow: hidden;
-	padding:0;
-	line-height:16px;
-}
-#product_list li p.product_desc,
-#product_list li p.product_desc a {
-	color:#666;
-}
-
-#product_list li .right_block {
-position:relative;
-float: left;
-width: 145px;
-text-align: right
-}
-#product_list li .discount, ul#product_list li .on_sale, ul#product_list li .online_only {
-	display: block;
-	font-weight: bold;
-	color: #990000;
-	text-transform: uppercase
-}
-#product_list li .discount {
-	position:absolute;
-	top:0;
-	right:0;
-	display: inline-block;
-	font-weight: bold;
-	padding: 1px 5px;
-	font-size: 10px;
-	color: #fff;
-	text-transform: uppercase;
-	background: none repeat scroll 0 0 #9B0000
-}
-#product_list li .online_only {
-	margin:0 0 10px 0
-}
-#product_list li .content_price {
-	margin:26px 0 15px 0;
-}
-#product_list li .price {
-	display: block;
-	margin-bottom: 15px;
-	font-weight:bold;
-	font-size: 18px;
-	color:#990000
-}
-#product_list li span.availability {
-	color: #488C40
-}
-#product_list li span.warning_inline {
-	color: red
-}
-#product_list li .ajax_add_to_cart_button {
-	padding-left: 20px
-}
-#product_list li .ajax_add_to_cart_button span {
-	display: block;
-	position: absolute;
-	top: -1px;
-	left: -12px;
-	height: 26px;
-	width: 26px;
-	background: url(../img/icon/pict_add_cart.png) no-repeat 0 0 transparent
-}
-#product_list li .lnk_view {
-	display: block;
-	margin-top:15px;
-	padding:0 10px;
-	border:none;
-	font-weight:bold;
-	color:#0088CC;
-	background:url(../img/arrow_right_1.png) no-repeat 100% 4px transparent
-}
-#product_list li .lnk_view:hover {text-decoration:underline}

themes/default/css/rtl.css

@@ -1,2 +0,0 @@
-* { direction: rtl !important; }
-#page { text-align: right !important; }

themes/default/css/scenes.css

@@ -1,148 +0,0 @@
-
-/*TMP*/
-#scenes .cluetip span{
-	background:transparent url(../img/icon/cible.gif) no-repeat scroll center center;
-	color:black;
-	display:block;
-	font-size:1.1em;
-	font-weight:bold;
-	height:23px;
-	padding-top:5px;
-	text-align:center;
-	width:23px;
-}
-/*TMP*/
-.thumbs_banner{
-	margin:10px auto;
-	padding:2px 0;
-	height: 60px !important;
-	width:100%;
-	border-top:1px solid #ccc;
-	border-bottom:1px solid #ccc;
-}
-
-.thumbs_banner .space-keeper{
-	width:21px;
-	float:left;
-	display:block;
-	height:100%;
-}
-
-.thumbs_banner .space-keeper a.prev{
-	display:none;
-	width:21px;
-	text-align:center;
-	font-size:1.5em;
-	text-decoration:none;
-	background:url(../img/icon/serial_scroll_left.gif) no-repeat 0 0 #eee;
-}
-#scenes_list{
-	overflow:hidden;
-	float:left;
-	width:478px;
-}
-#scenes_list ul{
-	list-style-type:none;
-}
-
-#scenes_list li{
-	float:left;
-}
-
-#scenes_list a{
-	display:block;
-}
-
-.thumbs_banner a.next {
-	float:left;
-	display:block;
-	width:21px;
-	text-align:center;
-	font-size:1.5em;
-	text-decoration:none;
-	background:url(../img/icon/serial_scroll_right.gif) no-repeat 0 0 #ddd;
-}
-
-/* Cluetip design ****************************************************************************** */
-#scenes .screen_scene {
-	margin:0 auto;
-}
-
-#scenes a.cluetip{
-	display:block;
-	position:absolute;
-	text-decoration:none;
-}
-
-.cluetip-product_scene {
-	padding:10px;
-	border:7px solid #999;
-	-moz-border-radius:3px;
-	-webkit-border-radius:3px;
-   border-radius:3px;
-	text-align:left;
-	background:#fff;
-	opacity:0.95;
-}
-
-.cluetip-product_scene #cluetip-close{
-	text-align:right;
-	float:right;
-}
-
-.cluetip-product_scene img {
-	float:left;
-	margin-right:10px;
-	border:1px solid #ccc
-}
-.cluetip-product_scene .title_block {
-	display:inline-block;
-	margin-bottom:5px;
-	padding:0 !important;
-	font-size:12px;
-}
-
-.cluetip-product_scene .clear {margin:0; padding:0}
-.cluetip-product_scene .clear a {
-	/*float:left;*/
-	margin-top:2px;
-}
-
-.cluetip-product_scene p.description{
-	float:left;
-	padding:0;
-	width:140px;
-	color:#666
-}
-
-.cluetip-product_scene div.prices{
-	float:right;
-	position:relative;
-	width:65px;
-	text-align:right;
-}
-.cluetip-product_scene .new {
-	position:absolute;
-	top:0;
-	right:0;
-   display: inline-block;
-   padding: 1px 5px;
-   font-weight: bold;
-   font-size: 10px;
-   color: #fff;
-   text-transform: uppercase;
-	background: none repeat scroll 0 0 #9B0000
-}
-.cluetip-product_scene .price{
-	padding-top:18px;
-	font-weight:bold;
-	font-size:13px;
-	color:#990000
-}
-.cluetip-product_scene .on_sale, .cluetip-product_scene .discount {
-	display:block;
-	font-weight:bold;
-	color:#DA0F00;
-	text-transform:uppercase;
-}
-/* END Cluetip design */

themes/default/css/sitemap.css

@@ -1,38 +0,0 @@
-#sitemap_content {margin-left: 20px}
-#sitemap_content .sitemap_block h3, 
-#sitemap_content .categTree h3 {margin: 20px 0 0 0}
-
-#sitemap_content div.sitemap_block {
-   float: left;
-   min-height: 120px;
-   padding: 0;
-   width: 33%
-}
-#sitemap_content div.sitemap_block ul {list-style-type:none}
-#sitemap_content div.sitemap_block li a {
-   display: block;
-   padding: 2px 0 2px 10px;
-   color: #333;
-	background: url(../img/arrow_right_2.png) no-repeat 0 4px transparent
-}
-
-#listpage_content {margin: 50px 0 20px 20px;}
-#listpage_content div.categTree {
-   float: left;
-   width: 33%
-}
-#listpage_content div.tree_top {
-   padding: 3px 0 5px 24px;
-   background: url(../img/sitemap-top.gif) no-repeat -1px -3px transparent
-}
-#listpage_content ul {list-style-type:none}
-#listpage_content ul.tree li {
-   margin-left: 11px;
-   padding-left: 20px;
-   border-left: 1px dotted #999;
-   background: url(../img/sitemap-horizontal.png) no-repeat left 10px transparent
-}
-#listpage_content ul.tree li.last {
-   border: medium none;
-   background: url(../img/sitemap-last.gif) no-repeat -12px -2px transparent
-}