Roland

check_configure_kerio_privat_mail.tpl

@@ -128,4 +128,4 @@
             }
         });
     });
-</script>
+</script>

check_configure_thurvserver.tpl

@@ -59,12 +59,12 @@
             $(customFields[2]).removeClass('has-error has-warning has-success');
             if (pwlengthOK && numericOK && symbolsOK && upperlowerOK) {
                 $(customFields[2]).addClass('has-success');
-                $(customFields[2]).css('background-color', '#0f03');
+                $(customFields[2]).css('background-color', '#0f03');;
                 $(customFields[3]).prop("disabled",false);
                 $("#hintHead").text('');
             } else {
                 $(customFields[2]).addClass('has-error');
-                $(customFields[2]).css('background-color', '#f003');
+                $(customFields[2]).css('background-color', '#f003');;
                 $(customFields[3]).prop("disabled",true);
                 $("#hintHead").text('Tipps für ein gutes Passwort');
             }
@@ -73,20 +73,20 @@
             if ($(customFields[2]).val() == $(customFields[3]).val()) {
                 $("#btnCompleteProductConfig").prop("disabled",false);
                 $(customFields[3]).addClass('has-success');
-                $(customFields[3]).css('background-color', '#0f03');
+                $(customFields[3]).css('background-color', '#0f03');;
                 $("#hintHead").text('');
             } else {
                 $("#btnCompleteProductConfig").prop("disabled",true);
                 $(customFields[3]).addClass('has-error');
-                $(customFields[3]).css('background-color', '#f003');
+                $(customFields[3]).css('background-color', '#f003');;
                 $("#hintHead").text('Passworte stimmen nicht überein!');
             }
         });
         buttonComplete = $("#btnCompleteProductConfig");
         $(buttonComplete).click(function () {
             if (($(customFields[0]).val() == 'root' || $(customFields[0]).val() == '') && ($(customFields[1]).val() == '')){
-                alert('Ohne validen SSH Public Key können Sie sich als "root" nur über die Serverkonsole im Kundenportal, nicht aber remote via SSH an Ihrem Server anmelden!');
-            }
+                            alert('Ohne validen SSH Public Key können Sie sich als "root" nur über die Serverkonsole im Kundenportal, nicht aber remote via SSH an Ihrem Server anmelden!');
+	    }
         });
     });
-</script>
+</script>

checkout.tpl

@@ -1627,14 +1627,14 @@
                             </p>
                         {/if}
 						
-						{if $captcha}
-							<div class="text-center margin-bottom">
-								{include file="$template/includes/captcha.tpl"}
-							</div>
+			{if $captcha}
+				<div class="text-center margin-bottom">
+					{include file="$template/includes/captcha.tpl"}
+				</div>
                         {/if}
-                        {if ((count($clientActiveFree) + count($clientCardFree)) > (2 + $clientsdetails.notes|strstr:"AddTrials="|truncate:11:""|replace:"AddTrials=":""))}
+                        {if ((count($clientActiveFree) + count($clientCardFree)) > (2 + (int)$clientsdetails.notes|strstr:"AddTrials="|truncate:11:""|replace:"AddTrials=":""))}
                             {include file="templates/orderforms/{$carttpl}/removetrial.tpl"}
-                        {else if (count($clientCardDoubleFree) > 0)}
+                        {else if (!empty($clientCardDoubleFree) && count($clientCardDoubleFree) > 0)}
                             {include file="templates/orderforms/{$carttpl}/removedoubletrial.tpl"}
                         {else}
                             <button type="submit"

common.tpl

@@ -1,4 +1,6 @@
-<link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/{$carttpl}/css/all.min.css?v={$versionHash}" />
-<link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/{$carttpl}/css/style.css" />
-<!-- <script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.min.js?v={$versionHash}"></script> -->
-<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.js?v={$versionHash}"></script>
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.min.js?v={$versionHash}"></script>
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/custom.min.js?v={$versionHash}"></script>
+
+{if $templatefile == "products" || $templatefile == "domainregister" || $templatefile == "domaintransfer" || $templatefile == "configureproductdomain"}
+<script src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/select2.min.js"></script>
+{/if}

common.tpl.bak

@@ -0,0 +1,4 @@
+<link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/{$carttpl}/css/all.min.css?v={$versionHash}" />
+<link rel="stylesheet" type="text/css" href="{$WEB_ROOT}/templates/orderforms/{$carttpl}/css/style.css" />
+<!-- <script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.min.js?v={$versionHash}"></script> -->
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.js?v={$versionHash}"></script>

configure_groupware.tpl

@@ -1,4 +1,6 @@
-<!-- Start of Template configure_groupware.tpl -->
+<!-- Start of Template: templates/orderforms/thurdata/configure_groupware.tpl -->
+<!-- Start of Template: configure_groupware.tpl -->
+
 {include file="orderforms/{$carttpl}/common.tpl"}
 <script>
     var _localLang = {
@@ -9,6 +11,9 @@
 {if file_exists("templates/orderforms/{$carttpl}/layouts/head.tpl")}
 	{include file="templates/orderforms/{$carttpl}/layouts/head.tpl"}
 {/if}
+
+
+<!-- Standard Cart -->
 <div id="order-standard_cart">
     <div class="row">
         <div class="col-md-12">
@@ -33,7 +38,10 @@
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						    <i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%"><strong>{$productinfo.name}</strong></p>
                                             {foreach $features as $feature}
                                                 {$featureParts = ":"|explode:$feature}
                                                 {$featureTrim = $feature|trim}
@@ -63,25 +71,25 @@
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                             {*
-                                                Product Icon set by its group id
+						Product Icon set by its group id
                                                 -----------------------------------------
                                                 ThurMail Private                => gid=1
                                                 Thurfiles Private Hosting       => gid=2
                                                 Nextcloud Private Hosting       => gid=3
                                                 ThurVServer                     => gid=4
-                                                ThurVCloud		        => gid=5
+                                                ThurVCloud                      => gid=5
                                                 Thurcert Domain Validated       => gid=6
-                                                ThurMail Zimbra                 => gid=7
-                                                ThurMail Kerio			=> gid=16
-                                                Mailhosting mit Nextcloud       => gid=8
+                                                ThurMail Business               => gid=7
                                                 Nextcloud Business Hosting      => gid=9
-                                                Thurfiles Business Hosting	=> gid=10
+                                                Thurfiles Business Hosting      => gid=10
                                                 Thurcert Company Validated      => gid=11
                                                 Thurcert Extended Validation    => gid=12
-                                                ThurHosting                     => gid=15
-                                                
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                             *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configure_nextcloud.tpl

@@ -44,7 +44,12 @@ pwrepeat|Passwort wiederholen	-> customfields[5]
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                         {$features = "<br />"|explode:$productinfo.description}
-                                        <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                        <p class="product-title" style="margin-bottom: -6px;">
+					    <i>{$productinfo.group_name}</i>
+					</p>
+					<p style="font-size:120%">
+					    <strong>{$productinfo.name}</strong>
+					</p>
                                         {foreach $features as $feature}
                                             {$featureParts = ":"|explode:$feature}
                                             {$featureTrim = $feature|trim}
@@ -74,22 +79,25 @@ pwrepeat|Passwort wiederholen	-> customfields[5]
                                     </td>
                                     <td valign="top" style="text-align:left;">
                                         {*
-                                            Product Icon set by its group id
-                                            -----------------------------------------
-                                            Mailhosting                     => gid=1
-                                            Thurfiles Private Hosting       => gid=2
-                                            Nextcloud Private Hosting       => gid=3
-                                            ThurVServer                     => gid=4
-                                            ThurVCloud                      => gid=5
-                                            Thurcert Domain Validated       => gid=6
-                                            Groupware Hosting               => gid=7
-                                            Mailhosting mit Nextcloud       => gid=8
-                                            Nextcloud Business Hosting	    => gid=9
-                                            Thurfiles Business Hosting	    => gid=10
-                                            Thurcert Company Validated      => gid=11
-                                            Thurcert Extended Validation    => gid=12
+						Product Icon set by its group id
+                                                -----------------------------------------
+                                                ThurMail Private                => gid=1
+                                                Thurfiles Private Hosting       => gid=2
+                                                Nextcloud Private Hosting       => gid=3
+                                                ThurVServer                     => gid=4
+                                                ThurVCloud                      => gid=5
+                                                Thurcert Domain Validated       => gid=6
+                                                ThurMail Business               => gid=7
+                                                Nextcloud Business Hosting      => gid=9
+                                                Thurfiles Business Hosting      => gid=10
+                                                Thurcert Company Validated      => gid=11
+                                                Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                         *}
-                                        <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                        <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                     </td>
                                 </tr>
                             </table>

configure_privat_mail.tpl

@@ -33,7 +33,12 @@
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                 {$featureParts = ":"|explode:$feature}
                                                 {$featureTrim = $feature|trim}
@@ -62,7 +67,7 @@
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                             {*
-                                                Product Icon set by its group id
+						Product Icon set by its group id
                                                 -----------------------------------------
                                                 ThurMail Private                => gid=1
                                                 Thurfiles Private Hosting       => gid=2
@@ -70,15 +75,17 @@
                                                 ThurVServer                     => gid=4
                                                 ThurVCloud                      => gid=5
                                                 Thurcert Domain Validated       => gid=6
-                                                ThurMail Zimbra		        => gid=7
-                                                ThurMail Kerio		        => gid=16
-                                                Mailhosting mit Nextcloud       => gid=8
-                                                NextCloud Business Hosting      => gid=9
-                                                Thurfiles Business Hosting	=> gid=10
+                                                ThurMail Business               => gid=7
+                                                Nextcloud Business Hosting      => gid=9
+                                                Thurfiles Business Hosting      => gid=10
                                                 Thurcert Company Validated      => gid=11
                                                 Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                             *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configure_seafile.tpl

@@ -43,7 +43,12 @@ pwrepeat|Passwort wiederholen	-> customfields[4]
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                 {$featureParts = ":"|explode:$feature}
                                                 {$featureTrim = $feature|trim}
@@ -73,22 +78,25 @@ pwrepeat|Passwort wiederholen	-> customfields[4]
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                             {*
-                                                Product Icon set by its group id
+						Product Icon set by its group id
                                                 -----------------------------------------
-                                                Mailhosting                     => gid=1
+                                                ThurMail Private                => gid=1
                                                 Thurfiles Private Hosting       => gid=2
                                                 Nextcloud Private Hosting       => gid=3
                                                 ThurVServer                     => gid=4
                                                 ThurVCloud                      => gid=5
                                                 Thurcert Domain Validated       => gid=6
-                                                Groupware Hosting               => gid=7
-                                                Mailhosting mit Nextcloud       => gid=8
-                                                Nextcloud Business Hosting	=> gid=9
-                                                Thurfiles Business Hosting	=> gid=10
+                                                ThurMail Business               => gid=7
+                                                Nextcloud Business Hosting      => gid=9
+                                                Thurfiles Business Hosting      => gid=10
                                                 Thurcert Company Validated      => gid=11
                                                 Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                             *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configure_thurvcloud.tpl

@@ -33,7 +33,12 @@
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                 {$featureParts = ":"|explode:$feature}
                                                 {$featureTrim = $feature|trim}
@@ -63,23 +68,25 @@
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                             {*
-                                                Product Icon set by its group id
+						Product Icon set by its group id
                                                 -----------------------------------------
                                                 ThurMail Private                => gid=1
                                                 Thurfiles Private Hosting       => gid=2
                                                 Nextcloud Private Hosting       => gid=3
                                                 ThurVServer                     => gid=4
-                                                ThurVCloud		        => gid=5
+                                                ThurVCloud                      => gid=5
                                                 Thurcert Domain Validated       => gid=6
-                                                ThurMail Zimbra		        => gid=7
-                                                ThurMail Kerio		        => gid=16
-                                                Mailhosting mit Nextcloud       => gid=8
+                                                ThurMail Business               => gid=7
                                                 Nextcloud Business Hosting      => gid=9
-                                                Thurfiles Business Hosting	=> gid=10
+                                                Thurfiles Business Hosting      => gid=10
                                                 Thurcert Company Validated      => gid=11
                                                 Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                             *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350;">
                                         </td>
                                     </tr>
                                 </table>

configure_thurvserver.tpl

@@ -1,5 +1,5 @@
 {include file="orderforms/{$carttpl}/common.tpl"}
-<!-- Start of Template: configure_thurvserver.tpl -->
+<!-- Start of Template: templates/orderforms/thurdata/configure_thurvserver.tpl -->
 <script>
     var _localLang = {
         'addToCart': '{$LANG.orderForm.addToCart|escape}',
@@ -33,7 +33,12 @@
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                 {$featureParts = ":"|explode:$feature}
                                                 {$featureTrim = $feature|trim}
@@ -65,20 +70,23 @@
                                             {*
                                                 Product Icon set by its group id
                                                 -----------------------------------------
-                                                Mailhosting                     => gid=1
+                                                ThurMail Private                => gid=1
                                                 Thurfiles Private Hosting       => gid=2
                                                 Nextcloud Private Hosting       => gid=3
                                                 ThurVServer                     => gid=4
                                                 ThurVCloud		        => gid=5
                                                 Thurcert Domain Validated       => gid=6
-                                                Groupware Hosting               => gid=7
-                                                Mailhosting mit Nextcloud       => gid=8
+                                                ThurMail Business               => gid=7
                                                 Nextcloud Business Hosting	=> gid=9
                                                 Thurfiles Business Hosting	=> gid=10
                                                 Thurcert Company Validated      => gid=11
                                                 Thurcert Extended Validation    => gid=12
+						ThurWeb Hosting			=> gid=15
+						ThurBackup			=> gid=17
+                                                Thurcert S/MIME			=> gid=18
+						Website Builder			=> gid=19
                                             *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configure_webhosting.tpl

@@ -33,7 +33,12 @@ var _localLang = {
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                     {$featureParts = ":"|explode:$feature}
                                                     {$featureTrim = $feature|trim}
@@ -63,23 +68,25 @@ var _localLang = {
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                         {*
-                                            Product Icon set by its group id
-                                            -----------------------------------------
-                                            ThurMail Private                => gid=1
-                                            Thurfiles Private Hosting       => gid=2
-                                            Nextcloud Private Hosting       => gid=3
-                                            ThurVServer                     => gid=4
-                                            ThurVCloud		            => gid=5
-                                            Thurcert Domain Validated       => gid=6
-                                            ThurMail Zimbra                 => gid=7
-                                            ThurMail Kerio                  => gid=16
-                                            Mailhosting mit Nextcloud       => gid=8
-                                            Nextcloud Business Hosting      => gid=9
-                                            Thurfiles Business Hosting	    => gid=10
-                                            Thurcert Company Validated      => gid=11
-                                            Thurcert Extended Validation    => gid=12
+						Product Icon set by its group id
+                                                -----------------------------------------
+                                                ThurMail Private                => gid=1
+                                                Thurfiles Private Hosting       => gid=2
+                                                Nextcloud Private Hosting       => gid=3
+                                                ThurVServer                     => gid=4
+                                                ThurVCloud                      => gid=5
+                                                Thurcert Domain Validated       => gid=6
+                                                ThurMail Business               => gid=7
+                                                Nextcloud Business Hosting      => gid=9
+                                                Thurfiles Business Hosting      => gid=10
+                                                Thurcert Company Validated      => gid=11
+                                                Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                         *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configureproduct.tpl

@@ -12,19 +12,18 @@ ThurMail Kerio			=> gid=16
 Mailhosting mit Nextcloud 	=> gid=8
 ThurVCloud Business		=> gid=9
 ThurFiles Business Hosting	=> gid=10
-ThurMail Kerio Private          => gid=19
-
+ThurMail Kerio Private		=> gid=19
 *}
 {if ($productinfo.paytype eq 'free') && in_array($productinfo.pid, $clientPids)}
     {include file="./nodoubletrial.tpl"}
 {else}
     {if $productinfo.gid === 1 || $productinfo.gid === 8 || $productinfo.gid === 19}
         {include file='./configure_privat_mail.tpl'}
-        {if $productinfo.gid === 19}
-                {include file='./check_configure_privat_mail.tpl'}
+	{if $productinfo.gid === 19}
+        	{include file='./check_configure_kerio_privat_mail.tpl'}
         {else}
-                {include file='./check_configure_kerio_privat_mail.tpl'}
-        {/if}
+		{include file='./check_configure_privat_mail.tpl'}
+	{/if}	
     {elseif $productinfo.gid === 2}
         {include file='./configure_seafile.tpl'}
         {include file='./check_configure_seafile.tpl'}

configureproduct_default.tpl

@@ -1,3 +1,5 @@
+<!-- Start of Template templates/orderforms/thurdata/configureproduct_default.tpl -->
+
 {include file="orderforms/{$carttpl}/common.tpl"}
 <script>
 var _localLang = {
@@ -33,7 +35,12 @@ var _localLang = {
                                     <tr>
                                         <td valign="top" style="padding-right: 50px;">
                                             {$features = "<br />"|explode:$productinfo.description}
-                                            <p class="product-title" style="margin-bottom: -2px;  font-size:120%;"><strong><i>{$productinfo.group_name}</i> - {$productinfo.name}</strong></p>
+                                            <p class="product-title" style="margin-bottom: -6px;">
+						<i>{$productinfo.group_name}</i>
+					    </p>
+					    <p style="font-size:120%">
+						<strong>{$productinfo.name}</strong>
+					    </p>
                                             {foreach $features as $feature}
                                                     {$featureParts = ":"|explode:$feature}
                                                     {$featureTrim = $feature|trim}
@@ -63,23 +70,25 @@ var _localLang = {
                                         </td>
                                         <td valign="top" style="text-align:left;">
                                         {*
-                                            Product Icon set by its group id
-                                            -----------------------------------------
-                                            ThurMail Private                => gid=1
-                                            Thurfiles Private Hosting       => gid=2
-                                            Nextcloud Private Hosting       => gid=3
-                                            ThurVServer                     => gid=4
-                                            ThurVCloud		            => gid=5
-                                            Thurcert Domain Validated       => gid=6
-                                            ThurMail Zimbra                 => gid=7
-                                            ThurMail Kerio                  => gid=16
-                                            Mailhosting mit Nextcloud       => gid=8
-                                            Nextcloud Business Hosting      => gid=9
-                                            Thurfiles Business Hosting	    => gid=10
-                                            Thurcert Company Validated      => gid=11
-                                            Thurcert Extended Validation    => gid=12
+						Product Icon set by its group id
+                                                -----------------------------------------
+                                                ThurMail Private                => gid=1
+                                                Thurfiles Private Hosting       => gid=2
+                                                Nextcloud Private Hosting       => gid=3
+                                                ThurVServer                     => gid=4
+                                                ThurVCloud                      => gid=5
+                                                Thurcert Domain Validated       => gid=6
+                                                ThurMail Business               => gid=7
+                                                Nextcloud Business Hosting      => gid=9
+                                                Thurfiles Business Hosting      => gid=10
+                                                Thurcert Company Validated      => gid=11
+                                                Thurcert Extended Validation    => gid=12
+                                                ThurWeb Hosting                 => gid=15
+                                                ThurBackup                      => gid=17
+                                                Thurcert S/MIME                 => gid=18
+                                                Website Builder                 => gid=19
                                         *}
-                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="height:150px;">
+                                            <img src="/templates/croster/thurdata/productgroups/{$productinfo.gid}.svg" class="img-fluid" style="width:350px;">
                                         </td>
                                     </tr>
                                 </table>

configureproductdomain.tpl

@@ -1,3 +1,5 @@
+<!--  templates/orderforms/thurdata/configureproductdomain.tpl -->
+
 {include file="orderforms/{$carttpl}/common.tpl"}
 
 {if file_exists("templates/orderforms/{$carttpl}/layouts/head.tpl")}

includes/checkout/default.tpl

@@ -0,0 +1,752 @@
+
+<script>
+	// Define state tab index value
+	var statesTab = 10;
+	// Do not enforce state input client side
+	var stateNotRequired = true;
+</script>
+{include file="orderforms/{$carttpl}/common.tpl"}
+<script type="text/javascript" src="{$BASE_PATH_JS}/StatesDropdown.js"></script>
+<script type="text/javascript" src="{$BASE_PATH_JS}/PasswordStrength.js"></script>
+<script>
+	window.langPasswordStrength = "{$LANG.pwstrength}";
+	window.langPasswordWeak = "{$LANG.pwstrengthweak}";
+	window.langPasswordModerate = "{$LANG.pwstrengthmoderate}";
+	window.langPasswordStrong = "{$LANG.pwstrengthstrong}";
+</script>
+
+<div class="row">
+	<div class="col-md-12">
+		<div class="already-registered {if $loggedin}w-hidden{/if}">
+			<div class="float-right">
+				<button type="button" class="btn btn-primary{if $loggedin || !$loggedin && $custtype eq "existing"} w-hidden{/if}" id="btnAlreadyRegistered">
+					{$LANG.orderForm.alreadyRegistered}
+				</button>
+				<button type="button" class="btn btn-primary{if $loggedin || $custtype neq "existing"} w-hidden{/if}" id="btnNewUserSignup">
+					{$LANG.orderForm.createAccount}
+				</button>
+			</div>
+			<div class="clearfix"></div>
+		</div>
+
+		{if $errormessage}
+			<div class="alert alert-danger checkout-error-feedback" role="alert">
+				<p>{$LANG.orderForm.correctErrors}:</p>
+				<ul>
+					{$errormessage}
+				</ul>
+			</div>
+			<div class="clearfix"></div>
+		{/if}
+
+		<form method="post" action="{$smarty.server.PHP_SELF}?a=checkout" name="orderfrm" id="frmCheckout">
+			<input type="hidden" name="submit" value="true" />
+			<input type="hidden" name="custtype" id="inputCustType" value="{$custtype}" />
+					
+			{if $custtype neq "new" && $loggedin}
+				<div class="sub-heading">
+					<span>
+						{lang key='switchAccount.title'}
+					</span>
+				</div>
+				<div id="containerExistingAccountSelect" class="row account-select-container">
+					{foreach $accounts as $account}
+						<div class="col-sm-{if $accounts->count() == 1}12{else}6{/if}">
+							<div class="account{if $selectedAccountId == $account->id} active{/if}">
+								<label class="radio-inline" for="account{$account->id}">
+									<input id="account{$account->id}" class="account-select{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled{/if}" type="radio" name="account_id" value="{$account->id}"{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled="disabled"{/if}{if $selectedAccountId == $account->id} checked="checked"{/if}>
+									<span class="address">
+										<strong>
+											{if $account->companyname}{$account->companyname}{else}{$account->fullName}{/if}
+										</strong>
+										{if $account->isClosed || $account->noPermission}
+											<span class="label label-default">
+												{if $account->isClosed}
+													{lang key='closed'}
+												{else}
+													{lang key='noPermission'}
+												{/if}
+											</span>
+										{elseif $account->currencyCode}
+											<span class="label label-info">
+												{$account->currencyCode}
+											</span>
+										{/if}
+										<br>
+										<span class="small">
+											{$account->address1}{if $account->address2}, {$account->address2}{/if}<br>
+											{if $account->city}{$account->city},{/if}
+											{if $account->state} {$account->state},{/if}
+											{if $account->postcode} {$account->postcode},{/if}
+											{$account->countryName}
+										</span>
+									</span>
+								</label>
+							</div>
+						</div>
+					{/foreach}
+					<div class="col-sm-12">
+						<div class="account border-bottom{if !$selectedAccountId || !is_numeric($selectedAccountId)} active{/if}">
+							<label class="radio-inline">
+								<input class="account-select" type="radio" name="account_id" value="new"{if !$selectedAccountId || !is_numeric($selectedAccountId)} checked="checked"{/if}{if $inExpressCheckout} disabled="disabled" class="disabled"{/if}>
+								{lang key='orderForm.createAccount'}
+							</label>
+						</div>
+					</div>
+				</div>
+			{/if}
+			<div id="containerExistingUserSignin"{if $loggedin || $custtype neq "existing"} class="w-hidden"{/if}>
+
+				<div class="sub-heading">
+					<span>{$LANG.orderForm.existingCustomerLogin}</span>
+				</div>
+				
+                <div class="alert alert-danger w-hidden" id="existingLoginMessage">
+				</div>
+				
+				<div class="TM-card">
+				<div class="row">
+					<div class="col-lg-5">
+						<div class="form-group prepend-icon">
+							<label for="inputLoginEmail" class="field-icon">
+								<i class="fas fa-envelope"></i>
+							</label>
+							<input type="text" name="loginemail" id="inputLoginEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$loginemail}">
+						</div>
+					</div>
+					<div class="col-lg-5">
+						<div class="form-group prepend-icon">
+							<label for="inputLoginPassword" class="field-icon">
+								<i class="fas fa-lock"></i>
+							</label>
+							<input type="password" name="loginpassword" id="inputLoginPassword" class="field form-control" placeholder="{$LANG.clientareapassword}">
+						</div>
+					</div>
+					<div class="col-lg-2">
+						<button type="button" id="btnExistingLogin" class="btn btn-primary btn-md btn-block mb-lg-0 mb-3">
+							<span id="existingLoginButton">{lang key='login'}</span>
+							<span id="existingLoginPleaseWait" class="w-hidden"><i class="fad fa-circle-notch fa-spin"></i></span>
+						</button>
+					</div>
+				</div>
+				</div>
+				<div class="padding-all">
+					{include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-existing"}
+				</div>
+			</div>
+
+			<div id="containerNewUserSignup"{if $custtype === 'existing' || (is_numeric($selectedAccountId) && $selectedAccountId > 0) || ($loggedin && $accounts->count() > 0 && $selectedAccountId !== 'new')} class="w-hidden"{/if}>
+				<div{if $loggedin} class="w-hidden"{/if}>
+					<div class="padding-all">
+						{include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-new"}
+					</div>
+				</div>
+
+				<h4>{$LANG.orderForm.personalInformation}</h4>
+
+				<div class="TM-card">
+				<div class="row">
+					<div class="col-sm-6">
+						<div class="form-group prepend-icon">
+							<label for="inputFirstName" class="field-icon">
+								<i class="fas fa-user"></i>
+							</label>
+							<input type="text" name="firstname" id="inputFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$clientsdetails.firstname}" autofocus>
+						</div>
+					</div>
+					<div class="col-sm-6">
+						<div class="form-group prepend-icon">
+							<label for="inputLastName" class="field-icon">
+								<i class="fas fa-user"></i>
+							</label>
+							<input type="text" name="lastname" id="inputLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$clientsdetails.lastname}">
+						</div>
+					</div>
+					<div class="col-sm-6">
+						<div class="form-group prepend-icon">
+							<label for="inputEmail" class="field-icon">
+								<i class="fas fa-envelope"></i>
+							</label>
+							<input type="email" name="email" id="inputEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$clientsdetails.email}">
+						</div>
+					</div>
+					<div class="col-sm-6">
+						<div class="form-group prepend-icon">
+							<label for="inputPhone" class="field-icon">
+								<i class="fas fa-phone"></i>
+							</label>
+							<input type="tel" name="phonenumber" id="inputPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$clientsdetails.phonenumber}">
+						</div>
+					</div>
+				</div>
+				</div>
+
+				<h4>{$LANG.orderForm.billingAddress}</h4>
+
+				<div class="TM-card">
+				<div class="row">
+					<div class="col-sm-12">
+						<div class="form-group prepend-icon">
+							<label for="inputCompanyName" class="field-icon">
+								<i class="fas fa-building"></i>
+							</label>
+							<input type="text" name="companyname" id="inputCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$clientsdetails.companyname}">
+						</div>
+					</div>
+					<div class="col-sm-12">
+						<div class="form-group prepend-icon">
+							<label for="inputAddress1" class="field-icon">
+								<i class="fas fa-building"></i>
+							</label>
+							<input type="text" name="address1" id="inputAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$clientsdetails.address1}">
+						</div>
+					</div>
+					<div class="col-sm-12">
+						<div class="form-group prepend-icon">
+							<label for="inputAddress2" class="field-icon">
+								<i class="fas fa-map-marker-alt"></i>
+							</label>
+							<input type="text" name="address2" id="inputAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$clientsdetails.address2}">
+						</div>
+					</div>
+					<div class="col-sm-4">
+						<div class="form-group prepend-icon">
+							<label for="inputCity" class="field-icon">
+								<i class="fas fa-building"></i>
+							</label>
+							<input type="text" name="city" id="inputCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$clientsdetails.city}">
+						</div>
+					</div>
+					<div class="col-sm-5">
+						<div class="form-group prepend-icon">
+							<label for="state" class="field-icon" id="inputStateIcon">
+								<i class="fas fa-map-signs"></i>
+							</label>
+							<label for="stateinput" class="field-icon" id="inputStateIcon">
+								<i class="fas fa-map-signs"></i>
+							</label>
+							<input type="text" name="state" id="inputState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$clientsdetails.state}">
+						</div>
+					</div>
+					<div class="col-sm-3">
+						<div class="form-group prepend-icon">
+							<label for="inputPostcode" class="field-icon">
+								<i class="fas fa-certificate"></i>
+							</label>
+							<input type="text" name="postcode" id="inputPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$clientsdetails.postcode}">
+						</div>
+					</div>
+					<div class="col-sm-12">
+						<div class="form-group prepend-icon">
+							<label for="inputCountry" class="field-icon" id="inputCountryIcon">
+								<i class="fas fa-globe"></i>
+							</label>
+							<select name="country" id="inputCountry" class="field form-control">
+								{foreach $countries as $countrycode => $countrylabel}
+									<option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
+										{$countrylabel}
+									</option>
+								{/foreach}
+							</select>
+						</div>
+					</div>
+					{if $showTaxIdField}
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputTaxId" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="tax_id" id="inputTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$clientsdetails.tax_id}">
+							</div>
+						</div>
+					{/if}
+				</div>
+				</div>
+
+				{if $customfields}
+					<h4>{$LANG.orderadditionalrequiredinfo} <i><small class="text-muted">{lang key='orderForm.requiredField'}</small></i></h4>
+					<div class="TM-card">
+					<div class="row">
+						{foreach from=$customfields key=num item=customfield}
+							<div class="col-sm-12">
+								<div class="form-group">
+									{if $customfield.type eq 'tickbox'}
+										<label class=checkbox-inline" for="customfield{$customfield.id}">
+											{$customfield.input}
+											{$customfield.name} {$customfield.required}
+										</lable>
+									{if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
+									{else}
+										<label for="customfield{$customfield.id}">{$customfield.name} {$customfield.required}</label>
+										{if $customfield.type eq "link"}
+											<div class="input-group-prepend">
+												<span class="input-group-text" id="customfield{$customfield.id}"><i class="fas fa-link"></i></span>
+												{$customfield.input}
+											</div>
+										{else}
+											{$customfield.input}
+										{/if}
+										{if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
+									{/if}
+								</div>
+							</div>
+						{/foreach}
+					</div>
+					</div>
+				{/if}
+			</div>
+
+			{if $domainsinorder}
+				<h4>{$LANG.domainregistrantinfo}</h4>
+				<div class="TM-card">
+				<p class="small text-muted">{$LANG.orderForm.domainAlternativeContact}</p>
+				<div class="row margin-bottom">
+                    <div class="col-sm-12">
+                        <select name="contact" id="inputDomainContact" class="field form-control">
+                            <option value="">{$LANG.usedefaultcontact}</option>
+                            {foreach $domaincontacts as $domcontact}
+                            <option value="{$domcontact.id}"{if $contact == $domcontact.id} selected{/if}>
+                                {$domcontact.name}
+                            </option>
+                            {/foreach}
+                            <option value="addingnew"{if $contact == "addingnew"} selected{/if}>
+                                {$LANG.clientareanavaddcontact}...
+                            </option>
+                        </select>
+					</div>
+				</div>
+				</div>
+                <div class="TM-card{if $contact neq "addingnew"} w-hidden{/if}">
+                    <div class="row" id="domainRegistrantInputFields">
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputDCFirstName" class="field-icon">
+                                    <i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="domaincontactfirstname" id="inputDCFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$domaincontact.firstname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCLastName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="domaincontactlastname" id="inputDCLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$domaincontact.lastname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCEmail" class="field-icon">
+									<i class="fas fa-envelope"></i>
+								</label>
+								<input type="email" name="domaincontactemail" id="inputDCEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$domaincontact.email}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCPhone" class="field-icon">
+									<i class="fas fa-phone"></i>
+								</label>
+								<input type="tel" name="domaincontactphonenumber" id="inputDCPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$domaincontact.phonenumber}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCompanyName" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactcompanyname" id="inputDCCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$domaincontact.companyname}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCAddress1" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactaddress1" id="inputDCAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$domaincontact.address1}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCAddress2" class="field-icon">
+									<i class="fas fa-map-marker-alt"></i>
+								</label>
+								<input type="text" name="domaincontactaddress2" id="inputDCAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$domaincontact.address2}">
+							</div>
+						</div>
+						<div class="col-sm-4">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCity" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactcity" id="inputDCCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$domaincontact.city}">
+							</div>
+						</div>
+						<div class="col-sm-5">
+							<div class="form-group prepend-icon">
+								<label for="inputDCState" class="field-icon">
+									<i class="fas fa-map-signs"></i>
+								</label>
+								<input type="text" name="domaincontactstate" id="inputDCState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$domaincontact.state}">
+							</div>
+						</div>
+						<div class="col-sm-3">
+							<div class="form-group prepend-icon">
+								<label for="inputDCPostcode" class="field-icon">
+									<i class="fas fa-certificate"></i>
+								</label>
+								<input type="text" name="domaincontactpostcode" id="inputDCPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$domaincontact.postcode}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCountry" class="field-icon" id="inputCountryIcon">
+									<i class="fas fa-globe"></i>
+								</label>
+								<select name="domaincontactcountry" id="inputDCCountry" class="field form-control">
+									{foreach $countries as $countrycode => $countrylabel}
+										<option value="{$countrycode}"{if (!$domaincontact.country && $countrycode == $defaultcountry) || $countrycode eq $domaincontact.country} selected{/if}>
+											{$countrylabel}
+										</option>
+									{/foreach}
+								</select>
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCTaxId" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontacttax_id" id="inputDCTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$domaincontact.tax_id}">
+							</div>
+						</div>
+					</div>
+				</div>
+			{/if}
+
+			{if !$loggedin}			
+				<div id="containerNewUserSecurity"{if (!$loggedin && $custtype eq "existing") || ($remote_auth_prelinked && !$securityquestions) } class="w-hidden"{/if}>
+					<h4>{$LANG.orderForm.accountSecurity}</h4>
+					<div class="TM-card">
+					<div id="containerPassword" class="row{if $remote_auth_prelinked && $securityquestions} w-hidden{/if}">
+						<div id="passwdFeedback" style="display: none;" class="alert alert-info text-center col-sm-12"></div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputNewPassword1" class="field-icon">
+									<i class="fas fa-lock"></i>
+								</label>
+								<input type="password" name="password" id="inputNewPassword1" data-error-threshold="{$pwStrengthErrorThreshold}" data-warning-threshold="{$pwStrengthWarningThreshold}" class="field form-control" placeholder="{$LANG.clientareapassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputNewPassword2" class="field-icon">
+									<i class="fas fa-lock"></i>
+								</label>
+								<input type="password" name="password2" id="inputNewPassword2" class="field form-control" placeholder="{$LANG.clientareaconfirmpassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<button type="button" class="btn btn-default btn-sm generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
+								{$LANG.generatePassword.btnLabel}
+							</button>
+						</div>
+						<div class="col-sm-6">
+							<div class="password-strength-meter">
+								<div class="progress">
+									<div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="passwordStrengthMeterBar"></div>
+								</div>
+								<p class="text-center small text-muted" id="passwordStrengthTextLabel">{$LANG.pwstrength}: {$LANG.pwstrengthenter}</p>
+							</div>
+						</div>
+					</div>
+					</div>
+					
+					
+					{if $securityquestions}
+						<div class="TM-card">
+						<div class="row">
+							<div class="col-sm-12">
+								<div class="form-group">
+									<select name="securityqid" id="inputSecurityQId" class="field form-control">
+										<option value="">{$LANG.clientareasecurityquestion}</option>
+										{foreach $securityquestions as $question}
+										<option value="{$question.id}"{if $question.id eq $securityqid} selected{/if}>
+											{$question.question}
+										</option>
+										{/foreach}
+									</select>
+								</div>
+							</div>
+							<div class="col-sm-12">
+								<div class="form-group prepend-icon">
+									<label for="inputSecurityQAns" class="field-icon">
+										<i class="fas fa-lock"></i>
+									</label>
+									<input type="password" name="securityqans" id="inputSecurityQAns" class="field form-control" placeholder="{$LANG.clientareasecurityanswer}">
+								</div>
+							</div>
+						</div>
+						</div>
+					{/if}
+				</div>
+			{/if}
+
+			{foreach $hookOutput as $output}
+				<div style="margin:60px 0;">
+					{$output}
+				</div>
+			{/foreach}
+
+
+			<h4>{$LANG.orderForm.paymentDetails}</h4>
+			<p class="small text-muted margin-bottom">{$LANG.orderForm.preferredPaymentMethod}</p>
+
+			<div id="applyCreditContainer" class="apply-credit-container{if !$canUseCreditOnCheckout} w-hidden{/if}" data-apply-credit="{$applyCredit}">
+				<div class="p-3 border rounded mb-3">
+					<p class="fw-500 text-muted mb-1 small">{lang key='availcreditbal'}:</p>
+					<span class="h2 fw-500 mt-0">{$creditBalance}</span>
+				</div>
+				<label class="radio">
+					<input id="useCreditOnCheckout" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
+					<span id="spanFullCredit"{if !($creditBalance->toNumeric() >= $total->toNumeric())} class="w-hidden"{/if}>
+						{lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
+					</span>
+					<span id="spanUseCredit"{if $creditBalance->toNumeric() >= $total->toNumeric()} class="w-hidden"{/if}>
+						{lang key='cart.applyCreditAmount' amount=$creditBalance}
+					</span>
+				</label>
+				<label class="radio">
+					<input id="skipCreditOnCheckout" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
+					{lang key='cart.applyCreditSkip' amount=$creditBalance}
+				</label>
+			</div>
+
+			{if !$inExpressCheckout}
+				<div id="paymentGatewaysContainer" class="form-group">
+					<div class="TM-card" id="cros-payment-gateway">
+						{foreach $gateways as $gateway}
+							<label class="radio-inline{if $selectedgateway eq $gateway.sysname} is-selected{/if}" id="lbl-{$gateway.sysname}" onclick="getApply('{$gateway.sysname}')">
+								<span>
+									<input type="radio" onclick="getApply(this.value)"
+										name="paymentmethod"
+										value="{$gateway.sysname}"
+										data-payment-type="{$gateway.payment_type}"
+										data-show-local="{$gateway.show_local_cards}"
+										data-remote-inputs="{$gateway.uses_remote_inputs}"
+										class="payment-methods{if $gateway.type eq "CC"} is-credit-card{/if}"
+										{if $selectedgateway eq $gateway.sysname} checked{/if}
+										/>
+									<span class="check-label">{$gateway.name}</span>
+								</span>
+								{assign var=gatewayIcon value=$gateway.sysname|lower|replace:" ":"-"}
+								{if file_exists("templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png")}     
+									<span class="check-icon">
+										{if file_exists("templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png")}
+											<img src="templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png" alt="{$gateway.name}" />
+										{else}
+											<img src="templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png" alt="{$gateway.name}" />
+										{/if}
+									</span>
+								{/if}								
+							</label>
+						{/foreach}
+					</div>
+				</div>
+
+				<div class="alert alert-danger text-center gateway-errors w-hidden"></div>
+				<div class="clearfix"></div>
+
+				<div class="cc-input-container{if $selectedgatewaytype neq "CC"} w-hidden{/if}" id="creditCardInputFields">
+					{if $client}
+						<div id="existingCardsContainer" class="existing-cc-grid">
+							{include file="orderforms/{$carttpl}/includes/existing-paymethods.tpl"}
+						</div>
+					{/if}
+					<div class="row cvv-input" id="existingCardInfo">
+						<div class="col-lg-3 col-sm-4">
+							<div class="form-group prepend-icon">
+								<label for="inputCardCVV2" class="field-icon">
+									<i class="fas fa-barcode"></i>
+								</label>
+								<div class="input-group">
+									<input type="tel" name="cccvv" id="inputCardCVV2" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+									<span class="input-group-btn input-group-append">
+										<button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+                                                    ?
+										</button>
+									</span>
+								</div>
+								<span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+							</div>
+						</div>
+					</div>
+
+					<ul>
+						<li>
+							<label class="radio-inline py-2 px-3 border rounded w-100">
+								<input type="radio" name="ccinfo" value="new" id="new" {if !$client || $client->payMethods->count() === 0} checked="checked"{/if} />
+								&nbsp;{lang key='creditcardenternewcard'}
+							</label>
+						</li>
+					</ul>
+
+					<div class="row" id="newCardInfo">
+						<div id="cardNumberContainer" class="col-sm-6 new-card-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardNumber" class="field-icon">
+									<i class="fas fa-credit-card"></i>
+								</label>
+								<input type="tel" name="ccnumber" id="inputCardNumber" class="form-control field cc-number-field" placeholder="{$LANG.orderForm.cardNumber}" autocomplete="cc-number" data-message-unsupported="{lang key='paymentMethodsManage.unsupportedCardType'}" data-message-invalid="{lang key='paymentMethodsManage.cardNumberNotValid'}" data-supported-cards="{$supportedCardTypes}" />
+								<span class="field-error-msg"></span>
+							</div>
+						</div>
+						<div class="col-sm-3 new-card-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardExpiry" class="field-icon">
+									<i class="fas fa-calendar-alt"></i>
+								</label>
+								<input type="tel" name="ccexpirydate" id="inputCardExpiry" class="field form-control" placeholder="MM / YY{if $showccissuestart} ({$LANG.creditcardcardexpires}){/if}" autocomplete="cc-exp">
+								<span class="field-error-msg">{lang key="paymentMethodsManage.expiryDateNotValid"}</span>
+							</div>
+						</div>
+						<div class="col-sm-3" id="cvv-field-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardCVV" class="field-icon">
+									<i class="fas fa-barcode"></i>
+								</label>
+								<div class="input-group">
+									<input type="tel" name="cccvv" id="inputCardCVV" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+									<span class="input-group-btn input-group-append">
+									<button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+										?
+									</button>
+									</span><br>
+								</div>
+								<span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+							</div>
+						</div>
+						{if $showccissuestart}
+							<div class="col-sm-3 col-sm-offset-6 new-card-container">
+								<div class="form-group prepend-icon">
+									<label for="inputCardStart" class="field-icon">
+										<i class="far fa-calendar-check"></i>
+									</label>
+									<input type="tel" name="ccstartdate" id="inputCardStart" class="field form-control" placeholder="MM / YY ({$LANG.creditcardcardstart})" autocomplete="cc-exp">
+								</div>
+							</div>
+							<div class="col-sm-3 new-card-container">
+								<div class="form-group prepend-icon">
+									<label for="inputCardIssue" class="field-icon">
+										<i class="fas fa-asterisk"></i>
+									</label>
+									<input type="tel" name="ccissuenum" id="inputCardIssue" class="field form-control" placeholder="{$LANG.creditcardcardissuenum}">
+								</div>
+							</div>
+						{/if}
+					</div>
+					<div id="newCardSaveSettings">
+						<div class="row form-group new-card-container">
+							<div id="inputDescriptionContainer" class="col-md-6">
+								<div class="prepend-icon">
+									<label for="inputDescription" class="field-icon">
+										<i class="fas fa-pencil"></i>
+									</label>
+									<input type="text" class="field form-control" id="inputDescription" name="ccdescription" autocomplete="off" value="" placeholder="{$LANG.paymentMethods.descriptionInput} {$LANG.paymentMethodsManage.optional}" />
+								</div>
+							</div>
+							{if $allowClientsToRemoveCards}
+								<div id="inputNoStoreContainer" class="col-md-6" style="line-height: 32px;">
+									<input type="hidden" name="nostore" value="1">
+									<input type="checkbox" class="toggle-switch-success no-icheck" data-size="mini" checked="checked" name="nostore" id="inputNoStore" value="0" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
+									<label for="inputNoStore" class="checkbox-inline no-padding">
+										&nbsp;&nbsp;
+										{$LANG.creditCardStore}
+									</label>
+								</div>
+							{/if}
+						</div>
+					</div>
+				</div>
+			{else}
+				{if $expressCheckoutOutput}
+					{$expressCheckoutOutput}
+				{else}
+					<p align="center">
+						{lang key='paymentPreApproved' gateway=$expressCheckoutGateway}
+					</p>
+				{/if}
+			{/if}
+
+			{if $shownotesfield}
+				<h4>{$LANG.orderForm.additionalNotes}</h4>
+				<div class="TM-card">
+				<div class="row">
+					<div class="col-sm-12">
+						<div class="form-group">
+							<textarea name="notes" class="field form-control" rows="4" placeholder="{$LANG.ordernotesdescription}">{$orderNotes}</textarea>
+						</div>
+					</div>
+				</div>
+				</div>
+			{/if}
+
+			{if $showMarketingEmailOptIn}
+				<h4>{lang key='emailMarketing.joinOurMailingList'}</h4>
+				<div class="TM-card">
+					<p>{$marketingEmailOptInMessage}</p>
+					<div class="panel panel-switch {if $marketingEmailOptIn} checked{/if}">
+						<div class="panel-body">
+							<span class="switch-label">{lang key='emailMarketing.joinOurMailingList'}:</span>
+							<label class="switch switch--text">
+								<input class="no-icheck switch__checkbox" type="checkbox" name="marketingoptin" value="1"{if $marketingEmailOptIn} checked{/if}>
+								<span class="switch__container"><span class="switch__handle"></span></span>
+							</label> 
+						</div>
+					</div>
+				</div>
+			{/if}
+
+
+			<div class="text-center">
+				{if $accepttos}
+					<p>
+						<label class="checkbox-inline">
+							<input type="checkbox" name="accepttos" id="accepttos" />
+							&nbsp; {$LANG.ordertosagreement} <a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
+						</label>
+					</p>
+				{/if}
+						
+				{if $captcha}
+					<div class="text-center margin-bottom">
+						{include file="$template/includes/captcha.tpl"}
+					</div>
+				{/if}
+
+				<button type="submit"
+					id="btnCompleteOrder"
+						class="margin-bottom btn btn-primary btn-lg disable-on-click spinner-on-click{if $captcha}{$captcha->getButtonClass($captchaForm)}{/if}"
+						{if $cartitems==0}disabled="disabled"{/if}
+						>
+					{if $inExpressCheckout}{$LANG.confirmAndPay}{else}{$LANG.completeorder}{/if}
+					&nbsp;<i class="fas fa-arrow-circle-right"></i>
+                </button>
+            </div>
+        </form>
+
+    </div>
+</div>
+
+<script type="text/javascript" src="{$BASE_PATH_JS}/jquery.payment.js"></script>
+<script>
+    var hideCvcOnCheckoutForExistingCard = '{if $canUseCreditOnCheckout && $applyCredit && ($creditBalance->toNumeric() >= $total->toNumeric())}1{else}0{/if}';
+
+	jQuery(document).ready(function() {
+		jQuery('.existing-card').change('ifChecked', function (event) {
+			 $(this).closest(".card-item").toggleClass('selected', this.checked);
+		});
+	});	
+	
+</script>
+{include file="orderforms/$carttpl/recommendations-modal.tpl"}

includes/checkout/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

includes/checkout/spc.tpl

@@ -0,0 +1,907 @@
+<script>
+	// Define state tab index value
+	var statesTab = 10;
+	// Do not enforce state input client side
+	var stateNotRequired = true;
+</script>
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/intlTelInput.min.js"></script>
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.min.js?v={$versionHash}"></script>
+<script type="text/javascript" src="{$BASE_PATH_JS}/StatesDropdown.js"></script>
+<script type="text/javascript" src="{$BASE_PATH_JS}/PasswordStrength.js"></script>
+
+<script>
+	window.langPasswordStrength = "{$LANG.pwstrength}";
+	window.langPasswordWeak = "{$LANG.pwstrengthweak}";
+	window.langPasswordModerate = "{$LANG.pwstrengthmoderate}";
+	window.langPasswordStrong = "{$LANG.pwstrengthstrong}";
+</script>
+
+{if $errormessage}
+	<div class="alert alert-danger checkout-error-feedback" role="alert">
+		<p>{$LANG.orderForm.correctErrors}:</p>
+		<ul>
+			{$errormessage}
+		</ul>
+	</div>
+	<div class="clearfix"></div>
+{/if}
+
+<form method="post" name="orderfrm" id="frmCheckout">
+	<input type="hidden" name="submit" value="true" />
+	<input type="hidden"  id="loggedin" value="{$loggedin}" />
+	<input type="hidden" name="custtype" id="inputCustType" value="{$custtype}" />
+
+	<div id="customer_error">
+		<div class="customer_error" style="display: none;"></div>
+	</div>
+	
+	<div class="TM-card blocks customerinfo">
+		<div class="blocks_heading">
+			<h2>{$LANG.billingdetails}</h2>
+		</div>
+		<div class="blocks_body" id="customer_info">
+		
+			{if $custtype neq "new" && $loggedin}
+				<div class="sub-heading">
+					<span>
+						{lang key='switchAccount.title'}
+					</span>
+				</div>
+				<div id="containerExistingAccountSelect" class="row account-select-container">
+					{foreach $accounts as $account}
+						<div class="col-sm-{if $accounts->count() == 1}12{else}6{/if}">
+							<div class="account{if $selectedAccountId == $account->id} active{/if}">
+								<label class="radio-inline" for="account{$account->id}">
+									<input id="account{$account->id}" class="account-select{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled{/if}" type="radio" name="account_id" value="{$account->id}"{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled="disabled"{/if}{if $selectedAccountId == $account->id} checked="checked"{/if}>
+									<span class="address">
+										<strong>
+											{if $account->companyname}{$account->companyname}{else}{$account->fullName}{/if}
+										</strong>
+										{if $account->isClosed || $account->noPermission}
+											<span class="label label-default">
+												{if $account->isClosed}
+													{lang key='closed'}
+												{else}
+													{lang key='noPermission'}
+												{/if}
+											</span>
+										{elseif $account->currencyCode}
+											<span class="label label-info">
+												{$account->currencyCode}
+											</span>
+										{/if}
+										<br>
+										<span class="small">
+											{$account->address1}{if $account->address2}, {$account->address2}{/if}<br>
+											{if $account->city}{$account->city},{/if}
+											{if $account->state} {$account->state},{/if}
+											{if $account->postcode} {$account->postcode},{/if}
+											{$account->countryName}
+										</span>
+									</span>
+								</label>
+							</div>
+						</div>
+					{/foreach}
+					<div class="col-sm-12">
+						<div class="account border-bottom{if !$selectedAccountId || !is_numeric($selectedAccountId)} active{/if}">
+							<label class="radio-inline">
+								<input class="account-select" type="radio" name="account_id" value="new"{if !$selectedAccountId || !is_numeric($selectedAccountId)} checked="checked"{/if}{if $inExpressCheckout} disabled="disabled" class="disabled"{/if}>
+								{lang key='orderForm.createAccount'}
+							</label>
+						</div>
+					</div>
+				</div>
+			{/if}
+			{if !$loggedin}
+				<div class="user_option">
+					<ul>
+						<li>
+							<label for="newcust">
+								<input type="radio" class="no-icheck signups" value="new" name="custtype" {if !$loggedin && $custtype neq "existing"}checked="checked"{/if} id="newcust" onclick="togglesignupform(this);"/>
+								<span class="sign-btn">{$LANG.orderForm.createAccount}</span>
+							</label>
+						</li>
+						<li>
+							<label for="existingcust">
+								<input type="radio" class="no-icheck signups" value="existing" name="custtype" {if $custtype eq "existing" && !$loggedin || $loggedin}checked="checked"{/if} id="existingcust" onclick="togglesignupform(this);"/>
+								<span class="sign-btn">{$LANG.orderForm.alreadyRegistered}</span>
+							</label>
+						</li>
+					</ul>
+				</div>
+			{/if}
+			<div class="signupfields signupfields-existing{if $custtype eq "existing" && !$loggedin}{else} w-hidden{/if}" id="loginfrm">             
+				
+				<h5>{$LANG.orderForm.existingCustomerLogin}</h5>
+				
+				<div class="row">
+					<div class="col-md-5">
+						<div class="form-group prepend-icon">
+							<label for="inputLoginEmail" class="field-icon">
+								<i class="fas fa-envelope"></i>
+							</label>
+							<input type="text" name="loginemail" id="inputLoginEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$loginemail}">
+						</div>
+					</div>
+					<div class="col-md-5">
+						<div class="form-group prepend-icon">
+							<label for="inputLoginPassword" class="field-icon">
+								<i class="fas fa-lock"></i>
+							</label>
+							<input type="password" name="loginpassword" id="inputLoginPassword" class="field form-control" placeholder="{$LANG.clientareapassword}">
+						</div>
+					</div>
+					<div class="col-md-2">
+						<button type="button" id="btnExistingLogin" class="btn btn-primary btn-md btn-block">
+							<span id="existingLoginButton">{lang key='login'}</span>
+							<span id="existingLoginPleaseWait" class="w-hidden"><i class="fad fa-circle-notch fa-spin"></i></span>
+						</button>
+					</div>
+				</div>
+
+				{include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-existing"}
+			</div>    
+		
+			{if $loggedin}
+			<div id="containerNewUserSignup" class="signupfields{if $custtype === 'existing' || (is_numeric($selectedAccountId) && $selectedAccountId > 0) || ($loggedin && $accounts->count() > 0 && $selectedAccountId !== 'new')} w-hidden{/if}">
+			{else}
+			<div class="signupfields{if $custtype eq "existing" && !$loggedin} w-hidden{/if}" id="signupfrm">
+			{/if}
+					<div{if $loggedin} class="w-hidden"{/if}>
+						{include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-new"}
+					</div>
+
+
+					<h5>{$LANG.orderForm.personalInformation}</h5>
+
+					<div class="row">
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputFirstName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="firstname" id="inputFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$clientsdetails.firstname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputLastName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="lastname" id="inputLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$clientsdetails.lastname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputEmail" class="field-icon">
+									<i class="fas fa-envelope"></i>
+								</label>
+								<input type="email" name="email" id="inputEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$clientsdetails.email}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputPhone" class="field-icon">
+									<i class="fas fa-phone"></i>
+								</label>
+								<input type="tel" name="phonenumber" id="inputPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$clientsdetails.phonenumber}">
+							</div>
+						</div>
+					</div>
+
+					<h5>{$LANG.orderForm.billingAddress}</h5>
+
+					<div class="row">
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputCompanyName" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="companyname" id="inputCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$clientsdetails.companyname}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputAddress1" class="field-icon">
+									<i class="far fa-building"></i>
+								</label>
+								<input type="text" name="address1" id="inputAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$clientsdetails.address1}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputAddress2" class="field-icon">
+									<i class="fas fa-map-marker-alt"></i>
+								</label>
+								<input type="text" name="address2" id="inputAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$clientsdetails.address2}">
+							</div>
+						</div>
+						<div class="col-sm-4">
+							<div class="form-group prepend-icon">
+								<label for="inputCity" class="field-icon">
+									<i class="far fa-building"></i>
+								</label>
+								<input type="text" name="city" id="inputCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$clientsdetails.city}">
+							</div>
+						</div>
+						<div class="col-sm-5">
+							<div class="form-group prepend-icon">
+								<label for="state" class="field-icon" id="inputStateIcon">
+									<i class="fas fa-map-signs"></i>
+								</label>
+								<label for="stateinput" class="field-icon" id="inputStateIcon">
+									<i class="fas fa-map-signs"></i>
+								</label>
+								<input type="text" name="state" id="inputState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$clientsdetails.state}">
+							</div>
+						</div>
+						<div class="col-sm-3">
+							<div class="form-group prepend-icon">
+								<label for="inputPostcode" class="field-icon">
+									<i class="fas fa-certificate"></i>
+								</label>
+								<input type="text" name="postcode" id="inputPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$clientsdetails.postcode}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputCountry" class="field-icon" id="inputCountryIcon">
+									<i class="fas fa-globe"></i>
+								</label>
+								 <select name="country" id="inputCountry" class="field form-control">
+									{foreach $countries as $countrycode => $countrylabel}
+										<option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
+											{$countrylabel}
+										</option>
+									{/foreach}
+								</select>
+							</div>
+						</div>
+						{if $showTaxIdField}
+							<div class="col-12">
+								<div class="form-group prepend-icon">
+									<label for="inputTaxId" class="field-icon">
+										<i class="fas fa-building"></i>
+									</label>
+									<input type="text" name="tax_id" id="inputTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$clientsdetails.tax_id}">
+								</div>
+							</div>
+						{/if}
+					</div>
+
+					{if $customfields}
+
+						<h5>{$LANG.orderadditionalrequiredinfo} <i><small class="text-muted">{lang key='orderForm.requiredField'}</small></i></h5>
+						<div class="row">
+							{foreach $customfields as $customfield}
+								<div class="col-12">
+									<div class="form-group">
+										{if $customfield.type eq 'tickbox'}
+											<label class=checkbox-inline" for="customfield{$customfield.id}">
+												{$customfield.input}
+												{$customfield.name} {$customfield.required}
+											</lable>
+											{if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
+										 {else}
+											<label for="customfield{$customfield.id}">{$customfield.name} {$customfield.required}</label>
+											{if $customfield.type eq "link"}
+											   <div class="input-group-prepend">
+													<span class="input-group-text" id="customfield{$customfield.id}"><i class="fas fa-link"></i></span>
+													{$customfield.input}
+												</div>
+											{else}
+												{$customfield.input}
+											{/if}
+											{if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
+										 {/if}
+									</div>
+								</div>
+							{/foreach}
+						</div>
+					{/if}
+
+			</div>
+			
+			<div class="domain_config pl-3 pr-3 {if $domainsinorder}{else} w-hidden{/if}">
+
+					<h5>{$LANG.domainregistrantinfo}</h5>
+
+					<p class="small text-muted">{$LANG.orderForm.domainAlternativeContact}</p>
+
+					<div class="row margin-bottom">
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCFirstName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>				
+								<select name="contact" id="inputDomainContact" class="field form-control">
+									<option value="">{$LANG.usedefaultcontact}</option>
+									{foreach $domaincontacts as $domcontact}
+										<option value="{$domcontact.id}"{if $contact == $domcontact.id} selected{/if}>
+											{$domcontact.name}
+										</option>
+									{/foreach}
+									<option value="addingnew"{if $contact == "addingnew"} selected{/if}>
+										{$LANG.clientareanavaddcontact}...
+									</option>
+								</select>
+							</div>
+						</div>
+					</div>
+
+					<div class="row{if $contact neq "addingnew"} w-hidden{/if}" id="domainRegistrantInputFields">
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCFirstName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="domaincontactfirstname" id="inputDCFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$domaincontact.firstname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCLastName" class="field-icon">
+									<i class="fas fa-user"></i>
+								</label>
+								<input type="text" name="domaincontactlastname" id="inputDCLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$domaincontact.lastname}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCEmail" class="field-icon">
+									<i class="fas fa-envelope"></i>
+								</label>
+								<input type="email" name="domaincontactemail" id="inputDCEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$domaincontact.email}">
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputDCPhone" class="field-icon">
+									<i class="fas fa-phone"></i>
+								</label>
+								<input type="tel" name="domaincontactphonenumber" id="inputDCPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$domaincontact.phonenumber}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCompanyName" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactcompanyname" id="inputDCCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$domaincontact.companyname}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCAddress1" class="field-icon">
+									<i class="far fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactaddress1" id="inputDCAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$domaincontact.address1}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCAddress2" class="field-icon">
+									<i class="fas fa-map-marker-alt"></i>
+								</label>
+								<input type="text" name="domaincontactaddress2" id="inputDCAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$domaincontact.address2}">
+							</div>
+						</div>
+						<div class="col-sm-4">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCity" class="field-icon">
+									<i class="far fa-building"></i>
+								</label>
+								<input type="text" name="domaincontactcity" id="inputDCCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$domaincontact.city}">
+							</div>
+						</div>
+						<div class="col-sm-5">
+							<div class="form-group prepend-icon">
+								<label for="inputDCState" class="field-icon">
+									<i class="fas fa-map-signs"></i>
+								</label>
+								<input type="text" name="domaincontactstate" id="inputDCState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$domaincontact.state}">
+							</div>
+						</div>
+						<div class="col-sm-3">
+							<div class="form-group prepend-icon">
+								<label for="inputDCPostcode" class="field-icon">
+									<i class="fas fa-certificate"></i>
+								</label>
+								<input type="text" name="domaincontactpostcode" id="inputDCPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$domaincontact.postcode}">
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCCountry" class="field-icon" id="inputCountryIcon">
+									<i class="fas fa-globe"></i>
+								</label>
+								<select name="domaincontactcountry" id="inputDCCountry" class="field form-control">
+									{foreach $countries as $countrycode => $countrylabel}
+										<option value="{$countrycode}"{if (!$domaincontact.country && $countrycode == $defaultcountry) || $countrycode eq $domaincontact.country} selected{/if}>
+											{$countrylabel}
+										</option>
+									{/foreach}
+								</select>
+							</div>
+						</div>
+						<div class="col-sm-12">
+							<div class="form-group prepend-icon">
+								<label for="inputDCTaxId" class="field-icon">
+									<i class="fas fa-building"></i>
+								</label>
+								<input type="text" name="domaincontacttax_id" id="inputDCTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$domaincontact.tax_id}">
+							</div>
+						</div>
+					</div>
+
+			</div>
+		</div>
+	</div>
+
+	{if !$loggedin}
+		<div id="containerNewUserSecurity"{if (!$loggedin && $custtype eq "existing") || ($remote_auth_prelinked && !$securityquestions) } class="w-hidden"{/if}>
+			<div class="TM-card blocks accountpw">
+				<div class="blocks_heading">
+					<h2>{$LANG.orderForm.accountSecurity}</h2>
+				</div>
+				<div class="blocks_body" id="account_pw">
+
+					<div id="containerPassword" class="row{if $remote_auth_prelinked && $securityquestions} w-hidden{/if}">
+						<div id="passwdFeedback" style="display: none;" class="alert alert-info text-center col-sm-12"></div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputNewPassword1" class="field-icon">
+									<i class="fas fa-lock"></i>
+								</label>
+								<input type="password" name="password" id="inputNewPassword1" data-error-threshold="{$pwStrengthErrorThreshold}" data-warning-threshold="{$pwStrengthWarningThreshold}" class="field form-control" placeholder="{$LANG.clientareapassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<div class="form-group prepend-icon">
+								<label for="inputNewPassword2" class="field-icon">
+									<i class="fas fa-lock"></i>
+								</label>
+								<input type="password" name="password2" id="inputNewPassword2" class="field form-control" placeholder="{$LANG.clientareaconfirmpassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+							</div>
+						</div>
+						<div class="col-sm-6">
+							<button type="button" class="btn btn-default btn-sm generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
+								{$LANG.generatePassword.btnLabel}
+							</button>
+						</div>
+						<div class="col-sm-6">
+							<div class="password-strength-meter">
+								<div class="progress">
+									<div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="passwordStrengthMeterBar">
+									</div>
+								</div>
+								<p class="text-center small text-muted" id="passwordStrengthTextLabel">{$LANG.pwstrength}: {$LANG.pwstrengthenter}</p>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			{if $securityquestions}
+				<div class="TM-card blocks securityques">
+					<div class="blocks_body" id="securityQuestion">
+						{if !$loggedin}
+							<div class="row">
+								<div class="col-sm-6">
+									<div class="form-group">
+										<select name="securityqid" id="inputSecurityQId" class="field form-control">
+											<option value="">{$LANG.clientareasecurityquestion}</option>
+											{foreach $securityquestions as $question}
+												<option value="{$question.id}"{if $question.id eq $securityqid} selected{/if}>
+													{$question.question}
+												</option>
+											{/foreach}
+										</select>
+									</div>
+								</div>
+								<div class="col-sm-6">
+									<div class="form-group prepend-icon">
+										<label for="inputSecurityQAns" class="field-icon">
+											<i class="fas fa-lock"></i>
+										</label>
+										<input type="password" name="securityqans" id="inputSecurityQAns" class="field form-control" placeholder="{$LANG.clientareasecurityanswer}">
+									</div>
+								</div>
+							</div>
+						{/if}
+					</div>
+				</div>
+			{/if}
+		</div>
+	{/if}
+
+	<div class="blocks paymentinfo">
+		{* <div class="blocks_heading">
+			<h2>{$LANG.orderForm.paymentDetails}</h2>
+		</div>
+		*}
+		<div class="blocks_body" id="payment_info">
+
+			{if $canUseCreditOnCheckout}
+				<div id="applyCreditContainer" class="apply-credit-container" data-apply-credit="{$applyCredit}">		
+					<div class="p-3 border rounded mb-3">
+						<p class="fw-500 text-muted mb-1 small">{lang key='availcreditbal'}:</p>
+						<span class="h2 fw-500 mt-0">{$creditBalance}</span>
+					</div>
+					{if $creditBalance->toNumeric() >= $total->toNumeric()}
+						<label class="radio">
+							<input id="useFullCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
+							{lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
+						</label>
+					{else}
+						<label class="radio">
+							<input id="useCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
+							{lang key='cart.applyCreditAmount' amount=$creditBalance}
+						</label>
+					{/if}
+					<label class="radio">
+						<input id="skipCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
+						{lang key='cart.applyCreditSkip' amount=$creditBalance}
+					</label>
+				</div>
+			{/if}
+
+			{if !$inExpressCheckout}
+				<div id="paymentGatewaysContainer" class="form-group"{if $canUseCreditOnCheckout} style="display: none;"{/if}>
+					<h4>{$LANG.orderpaymentmethod}</h4>
+					<div class="TM-card" id="cros-payment-gateway">
+						{foreach $gateways as $gateway}
+							<label class="radio-inline{if $selectedgateway eq $gateway.sysname} is-selected{/if}" id="lbl-{$gateway.sysname}" onclick="getApply('{$gateway.sysname}')">
+								<span>
+									<input type="radio" onclick="getApply(this.value)"
+									   name="paymentmethod"
+									   value="{$gateway.sysname}"
+									   data-payment-type="{$gateway.payment_type}"
+									   data-show-local="{$gateway.show_local_cards}"
+									   data-remote-inputs="{$gateway.uses_remote_inputs}"
+									   class="payment-methods{if $gateway.type eq "CC"} is-credit-card{/if}"
+									   {if $selectedgateway eq $gateway.sysname} checked{/if}
+									   />
+								
+									<span class="check-label">{$gateway.name}</span>
+								</span>
+								{assign var=gatewayIcon value=$gateway.sysname|lower|replace:" ":"-"}
+								{if file_exists("templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png")}     
+									<span class="check-icon">
+										{if file_exists("templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png")}
+											<img src="templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png" alt="{$gateway.name}" />
+										{else}
+											<img src="templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png" alt="{$gateway.name}" />
+										{/if}
+									</span>
+								{/if}
+								
+							</label>
+						{/foreach}
+						{foreach from=$gatewaysoutput item=gatewayname key=wskey}
+							{if $gatewayname|strstr:"paypalcheckout"} 
+								<label class="radio-inline">
+									<input type="radio" name="paymentmethod" value="paypalexpress" data-payment-type="Invoices" data-show-local="" data-remote-inputs="" class="payment-methods">
+									PayPal Express Checkout
+								</label>
+							{/if}
+						{/foreach}
+					</div>
+				</div>
+
+				<div class="alert alert-danger text-center gateway-errors w-hidden"></div>
+
+				<div class="clearfix"></div>
+				
+				<div class="cc-input-container{if $selectedgatewaytype neq "CC"} w-hidden{/if}" id="creditCardInputFields">
+					{if $client}
+						<div id="existingCardsContainer" class="existing-cc-grid">
+							{include file="orderforms/{$carttpl}/includes/existing-paymethods.tpl"}
+						</div>
+					{/if}
+					<div class="row cvv-input" id="existingCardInfo">
+						<div class="col-lg-3 col-sm-4">
+							<div class="form-group prepend-icon">
+								<label for="inputCardCVV2" class="field-icon">
+									<i class="fas fa-barcode"></i>
+								</label>
+								<div class="input-group">
+									<input type="tel" name="cccvv" id="inputCardCVV2" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+									<span class="input-group-btn input-group-append">
+										<button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+											?
+										</button>
+									</span>
+								</div>
+								<span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+							</div>
+						</div>
+					</div>
+
+					<ul>
+						<li>
+							<label class="radio-inline py-2 px-3 border rounded w-100">
+								<input type="radio" name="ccinfo" value="new" id="new" {if !$client || $client->payMethods->count() === 0} checked="checked"{/if} />
+								&nbsp;{lang key='creditcardenternewcard'}
+							</label>
+						</li>
+					</ul>
+
+					<div class="row" id="newCardInfo">
+						<div id="cardNumberContainer" class="col-sm-6 new-card-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardNumber" class="field-icon">
+									<i class="fas fa-credit-card"></i>
+								</label>
+								<input type="tel" name="ccnumber" id="inputCardNumber" class="form-control field cc-number-field" placeholder="{$LANG.orderForm.cardNumber}" autocomplete="cc-number" data-message-unsupported="{lang key='paymentMethodsManage.unsupportedCardType'}" data-message-invalid="{lang key='paymentMethodsManage.cardNumberNotValid'}" data-supported-cards="{$supportedCardTypes}" />
+								<span class="field-error-msg"></span>
+							</div>
+						</div>
+						<div class="col-sm-3 new-card-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardExpiry" class="field-icon">
+									<i class="fas fa-calendar-alt"></i>
+								</label>
+								<input type="tel" name="ccexpirydate" id="inputCardExpiry" class="field form-control" placeholder="MM / YY{if $showccissuestart} ({$LANG.creditcardcardexpires}){/if}" autocomplete="cc-exp">
+								<span class="field-error-msg">{lang key="paymentMethodsManage.expiryDateNotValid"}</span>
+							</div>
+						</div>
+						<div class="col-sm-3" id="cvv-field-container">
+							<div class="form-group prepend-icon">
+								<label for="inputCardCVV" class="field-icon">
+									<i class="fas fa-barcode"></i>
+								</label>
+								<div class="input-group">
+									<input type="tel" name="cccvv" id="inputCardCVV" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+									<span class="input-group-btn input-group-append">
+										<button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+											?
+										</button>
+									</span><br>
+								</div>
+								<span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+							</div>
+						</div>
+						{if $showccissuestart}
+							<div class="col-sm-3 col-sm-offset-6 new-card-container">
+								<div class="form-group prepend-icon">
+									<label for="inputCardStart" class="field-icon">
+										<i class="far fa-calendar-check"></i>
+									</label>
+									<input type="tel" name="ccstartdate" id="inputCardStart" class="field form-control" placeholder="MM / YY ({$LANG.creditcardcardstart})" autocomplete="cc-exp">
+								</div>
+							</div>
+							<div class="col-sm-3 new-card-container">
+								<div class="form-group prepend-icon">
+									<label for="inputCardIssue" class="field-icon">
+										<i class="fas fa-asterisk"></i>
+									</label>
+									<input type="tel" name="ccissuenum" id="inputCardIssue" class="field form-control" placeholder="{$LANG.creditcardcardissuenum}">
+								</div>
+							</div>
+						{/if}
+					</div>
+					<div id="newCardSaveSettings">
+						<div class="row form-group new-card-container">
+							<div id="inputDescriptionContainer" class="col-md-6">
+								<div class="prepend-icon">
+									<label for="inputDescription" class="field-icon">
+										<i class="fas fa-pencil"></i>
+									</label>
+									<input type="text" class="field form-control" id="inputDescription" name="ccdescription" autocomplete="off" value="" placeholder="{$LANG.paymentMethods.descriptionInput} {$LANG.paymentMethodsManage.optional}" />
+								</div>
+							</div>
+							{if $allowClientsToRemoveCards}
+								<div id="inputNoStoreContainer" class="col-md-6" style="line-height: 32px;">
+									<input type="hidden" name="nostore" value="1">
+									<input type="checkbox" class="toggle-switch-success no-icheck" data-size="mini" checked="checked" name="nostore" id="inputNoStore" value="0" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
+									<label for="inputNoStore" class="checkbox-inline no-padding">
+										&nbsp;&nbsp;
+										{$LANG.creditCardStore}
+									</label>
+								</div>
+							{/if}
+						</div>
+					</div>
+				</div>
+			{else}
+				{if $expressCheckoutOutput}
+					{$expressCheckoutOutput}
+				{else}
+					<p align="center">
+						{lang key='paymentPreApproved' gateway=$expressCheckoutGateway}
+					</p>
+				{/if}
+			{/if}
+			
+		</div>
+	</div>
+</div>
+
+{if $shownotesfield}
+	<div class="TM-card blocks additionalinfo">
+		<div class="blocks_heading">
+			<h2>{$LANG.orderForm.additionalNotes}</h2>
+		</div>
+		<div class="blocks_body" id="notesfield">
+			<div class="row">
+				<div class="col-md-12">
+					<div class="form-group">
+						<textarea name="notes" class="field form-control" rows="4" placeholder="{$LANG.ordernotesdescription}">{$orderNotes}</textarea>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+{/if}
+
+{if $showMarketingEmailOptIn}
+	<div class="TM-card blocks additionalinfo">
+		<div class="blocks_body" id="MarketingEmailOptIn">
+			<p>{$marketingEmailOptInMessage}</p>
+			<div class="panel panel-switch {if $marketingEmailOptIn} checked{/if}">
+				<div class="panel-body">
+					<span class="switch-label">{lang key='emailMarketing.joinOurMailingList'}: </span>
+					<label class="switch switch--text">
+						<input class="no-icheck switch__checkbox" type="checkbox" name="marketingoptin" value="1"{if $marketingEmailOptIn} checked{/if}>
+						<span class="switch__container"><span class="switch__handle"></span></span>
+					</label> 
+				</div>
+			</div>
+		</div>
+	</div>
+{/if}
+
+{if $accepttos}
+	<div class="text-center">
+		<label class="checkbox-inline">
+			<input type="checkbox" name="accepttos" id="accepttos" />
+			{$LANG.ordertosagreement}
+			<a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
+		</label>
+	</div>
+	<br />
+{/if}
+
+{*
+{if $captcha}
+	<div class="margin-bottom">
+	   {include file="$template/includes/captcha_spc.tpl"}
+   </div>
+{/if}
+<div class="orderform_footer">
+	<div class="order_form_tos">
+		{if $accepttos}
+			<div class="text-center">
+				<label class="checkbox-inline">
+					<input type="checkbox" name="accepttos" id="accepttos" />
+					{$LANG.ordertosagreement}
+					<a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
+				</label>
+			</div>
+			<br />
+		{/if}
+	</div>
+	<div class="order_form_submit">
+		<button type="submit" id="order_submit" class="btn btn-primary btn-lg spinner-on-click{if $captcha}{$captcha->getButtonClass($captchaForm)}{/if}">{if $inExpressCheckout}{$LANG.confirmAndPay}{else}{$LANG.completeorder}{/if}&nbsp;<i class="fas fa-arrow-circle-right"></i></button>			
+	</div>
+</div>
+*}
+
+</form>
+
+{if $servedOverSsl}
+<div class="alert alert-warning small mb-5">
+	<i class="fad fa-lock-alt"></i>&nbsp;{$LANG.ordersecure} (<strong>{$ipaddress}</strong>) {$LANG.ordersecure2}
+</div>
+{/if}
+
+<script>
+jQuery(document).ready(function () {
+	var panelSwitch = $('.panel-switch');
+	panelSwitch.on('click', function (e) {
+		if (!$(this).is('a')) {
+			var currCheck = $(this).find('input[type="checkbox"]');
+			if (currCheck.is(':checked')) {
+				panelSwitch.removeClass('checked');
+				currCheck.prop('checked', false);
+			} else {
+				panelSwitch.addClass('checked');
+				currCheck.prop('checked', true);
+			}
+			var that = $(this);
+			setTimeout(function () {
+				that.find('.loader').addClass('loading');
+			}, 300);
+		}
+	});
+	
+	jQuery('.existing-card').change('ifChecked', function (event) {
+		 $(this).closest(".card-item").toggleClass('selected', this.checked);
+	});
+});
+
+// Enable Switches for Checkboxes
+if (jQuery.prototype.bootstrapSwitch) {
+	jQuery(".toggle-switch-success").bootstrapSwitch({
+		onColor: 'success'
+	});
+}
+
+jQuery('#inputNoStore').on('switchChange.bootstrapSwitch', function(event, state) {
+	var descContainer = jQuery('#inputDescription');
+	if (!state) {
+		descContainer.prop('disabled', true).addClass('disabled');
+	}
+	if (state) {
+		descContainer.removeClass('disabled').prop('disabled', false);
+	}
+});
+	
+jQuery("#inputDomainContact").on('change', function() {
+	if (this.value == "addingnew") {
+		jQuery("#domainRegistrantInputFields").hide().removeClass('w-hidden').slideDown();
+	} else {
+		jQuery(".domain_config").show().removeClass('w-hidden').slideDown();
+		jQuery("#domainRegistrantInputFields").slideUp();
+	}
+});
+
+//Gateway checkbox
+function getApply(obj){
+var vDiv=document.getElementById("cros-payment-gateway").children.length;
+	for(var i=0;i<vDiv;i++){
+		var vObje = document.getElementById("cros-payment-gateway").children[i].id;
+		if("lbl-"+obj==vObje){
+			document.getElementById("lbl-"+obj).classList.add("is-selected");
+		}
+		else{
+			document.getElementById(vObje).className ="radio-inline";
+		}	
+	} 
+}
+
+// Activate copy to clipboard functionality
+jQuery('.copy-to-clipboard').click(WHMCS.ui.clipboard.copy);
+
+// Password Generator
+jQuery('.generate-password').click(function(e) {
+	jQuery('#frmGeneratePassword').submit();
+	jQuery('#modalGeneratePassword')
+		.data('targetfields', jQuery(this).data('targetfields'))
+		.modal('show');
+});
+jQuery('#frmGeneratePassword').submit(function(e) {
+	e.preventDefault();
+	var length = parseInt(jQuery('#inputGeneratePasswordLength').val(), 10);
+
+	// Check length
+	if (length < 8 || length > 64) {
+		jQuery('#generatePwLengthError').removeClass('w-hidden').show();
+		return;
+	}
+
+	jQuery('#inputGeneratePasswordOutput').val(WHMCS.utils.generatePassword(length));
+});
+
+
+{if !$loggedin}
+if(jQuery("#inputCountry").length)
+{
+    jQuery("#inputCountry").change(function(){                        
+        setTimeout(function(){ recalcheckout(); }, 2500);
+    });
+}
+{/if}
+
+// Default catch for all other popovers
+jQuery('[data-toggle="popover"]').popover({
+	html: true
+});
+</script>
+<script>
+    $('script[src*="stripe.min.js"]').slice(1).remove();
+    $('iframe[name*="privateStripe"]').remove();
+</script>
+
+{$credit_card_input}

includes/domains/eppcode.tpl

@@ -0,0 +1,32 @@
+<div class="modal fade" id="modal-epp-code">
+    <div class="modal-dialog modal-dialog-centered">
+        <div class="modal-content">
+            <div class="modal-header d-block">
+				<h4 class="modal-title">
+					<button type="button" class="close" data-dismiss="modal" aria-label="{$LANG.orderForm.close}">
+						<span aria-hidden="true">&times;</span>
+					</button>
+					<span>{lang key='orderForm.authCode'}</span>
+				</h4>
+            </div>
+            <div class="modal-body">
+                <p>{lang key='orderForm.authCodeTooltip'}</p>
+                <div class="form-group">
+                    <label for="inputAuthCode">{lang key='orderForm.authCode'}</label>
+                    <input type="text" class="form-control" name="eppModal" data-trigger="manual" id="inputAuthCode" placeholder="{lang key='orderForm.authCodePlaceholder'}" data-toggle="tooltip" data-placement="left" title="{lang key='orderForm.required'}" />
+                </div>
+            </div>
+            <div class="modal-footer">
+				<span class="input-group-btn">
+					<button type="button" class="btn btn-primary data-loader" data-epp-submit>
+						<span class="loader w-hidden">
+							<i class="fas fa-fw fa-spinner fa-spin"></i> {lang key="pleasewait"}
+						</span>	
+						<span class="data-btn">{lang key="confirm"}</span>				
+					</button>
+				</span>
+                <button type="button" class="btn btn-default" data-dismiss="modal">{lang key="orderForm.cancel"}</button>
+            </div>
+        </div>
+    </div>
+</div>

includes/domains/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

includes/domains/suggestions.tpl

@@ -0,0 +1,43 @@
+<div class="suggested-domains{if !$showSuggestionsContainer} w-hidden{/if}">
+	<div class="panel-heading">
+		{lang key='orderForm.suggestedDomains'}
+	</div>
+	<div id="suggestionsLoader" class="panel-body domain-lookup-loader domain-lookup-suggestions-loader">
+		<i class="fas fa-spinner fa-spin"></i> {lang key='orderForm.generatingSuggestions'}
+	</div>
+	<div id="domainSuggestions" class="domain-lookup-result list-group w-hidden">
+		<div class="domain-suggestion list-group-item w-hidden">
+			<span class="domain"></span><span class="extension"></span>
+			<span class="promo w-hidden">
+				{if $templatefile neq "configureproductdomain"}
+				<span class="sales-group-hot w-hidden">{lang key='domainCheckerSalesGroup.hot'}</span>
+				<span class="sales-group-new w-hidden">{lang key='domainCheckerSalesGroup.new'}</span>
+				<span class="sales-group-sale w-hidden">{lang key='domainCheckerSalesGroup.sale'}</span>
+				{/if}
+			</span>
+			<div class="actions">
+				<span class="price"></span>
+				<button type="button" class="btn btn-add-to-cart{if $templatefile eq "configureproductdomain"} product-domain{/if}" data-whois="1" data-domain="">
+					<span class="to-add">{$LANG.addtocart}</span>
+					<span class="loading">
+						<i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+					</span>
+					<span class="added">{if $templatefile eq "configureproductdomain"}{lang key='domaincheckeradded'}{else}<i class="far fa-shopping-cart"></i> {lang key='checkout'}{/if}</span>
+					<span class="unavailable">{$LANG.domaincheckertaken}</span>
+				</button>
+				{if $templatefile neq "configureproductdomain"}
+				<button type="button" class="btn btn-primary domain-contact-support w-hidden">
+					{lang key='domainChecker.contactSupport'}
+				</button>
+				{/if}
+			</div>
+		</div>
+	</div>
+	<div class="panel-footer more-suggestions w-hidden text-center">
+		<a id="moreSuggestions" href="#" onclick="loadMoreSuggestions();return false;">{lang key='domainsmoresuggestions'}</a>
+		<span id="noMoreSuggestions" class="no-more small w-hidden">{lang key='domaincheckernomoresuggestions'}</span>
+	</div>
+	<div class="text-center text-muted domain-suggestions-warning">
+		<p>{lang key='domainssuggestionswarnings'}</p>
+	</div>
+</div>

includes/domains/tld-pricing.tpl

@@ -0,0 +1,98 @@
+{include file="$template/includes/tablelist.tpl" tableName="DomainPricing" filterColumn="1"  noOrdering=true}
+<script>
+	jQuery(document).ready(function(){
+		var table = jQuery('#tableDomainPricing').show().DataTable();
+		{if $orderby == 'tld'}
+			table.order(0, '{$sort}');
+		{elseif $orderby == 'category'}
+			table.order(1, '{$sort}');
+		{/if}
+		table.draw();
+		jQuery('#tableLoading').hide();
+	});
+</script>
+			
+<div class="table-container clearfix">
+	<div class="table-header">
+		<div class="d-flex align-items-center mb-2 mb-md-0">
+			<label>{lang key='view'}</label>
+			<div class="dropdown view-filter-btns">
+				<button type="button" class="btn btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+					<span>{lang key='domainRenewal.showAll'}</span>
+				</button>
+				 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenuButton">
+					<li><a href="#" class="dropdown-item"><span data-value="all">{lang key='domainRenewal.showAll'}</span></a></li>
+					<div class="dropdown-divider">--</div>
+					{foreach $categoriesWithCounts as $category => $count}
+						<li><a href="#" class="dropdown-item"><span data-value="{$category}">{lang key="domainTldCategory.$category" defaultValue=$category}</span>&nbsp;({$count})</a></li>
+					{/foreach}
+				</ul>
+			</div>
+		</div>
+		<div class="search-group">
+			<input type="text" id="table-search" class="form-control" placeholder="{$LANG.tableentersearchterm}">
+		</div>
+	</div>
+	<table class="datatable table table-tlds w-hidden" id="tableDomainPricing">
+		<thead>
+			<tr>
+				<th class="text-muted">{lang key='orderdomain'}</th>
+				<th class="text-muted d-none">{lang key='category'}</th>
+				<th class="text-muted">{lang key='pricing.register'}</th>
+				<th class="text-muted">{lang key='pricing.transfer'}</th>
+				<th class="text-muted">{lang key='pricing.renewal'}</th>
+			</tr>
+		</thead>
+		<tbody>
+			{foreach $pricing['pricing'] as $tld => $price}
+				<tr>
+					<td>
+						<strong class="tld-name"><span>.</span>{$tld}</strong>
+						{if $price.group}
+							<span class="tld-sale-group tld-sale-group-{$price.group}">{$price.group}!</span>
+						{/if}
+					</td>
+					<td class="d-none">
+						<span class="categories">{$price.categories[0]}</span>
+					</td>
+					<td>
+						<span class="tld-label text-muted">{lang key='pricing.register'}</span>
+						{if isset($price.register) && current($price.register) > 0}
+							{current($price.register)}<br>
+								<small class="text-muted">{key($price.register)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+							{elseif isset($price.register) && current($price.register) == 0}
+								<small class="text-muted">{lang key='orderfree'}</small>
+							{else}
+								<small class="text-muted">{lang key='na'}</small>
+						{/if}
+					</td>
+					<td>
+						<span class="tld-label text-muted">{lang key='pricing.transfer'}</span>
+						{if isset($price.transfer) && current($price.transfer) > 0}
+							{current($price.transfer)}<br>
+							<small class="text-muted">{key($price.transfer)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+						{elseif isset($price.transfer) && current($price.transfer) == 0}
+							<small class="text-muted">{lang key='orderfree'}</small>
+						{else}
+							<small class="text-muted">{lang key='na'}</small>
+						{/if}
+					</td>
+					<td>
+						<span class="tld-label text-muted">{lang key='pricing.renewal'}</span>
+						{if isset($price.renew) && current($price.renew) > 0}
+							{current($price.renew)}<br>
+							<small class="text-muted">{key($price.renew)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+						{elseif isset($price.renew) && current($price.renew) == 0}
+							<small class="text-muted">{lang key='orderfree'}</small>
+						{else}
+							<small class="text-muted">{lang key='na'}</small>
+						{/if}
+					</td>
+				</tr>
+			{/foreach}
+		</tbody>
+	</table>
+	<div class="text-center" id="tableLoading">
+		<p><i class="fas fa-spinner fa-spin"></i> {$LANG.loading}</p>
+	</div>
+</div>

includes/existing-paymethods.tpl

@@ -1,46 +1,58 @@
 {if $selectedAccountId === $client->id}
-    {foreach $client->payMethods->validateGateways()->sortByExpiryDate() as $payMethod}
-        {assign "payMethodExpired" 0}
-        {assign "expiryDate" ""}
-        {if $payMethod->isCreditCard()}
-            {if ($payMethod->payment->isExpired())}
-                {assign "payMethodExpired" 1}
-            {/if}
+	<div class="card-list">
+		{foreach $client->payMethods->validateGateways()->sortByExpiryDate() as $payMethod}
+			{assign "payMethodExpired" 0}
+			{assign "expiryDate" ""}
+			{if $payMethod->isCreditCard()}
+				{if ($payMethod->payment->isExpired())}
+					{assign "payMethodExpired" 1}
+				{/if}
 
-            {if $payMethod->payment->getExpiryDate()}
-                {assign "expiryDate" $payMethod->payment->getExpiryDate()->format('m/Y')}
-            {/if}
-        {/if}
-
-        <div class="paymethod-info radio-inline" data-paymethod-id="{$payMethod->id}">
-            <input type="radio"
-                   name="ccinfo"
-                   class="existing-card"
-                   {if $payMethodExpired}disabled{/if}
-                   data-payment-type="{$payMethod->getType()}"
-                   data-payment-gateway="{$payMethod->gateway_name}"
-                   data-order-preference="{$payMethod->order_preference}"
-                   value="{$payMethod->id}">
-        </div>
-
-        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
-            <i class="{$payMethod->getFontAwesomeIcon()}"></i>
-        </div>
-        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
-            {if $payMethod->isCreditCard() || $payMethod->isRemoteBankAccount()}
-                {$payMethod->payment->getDisplayName()}
-            {else}
-                <span class="type">
-                {$payMethod->payment->getAccountType()}
-            </span>
-                {substr($payMethod->payment->getAccountNumber(), -4)}
-            {/if}
-        </div>
-        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
-            {$payMethod->getDescription()}
-        </div>
-        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
-            {$expiryDate}{if $payMethodExpired}<br><small>{$LANG.clientareaexpired}</small>{/if}
-        </div>
-    {/foreach}
+				{if $payMethod->payment->getExpiryDate()}
+					{assign "expiryDate" $payMethod->payment->getExpiryDate()->format('m/Y')}
+				{/if}
+			{/if}
+			<label class="card-item border rounded{if $payMethodExpired} disabled{/if}" data-paymethod-id="{$payMethod->id}" for="existing-card">
+				<div class="card-item-checkbox ml-0">
+					<div class="paymethod-info radio-inline" data-paymethod-id="{$payMethod->id}">
+						<input type="radio"
+							   name="ccinfo"
+							   class="existing-card"
+							   {if $payMethodExpired}disabled{/if}
+							   data-payment-type="{$payMethod->getType()}"
+							   data-payment-gateway="{$payMethod->gateway_name}"
+							   data-order-preference="{$payMethod->order_preference}"
+							   value="{$payMethod->id}">
+					</div>
+				</div>
+				<div class="card-item-icon">
+					<div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+						<i class="{$payMethod->getFontAwesomeIcon()} fa-fw bigger-150"></i>
+					</div>
+				</div>
+				<div class="card-item-name">
+					<div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+						{if $payMethod->isCreditCard() || $payMethod->isRemoteBankAccount()}
+							{$payMethod->payment->getDisplayName()}
+						{else}
+							<span class="type">
+							{$payMethod->payment->getAccountType()}
+						</span>
+							{substr($payMethod->payment->getAccountNumber(), -4)}
+						{/if}
+					</div>
+					{if $payMethod->getDescription()}
+						<span class="small text-muted" data-paymethod-id="{$payMethod->id}">{$payMethod->getDescription()}</span>
+					{else}
+						-
+					{/if}
+				</div>
+				<div class="card-item-status text-muted">
+					<div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+						{$expiryDate}{if $payMethodExpired}<br><small>{$LANG.clientareaexpired}</small>{else}<span class="label status status-{$payMethod->getStatus()|lower}">{$payMethod->getStatus()}</span>{/if}
+					</div>
+				</div>
+			</label>
+		{/foreach}
+	</div>
 {/if}

includes/product-recommendations.tpl

@@ -0,0 +1,114 @@
+{if !empty($lastProduct)}
+<div class="product-added-panel panel card">
+    <div class="panel-body card-body">
+        <span class="text-muted">
+            <i class="far fa-check"></i>&nbsp;{lang key="recommendations.productAdded"}
+        </span>
+        <div>
+            <span class="product-name">&nbsp;{$lastProduct.product.name}</span>
+            <span class="product-group">&nbsp;{$lastProduct.product.productGroup.name}</span>
+        </div>
+        <div>
+            <span class="product-price">
+                {if !$lastProduct.pricing->isFree()}
+                    &nbsp;{$lastProduct.pricing->price()->toFull()}
+                    {if $lastProduct.pricing->setup() && $lastProduct.pricing->setup()->toNumeric() > 0}
+                        + {$lastProduct.pricing->setup()->toFull()} {lang key="ordersetupfee"}
+                    {/if}
+                {/if}
+            </span>
+            <span class="product-cycle">&nbsp;{lang key='orderpaymentterm'|cat:$lastProduct.pricing->cycle()}</span>
+        </div>
+    </div>
+</div>
+{/if}
+<div class="product-recommendations-container">
+    <div class="product-recommendations">
+        {if !in_array($templatefile, ['viewcart', 'checkout', 'complete'])}
+            <p>{lang key="recommendations.explain.product"}</p>
+        {elseif !$recommendStyle && $templatefile != 'complete'}
+            <p>{lang key="recommendations.explain.generic"}</p>
+        {elseif $templatefile == 'complete'}
+            <div>
+                <h4 class="float-left pull-left">{lang key="recommendations.title.generic"}</h4>
+                <h4 class="text-muted float-right pull-right">
+                    <small>
+                        {if !empty($productRecommendations.order)}
+                            {lang key="recommendations.title.yourOrder"}
+                        {else}
+                            {lang key="recommendations.title.yourProducts"}
+                        {/if}
+                    </small>
+                </h4>
+                <div class="clearfix"></div>
+            </div>
+        {/if}
+        {if $productRecommendations}
+            {foreach $productRecommendations as $categoryKey => $categoryRecommendations}
+                {if $templatefile == 'complete' && $categoryKey == 'own' && !empty($productRecommendations.own) && !empty($productRecommendations.order)}
+                    <h4 class="text-muted float-right pull-right">
+                        <small>{lang key="recommendations.title.yourProducts"}</small>
+                    </h4>
+                    <div class="clearfix"></div>
+                {/if}
+                {foreach $categoryRecommendations as $categoryRecommendation}
+                    {if $recommendStyle && $templatefile != 'complete'}
+                        <p>{lang key="recommendations.explain.ordered" productName=$categoryRecommendation.name}</p>
+                    {/if}
+                    {foreach $categoryRecommendation.recommendations as $recommendation}
+                        {assign var="price" value=$recommendation->pricing()->first()}
+                        <div class="product-recommendation" data-color="{$recommendation.color}" style="border-color:{$recommendation->color};">
+                            <div class="header{if !$recommendation.shortDescription} header-static{/if}">
+                                <div class="cta">
+                                    <div class="price" style="color:{$recommendation->color};">
+                                        <span {if !$recommendation->isFree()}class="w-hidden hidden"{/if}>{lang key="orderfree"}</span>
+                                        {if !$recommendation->isFree() && $price}
+                                            <span class="breakdown-price">
+                                            {if $price->isOneTime()}
+                                                {$price->price()->toFull()}
+                                            {elseif $price->isRecurring()}
+                                                {$price->breakdownPrice()}
+                                            {/if}
+                                        </span>
+                                        {/if}
+                                        {if !$recommendation->isFree() && !is_null($price->setup()) && $price->setup()->toNumeric() > 0}
+                                            <span class="setup-fee"><small>{$price->setup()->toFull()}&nbsp;{lang key="ordersetupfee"}</small></span>
+                                        {/if}
+                                    </div>
+                                    <a type="button" class="btn btn-sm btn-add" href="{$recommendation->getRoutePath()}" role="button" style="background-color:{$recommendation->color};">
+                                        <span class="text">
+                                            {lang key="addtocart"}
+                                        </span>
+                                            <span class="arrow" style="background-color:{$recommendation->color};">
+                                            <i class="fas fa-chevron-right"></i>
+                                        </span>
+                                    </a>
+                                </div>
+                                <div class="expander" style="color:{$recommendation->color};">
+                                    {if $recommendation.shortDescription}
+                                        <i class="fas fa-chevron-right rotate" data-toggle="tooltip" data-placement="right" title="{lang key="recommendations.learnMore"}"></i>
+                                    {else}
+                                        <i class="fas fa-square fa-xs"></i>
+                                    {/if}
+                                </div>
+                                <div class="content">
+                                    <div class="headline truncate">{$recommendation.productGroup.name} - {$recommendation.name}</div>
+                                    <div class="tagline truncate">
+                                        {if empty($recommendation.tagline)}
+                                            {lang key="recommendations.taglinePlaceholder"}
+                                        {else}
+                                            {$recommendation.tagline}
+                                        {/if}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="body clearfix">
+                                <p>{$recommendation.shortDescription}</p>
+                            </div>
+                        </div>
+                    {/foreach}
+                {/foreach}
+            {/foreach}
+        {/if}
+    </div>
+</div>

includes/products/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

includes/products/style-1.tpl

@@ -0,0 +1,260 @@
+{if count($products) < 4}
+	<style rel="stylesheet" type="text/css">
+		@media (min-width: 1400px) {
+			#order-clouder {
+				{if $products|@count == 1}
+					margin: 0 auto; max-width: 25%; width: 25%;
+				{elseif $products|@count == 2}
+					margin: 0 auto; max-width: 50%; width: 50%;
+				{elseif $products|@count == 3}
+					margin: 0 auto; max-width: 75%; width: 75%;
+				{else}
+				{/if}
+			}
+		}
+		
+		@media (min-width: 992px) and (max-width: 1399px) {
+			#order-clouder {
+				{if $products|@count == 1}
+					margin: 0 auto; max-width: 33%; width: 33%;
+				{elseif $products|@count == 2}
+					margin: 0 auto; max-width: 75%; width: 75%;
+				{else}
+				{/if}
+			}
+		}	
+	</style>
+{/if}
+	
+<div id="order-standard_cart">
+	<div class="row">
+		<div class="col-md-12">
+			<div class="d-flex aling-items-center justify-content-center text-center">
+				<div class="header-lined mb-3">
+					<h1>
+						{$productGroup.name}
+					</h1>
+					{if $productGroup.headline}
+						<div class="text-muted mt-2">{$productGroup.headline}</div>
+					{/if}
+					{if $productGroup.tagline}
+						<div class="text-muted mt-2">{$productGroup.tagline}</div>
+					{/if}
+				</div>
+			</div>
+			
+			{if $showSidebarToggle}
+			<div class="TM-categories-options d-flex justify-content-center">
+				<a data-toggle="modal" data-target="#cat-opt" class="btn btn-primary btn-xs mb-2">
+					<i class="fas fa-search-plus"></i> {$LANG.showMenu}
+				</a>
+			</div>
+			<hr class="separator">
+			{/if}
+			
+			{if $errormessage}
+				<div class="alert alert-danger">
+					{$errormessage}
+				</div>
+			{elseif !$productGroup}
+				<div class="alert alert-info">
+					{lang key='orderForm.selectCategory'}
+				</div>
+			{/if}
+		</div>
+
+		<div class="col-md-12">
+			<div id="order-clouder">
+				<div id="products" class="cros-pricing-container">
+					<div class="owl-carousel pricing-box no-padding-top">
+					{foreach $products as $key => $product}
+						{$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+						<div class="slide-item" id="{$idPrefix}">
+							<div class="cros-pricing-table light fixed-height {if $product.isFeatured}active{/if}">
+										
+								<h4 id="{$idPrefix}-name">{$product.name}
+									{if $product.stockControlEnabled}
+										<span class="small text-muted">
+											<br />{$product.qty} {$LANG.orderavailable}
+										</span>
+									{/if}								
+								</h4>
+								{if $product.featuresdesc}<div class="desc mb-0">{$product.featuresdesc}</div>{else}{/if}
+												
+
+								<div id="{$idPrefix}-price">
+									{if $product.bid}
+										<div class="small text-muted">{$LANG.bundledeal}</div>
+										{if $product.displayprice}
+											<span class="text-secondary bolder" style="font-size: 33px;">{$product.displayPriceSimple}</span>
+										{/if}
+									{/if}
+									<div class="price d-block">
+										{if $product.bid}
+										{elseif $product.paytype eq "free"}
+											<mark>{$LANG.orderfree}</mark>
+										{elseif $product.paytype eq "onetime"}
+											<span class="cost">{$product.pricing.minprice.simple}</span><br />{$LANG.orderpaymenttermonetime}
+										{else}
+										
+											{if $product.pricing.hasconfigoptions}
+												{$LANG.from}<br />
+											{/if}
+											
+											<span class="cost">{$product.pricing.minprice.price}</span>
+											<span class="cycle">{if $product.pricing.minprice.cycle eq "monthly"}
+												/{$LANG.pricingCycleShort.monthly}
+											{elseif $product.pricing.minprice.cycle eq "quarterly"}
+												/{$LANG.pricingCycleShort.quarterly}
+											{elseif $product.pricing.minprice.cycle eq "semiannually"}
+												/{$LANG.pricingCycleShort.semiannually}
+											{elseif $product.pricing.minprice.cycle eq "annually"}
+												/{$LANG.pricingCycleShort.annually}
+											{elseif $product.pricing.minprice.cycle eq "biennially"}
+												/{$LANG.pricingCycleShort.biennially}
+											{elseif $product.pricing.minprice.cycle eq "triennially"}
+												/{$LANG.pricingCycleShort.triennially}
+											{/if}</span>
+													
+										{/if}
+									</div>
+									{if $product.pricing.minprice.setupFee}
+										<div class="small text-muted">+ ({$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee})</div>
+									{/if}																								
+								</div>
+								
+								<a href="{if $themesettings.orderform.orderopc != ""}{$WEB_ROOT}/cart.php?a=add&{if $product.bid}bid={$product.bid}{else}pid={$product.pid}{/if}{else}{$product.productUrl}{/if}" class="btn btn-primary btn-block" style="margin-top: 10px;" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+									{$LANG.ordernowbutton}
+								</a>																
+										
+								<p class="PriceList-toggle collapsed" data-toggle="collapse" data-target="#PlanLists1">
+									<span>Details</span>
+								</p>
+										
+								<ul class="plan-features collapse" id="PlanLists1">			
+									{foreach $product.features as $feature => $value}
+										<li id="{$idPrefix}-feature{$value@iteration}"><b>{$value}</b> {$feature}</li>
+									{/foreach}
+								</ul>
+									
+								{if $product.freedomain neq ""}
+									<div class="mt-1 p-2 border rounded small text-muted text-center white border-secondary">{lang key="orderfreedomainonly"}</div>
+								{/if}										
+
+								
+								{if $product.isFeatured}
+								<!-- Popular plan sticker -->
+									<div class="sticker-wrapper">
+										<div class="sticker">
+											{$LANG.featuredProduct}
+										</div>
+									</div>
+								<!-- //End popular plan sticker-->
+								{/if}					
+									
+							</div>
+						</div>
+								
+								
+					{/foreach}
+					</div>
+				</div>
+						
+			</div>
+			
+			{if $productGroup.features|@count > 0}
+				
+				<div class="space-30"></div>
+				
+				<div class="block-s3 p-0">
+					<div class="text-center">
+						<h2 class="no-margin h3">{$LANG.orderForm.includedWithPlans}</h2>
+					</div>
+				</div>
+					
+				<hr class="separator"></hr>
+				
+				<div class="cart-features no-margin-top">							
+					<div class="includes-features">
+						<ul class="list-features">
+							{foreach $productGroup.features as $features}
+								<li>{$features.feature}</li>
+							{/foreach}
+						</ul>
+					</div>
+				</div>
+			{/if}
+			
+		</div>
+	</div>
+	
+	
+</div>
+			
+{include file="orderforms/{$carttpl}/categories-options.tpl"}
+{include file="orderforms/{$carttpl}/recommendations-modal.tpl"}
+
+<script>
+	$(document).ready(function() {		
+		$(".pricing-box").owlCarousel({
+		
+			{if $products|@count == 1}
+			
+				responsive:{
+					0:{
+						items:1,
+					}
+				}
+			
+			{elseif $products|@count == 2}
+				
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					}
+				}
+			{elseif $products|@count == 3}
+			
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					},
+					992:{
+						items:3,
+					}
+				}
+			{else}
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					},
+					992:{
+						items:3,
+					},
+					1200:{
+						items:4,
+					}
+				}			
+			{/if}
+		});
+	});
+
+	jQuery('.select2-single').select2();
+	
+	function redirectToCartPage()
+	{
+		var path = jQuery('#gidForm').val();
+		if (path) {
+			window.location.href = path;
+		}
+	}	
+</script>

includes/products/style-2.tpl

@@ -0,0 +1,158 @@
+<div id="order-standard_cart">	
+	<div class="row">
+		{if !$themesettings.general.themelayout}
+			<div class="col-lg-3 d-none d-lg-block sidebar sidebar-primary hidden-xs hidden-sm{if $themesettings.clientarea.sidebars == "1"} default{/if}">
+				{include file="orderforms/$carttpl/sidebar-categories.tpl"}
+			</div>
+		{/if}
+		<div class="main-content col-lg-9">
+			<div class="header-lined">
+				<h1>
+					{$productGroup.name}
+				</h1>
+				{if $productGroup.headline}
+					<div class="text-muted mt-2">{$productGroup.headline}</div>
+				{/if}
+				{if $productGroup.tagline}
+					<div class="text-muted mt-2">{$productGroup.tagline}</div>
+				{/if}
+			</div>
+			
+			
+			{if $errormessage}
+				<div class="alert alert-danger">
+					{$errormessage}
+				</div>
+			{elseif !$productGroup}
+				<div class="alert alert-info">
+					{lang key='orderForm.selectCategory'}
+				</div>
+			{/if}
+			
+			<div class="space-32 d-none d-lg-block"></div>
+			
+			{include file="orderforms/$carttpl/sidebar-categories-collapsed.tpl"}
+			
+			<div class="products" id="products">
+				<div class="row row-eq-height row-eq-height-lg cros-pricing-container">
+					{foreach $products as $key => $product}
+						{$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+						<div class="col-xl-4 col-lg-6">
+							<div class="cros-pricing-table light {if $product.isFeatured}active{/if}" id="{$idPrefix}">
+										
+								<h4 id="{$idPrefix}-name">{$product.name}
+									{if $product.stockControlEnabled}
+										<span class="small text-muted">
+											<br />{$product.qty} {$LANG.orderavailable}
+										</span>
+									{/if}								
+								</h4>
+								{if $product.featuresdesc}<div class="desc mb-0">{$product.featuresdesc}</div>{else}{/if}
+												
+
+								<div id="{$idPrefix}-price">
+									{if $product.bid}
+										<div class="small text-muted">{$LANG.bundledeal}</div>
+										{if $product.displayprice}
+											<span class="text-secondary bolder" style="font-size: 33px;">{$product.displayPriceSimple}</span>
+										{/if}
+									{/if}
+									<div class="price d-block">
+										{if $product.bid}
+										{elseif $product.paytype eq "free"}
+											<mark>{$LANG.orderfree}</mark>
+										{elseif $product.paytype eq "onetime"}
+											<span class="cost">{$product.pricing.minprice.simple}</span><br />{$LANG.orderpaymenttermonetime}
+										{else}
+										
+											{if $product.pricing.hasconfigoptions}
+												{$LANG.from}<br />
+											{/if}
+											
+											<span class="cost">{$product.pricing.minprice.price}</span>
+											<span class="cycle">{if $product.pricing.minprice.cycle eq "monthly"}
+												/{$LANG.pricingCycleShort.monthly}
+											{elseif $product.pricing.minprice.cycle eq "quarterly"}
+												/{$LANG.pricingCycleShort.quarterly}
+											{elseif $product.pricing.minprice.cycle eq "semiannually"}
+												/{$LANG.pricingCycleShort.semiannually}
+											{elseif $product.pricing.minprice.cycle eq "annually"}
+												/{$LANG.pricingCycleShort.annually}
+											{elseif $product.pricing.minprice.cycle eq "biennially"}
+												/{$LANG.pricingCycleShort.biennially}
+											{elseif $product.pricing.minprice.cycle eq "triennially"}
+												/{$LANG.pricingCycleShort.triennially}
+											{/if}</span>
+													
+										{/if}
+									</div>
+									
+									{if $product.pricing.minprice.setupFee}
+										<div class="small text-muted">({$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee})</div>
+									{/if}
+											
+													
+								</div>
+								
+								<a href="{if $themesettings.orderform.orderopc != ""}{$WEB_ROOT}/cart.php?a=add&{if $product.bid}bid={$product.bid}{else}pid={$product.pid}{/if}{else}{$product.productUrl}{/if}" class="btn btn-primary btn-block" style="margin-top: 10px;" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+									{$LANG.ordernowbutton}
+								</a>								
+										
+								<ul class="plan-features mt-3 mt-lg-0" id="PlanLists1">			
+									{foreach $product.features as $feature => $value}
+										<li id="{$idPrefix}-feature{$value@iteration}"><b>{$value}</b> {$feature}</li>
+									{/foreach}
+								</ul>
+									
+								{if $product.freedomain neq ""}
+									<div class="mt-1 p-2 border rounded small text-muted text-center white border-secondary">{lang key="orderfreedomainonly"}</div>
+								{/if}									
+										
+								{if $product.isFeatured}
+								<!-- Popular plan sticker -->
+									<div class="sticker-wrapper">
+										<div class="sticker">
+											{$LANG.featuredProduct}
+										</div>
+									</div>
+								<!-- //End popular plan sticker-->
+								{/if}					
+									
+							</div>
+						</div>
+					{/foreach}
+				</div>
+			</div>
+			
+			{if $productGroup.features|@count > 0}
+				
+				<div class="space-30"></div>
+				
+				<div class="block-s3 p-0">
+					<div class="text-center">
+						<h2 class="no-margin h3">{$LANG.orderForm.includedWithPlans}</h2>
+					</div>
+				</div>
+					
+				<hr class="separator"></hr>
+				
+				<div class="cart-features no-margin-top">							
+					<div class="includes-features">
+						<ul class="list-features">
+							{foreach $productGroup.features as $features}
+								<li>{$features.feature}</li>
+							{/foreach}
+						</ul>
+					</div>
+				</div>
+			{/if}
+		</div>
+		{if $themesettings.general.themelayout}
+		<div class="col-lg-3 d-none d-lg-block sidebar sidebar-primary hidden-xs hidden-sm{if $themesettings.clientarea.sidebars == "1"} default{/if}">
+			{include file="orderforms/$carttpl/sidebar-categories.tpl"}
+		</div>
+		{/if}
+	</div>
+</div>
+
+{include file="orderforms/{$carttpl}/recommendations-modal.tpl"}

includes/viewcart/default.tpl

@@ -0,0 +1,341 @@
+{if $checkout} {else}
+	<script>
+		// Define state tab index value
+		var statesTab = 10;
+		var stateNotRequired = true;
+	</script>
+	{include file="orderforms/{$carttpl}/common.tpl"}
+	<script type="text/javascript" src="{$BASE_PATH_JS}/StatesDropdown.js"></script>
+{/if}
+
+<div id="order-standard_cart">
+	{if $cartitems > 0}
+		<div class="row">
+			<div class="col-md-12">
+				<div class="header-lined">
+					<h1>{if !$checkout}{$LANG.cartreviewcheckout}{else}{$LANG.orderForm.checkout}{/if}</h1>
+					{if $checkout}<p>{lang key='orderForm.enterPersonalDetails'}</p>{/if}
+				</div>
+			</div>	
+			<div class="col-md-12">
+				<div class="row ajaxcart_cont">
+					<div class="col-lg-8 col-xl-9">
+						{if $checkout} {else}
+
+							{if $promoerrormessage}
+								<div class="alert alert-warning text-center" role="alert">
+									{$promoerrormessage}
+								</div>
+							{elseif $errormessage}
+								<div class="alert alert-danger" role="alert">
+									<p>{$LANG.orderForm.correctErrors}:</p>
+									<ul>
+										{$errormessage}
+									</ul>
+								</div>
+							{elseif $promotioncode && $rawdiscount eq "0.00"}
+								<div class="alert alert-info text-center" role="alert">
+									{$LANG.promoappliedbutnodiscount}
+								</div>
+							{elseif $promoaddedsuccess}
+								<div class="alert alert-success text-center" role="alert">
+									{$LANG.orderForm.promotionAccepted}
+								</div>
+							{/if}
+
+							{if $bundlewarnings}
+								<div class="alert alert-warning" role="alert">
+									<strong>{$LANG.bundlereqsnotmet}</strong><br />
+									<ul>
+										{foreach from=$bundlewarnings item=warning}
+											<li>{$warning}</li>
+										{/foreach}
+									</ul>
+								</div>
+							{/if}
+
+							{include file="orderforms/$carttpl/includes/viewcart/summary-table.tpl"}
+
+							{foreach $gatewaysoutput as $gatewayoutput}
+								<div class="view-cart-gateway-checkout">
+									{$gatewayoutput}
+								</div>
+							{/foreach}
+							
+							{if !$themesettings.orderform.nopromobox}
+								{if $promotioncode}
+									<div class="view-cart-promotion-code{if $hookOutput} mb-5{else} mb-3{/if}">
+										<span class="code"><i class="fad fa-tags fa-fw"></i> <strong>{$promotioncode}</strong> - {$promotiondescription}</span>
+										<span class="remove"><a href="{$WEB_ROOT}/cart.php?a=removepromo" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.removePromotionCode}"><i class="far fa-trash-alt icon-only text-danger"></i></a></span>
+									</div>
+								{else}
+									<form method="post" action="{$WEB_ROOT}/cart.php?a=view">
+										<div class="card{if $hookOutput} mb-5{else} mb-3{/if}">
+											<div class="card-body">
+												<div class="input-group">
+													<input type="text" name="promocode" id="inputPromotionCode" class="form-control input-lg" placeholder="{lang key="orderPromoCodePlaceholder"}" required="required">
+													<div class="input-group-append">
+														<button type="submit" name="validatepromo" class="btn btn-primary" value="{$LANG.orderpromovalidatebutton}">
+															{$LANG.orderpromovalidatebutton}
+														</button>
+													</div>														
+												</div>
+											</div>
+										</div>
+									</form>
+								{/if}
+							{/if}
+							
+							{foreach $hookOutput as $output}
+								<div>
+									{$output|replace:"h3":"h4"|replace:'style="margin:20px 0;"':''}
+								</div>
+							{/foreach}
+
+						{/if}
+						{if !$checkout}{else}
+
+							{include file="orderforms/$carttpl/checkout.tpl"}
+						
+							{if $servedOverSsl}
+								<div class="alert alert-warning small mt-4">
+									<i class="fad fa-lock-alt"></i>&nbsp; {$LANG.ordersecure} (<strong>{$ipaddress}</strong>) {$LANG.ordersecure2}
+								</div>
+							{/if}
+
+						{/if}
+
+					</div>
+					<div class="col-lg-4 col-xl-3">
+						<div id="sidebar">
+							<div class="sidebar__inner blocks cartsummary">
+								<div class="order-summary">
+
+									<div class="loader w-hidden" id="orderSummaryLoader">
+										<i class="fad fa-circle-notch fa-spin fa-2x"></i>
+									</div>
+
+									<h2><i class="fal fa-shopping-cart text-primary"></i>&nbsp;{$LANG.ordersummary}</h2>
+									<div class="summary-container-outer">
+										<div class="summary-container{if $checkout} mb-0{/if}">
+
+											<div class="subtotal clearfix">
+												<span class="pull-left float-left">{$LANG.ordersubtotal}</span>
+												<span id="subtotal" class="pull-right float-right">{$subtotal}</span>
+											</div>
+											{if $promotioncode || $taxrate || $taxrate2}
+												<div class="bordered-totals">
+													{if $promotioncode}
+														<div class="clearfix">
+															<span class="pull-left float-left">{$promotiondescription}</span>
+															<span id="discount" class="pull-right float-right">{$discount}</span>
+														</div>
+													{/if}
+													{if $taxrate}
+														<div class="clearfix">
+															<span class="pull-left float-left">{$taxname} @ {$taxrate}%</span>
+															<span id="taxTotal1" class="pull-right float-right">{$taxtotal}</span>
+														</div>
+													{/if}
+													{if $taxrate2}
+														<div class="clearfix">
+															<span class="pull-left float-left">{$taxname2} @ {$taxrate2}%</span>
+															<span id="taxTotal2" class="pull-right float-right">{$taxtotal2}</span>
+														</div>
+													{/if}
+												</div>
+											{/if}
+											<div class="recurring-totals clearfix">
+												<span class="pull-left float-left">{$LANG.orderForm.totals}</span>
+												<span id="recurring" class="pull-right float-right recurring-charges">
+													<span id="recurringMonthly" {if !$totalrecurringmonthly}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringmonthly}</span> {$LANG.orderpaymenttermmonthly}<br />
+													</span>
+													<span id="recurringQuarterly" {if !$totalrecurringquarterly}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringquarterly}</span> {$LANG.orderpaymenttermquarterly}<br />
+													</span>
+													<span id="recurringSemiAnnually" {if !$totalrecurringsemiannually}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringsemiannually}</span> {$LANG.orderpaymenttermsemiannually}<br />
+													</span>
+													<span id="recurringAnnually" {if !$totalrecurringannually}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringannually}</span> {$LANG.orderpaymenttermannually}<br />
+													</span>
+													<span id="recurringBiennially" {if !$totalrecurringbiennially}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringbiennially}</span> {$LANG.orderpaymenttermbiennially}<br />
+													</span>
+													<span id="recurringTriennially" {if !$totalrecurringtriennially}style="display:none;"{/if}>
+														<span class="cost">{$totalrecurringtriennially}</span> {$LANG.orderpaymenttermtriennially}<br />
+													</span>
+												</span>
+											</div>
+											{if $checkout}
+												<div class="total-due-today total-due-today-padded border-top mt-2" id="totalDueToday" data.newTotal>
+													<span class="text-muted">{$LANG.ordertotalduetoday}</span>
+													<span id="totalCartPrice" class="amt">{$total}</span>
+												</div>
+											{else}
+												<div class="total-due-today total-due-today-padded border-top mt-2">
+													<span class="text-muted">{$LANG.ordertotalduetoday}</span>
+													<span id="totalDueToday" class="amt">{$total}</span>
+												</div>											
+											{/if}
+										</div>
+										<div class="express-checkout-buttons">
+											{foreach $expressCheckoutButtons as $checkoutButton}
+												{$checkoutButton}
+												<div class="separator">
+													- {$LANG.or|strtoupper} -
+												</div>
+											{/foreach}
+										</div>
+
+										<div class="text-center">
+										{if $checkout}{else}<a href="{$WEB_ROOT}/cart.php?a=checkout&e=false" class="btn btn-primary btn-block btn-lg btn-checkout{if $cartitems == 0} disabled{/if}" id="checkout">
+												{$LANG.orderForm.checkout}
+												<i class="fas fa-arrow-right"></i>
+											</a>{/if}									
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		
+		{include file="orderforms/$carttpl/recommendations-modal.tpl"}
+
+	{else}
+
+		<div class="mw-928 mx-auto">	
+			<div class="alert-lg no-data no-border">
+				<div class="icon">
+					<i class="fad fa-shopping-cart"></i>
+				</div>
+				<div class="text">
+					<h4>{$LANG.cartempty}</h4>
+				</div>
+				<a href="{if $themesettings.orderform.orderopc != ""}order{else}cart{/if}.php" class="btn btn-default" id="continueShopping">
+					{$LANG.navservicesorder}
+				</a>
+			</div>
+		</div>
+
+	{/if}
+
+</div>
+
+
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/ResizeSensor.js"></script>
+<script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/jquery.sticky-sidebar.min.js"></script>
+
+<script>
+jQuery('#sidebar').stickySidebar({
+	topSpacing: 90,
+	bottomSpacing: 60,
+	minWidth: 992,
+	containerSelector: '.ajaxcart_cont',
+	innerWrapperSelector: '.sidebar__inner'
+});
+</script>
+
+<form method="post" action="{$WEB_ROOT}/cart.php">
+	<input type="hidden" name="a" value="remove" />
+	<input type="hidden" name="r" value="" id="inputRemoveItemType" />
+	<input type="hidden" name="i" value="" id="inputRemoveItemRef" />
+	<input type="hidden" name="rt" value="" id="inputRemoveItemRenewalType">
+	<div class="modal fade modal-remove-item" id="modalRemoveItem" tabindex="-1" role="dialog">
+		<div class="modal-dialog modal-dialog-centered" role="document">
+			<div class="modal-content">
+				<div class="modal-header d-block">
+					<h4 class="modal-title">
+						<button type="button" class="close" data-dismiss="modal" aria-label="{$LANG.orderForm.close}">
+							<span aria-hidden="true">&times;</span>
+						</button>
+						<span>{lang key='orderForm.removeItem'}</span>
+					</h4>
+				</div>
+				<div class="modal-body">
+					{$LANG.cartremoveitemconfirm}
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default" data-dismiss="modal">{$LANG.no}</button>
+					<button type="submit" class="btn btn-primary">{$LANG.yes}</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</form>
+
+<form method="post" action="{$WEB_ROOT}/cart.php">
+	<input type="hidden" name="a" value="empty" />
+	<div class="modal fade modal-remove-item" id="modalEmptyCart" tabindex="-1" role="dialog">
+		<div class="modal-dialog modal-dialog-centered" role="document">
+			<div class="modal-content">
+				<div class="modal-header d-block">
+					<h4 class="modal-title">
+						<button type="button" class="close" data-dismiss="modal" aria-label="{$LANG.orderForm.close}">
+							<span aria-hidden="true">&times;</span>
+						</button>
+						<span>{$LANG.emptycart}</span>
+					</h4>
+				</div>
+				<div class="modal-body">
+					{$LANG.cartemptyconfirm}
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default" data-dismiss="modal">{$LANG.no}</button>
+					<button type="submit" class="btn btn-primary">{$LANG.yes}</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</form>
+
+{if $taxenabled && !$loggedin}
+    <form method="post" action="{$WEB_ROOT}/cart.php?a=setstateandcountry">
+        <div class="modal fade" id="estimate-taxes">
+            <div class="modal-dialog modal-dialog-centered">
+                <div class="modal-content">
+                    <div class="modal-header d-block">
+						<h4 class="modal-title">
+							<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+								<span aria-hidden="true">&times;</span>
+							</button>
+							<span>{$LANG.orderForm.estimateTaxes}</span>
+						</h4>
+                    </div>
+                    <div class="modal-body">
+                        <div class="row">
+                            <div class="col-12">
+                                <div class="form-group">
+                                    <label for="inputCountry2" class="control-label">{$LANG.orderForm.country}</label>
+                                    <select name="country" id="inputCountry2" class="form-control">
+                                        {foreach $countries as $countrycode => $countrylabel}
+                                            <option value="{$countrycode}" {if (!$country && $countrycode==$defaultcountry) || $countrycode eq $country} selected{/if}>
+                                                {$countrylabel}
+                                            </option>
+                                        {/foreach}
+                                    </select>
+                                </div>
+                            </div>
+                            <div class="col-12">
+                                <div class="form-group">
+                                    <label for="inputState2" class="control-label">{$LANG.orderForm.state}</label>
+                                    <input type="text" name="state" id="inputState2" value="{$clientsdetails.state}" class="form-control" {if $loggedin} disabled="disabled" {/if} />
+                                </div>
+                            </div>							
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <button type="submit" class="btn btn-primary">
+                            <span>{$LANG.orderForm.updateTotals}</span>
+                        </button>
+                        <button type="button" class="btn btn-default" data-dismiss="modal">{$LANG.orderForm.cancel}</button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </form>
+{/if}

includes/viewcart/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

includes/viewcart/spc.tpl

@@ -0,0 +1,212 @@
+{if $action eq 'checkout'}
+	{include file="orderforms/{$carttpl}/checkout.tpl"}
+{else}
+	<div class="cartsummary_cont">
+		<div class="summary_body">
+		
+			{if $errormessage}
+				<div class="errorbox m-3" style="display:block;">
+					{$errormessage|replace:'<li>':' &nbsp;#&nbsp; '} &nbsp;#&nbsp;
+				</div>
+			{elseif $promotioncode && $rawdiscount eq "0.00"}
+				<div class="errorbox m-3" style="display:block;">
+					{$LANG.promoappliedbutnodiscount}
+				</div>
+			{/if}
+			
+			
+			{if $cartitems == 0}            
+				<div class="emptycart">
+					{$LANG.cartempty}
+				</div>
+			{else}
+			
+			{foreach $products as $num => $product}
+				<div class="summary_products">
+					<ul class="mb-0">
+						<li>
+							<span class="product-group">{$product.productinfo.groupname}</span>
+							<span class="product-name">{$product.productinfo.name}</span>
+							{if $product.domain}<span class="product-domain text-muted">{$product.domain}</span>{/if}
+						</li>
+						<li>{$product.pricing.baseprice}{if $product.proratadate}<br />({$LANG.orderprorata} {$product.proratadate}){/if}</li>
+					</ul>
+				</div>
+			{/foreach}
+			
+			<div class="cart-contents collapse" id="CartContents">
+			
+				{foreach $products as $num => $product}
+					<div class="summary_products">
+						{if $product.configoptions}
+							<div class="configurableoptions">
+								{foreach key=confnum item=configoption from=$product.configoptions}
+									<div class="list-item">
+										<span class="item-name">&nbsp;&raquo; {$configoption.name}: {$configoption.optionname}</span>
+										<span class="item-value">{$configoption.recurring} {* {if $configoption.setup} + {$configoption.setup} {$LANG.ordersetupfee}{/if} *}</span>
+									</div>
+								{/foreach}
+							</div>
+						{/if}
+						{if $product.addons}
+							<div class="pb-1 border-bottom fw-500 my-2">{$LANG.cartaddons}</div>
+							{foreach $product.addons as $addonnum => $addon}
+								<div class="list-item">
+									<span class="item-name">{$addon.name}</span></li>
+									<span class="item-value">{$addon.recurring}</span></li>
+								</div>
+							{/foreach}
+						{/if}
+					</div>
+				{/foreach}
+				
+				{foreach $addons as $num => $addon}
+					<div class="summary_addons">
+						<div class="list-item">
+							<span class="item-name"><strong>{$addon.name}</strong><br />{$addon.productname}{if $addon.domainname} - {$addon.domainname}{/if}</span>
+							<span class="item-value">{$addon.recurring}</span>
+						</div>
+					</div>
+				{/foreach}
+				
+				{foreach $domains as $num => $domain}
+					<div class="summary_domains">
+						<div class="clearfix">
+							<span class="pull-left float-left">
+								{if $domain.type eq "register"}{$LANG.orderdomainregistration}{else}{$LANG.orderdomaintransfer}{/if} - <br /><strong>{$domain.domain}</strong> - {$domain.regperiod} {$LANG.orderyears}<br />
+								{if $domain.type eq "register"}
+									<div class="dropdown domainpricingarea mb-1">
+										<button class="btn btn-default btn-default btn-xs dropdown-toggle" type="button" id="{$domain.domain}Pricing" name="{$domain.domain}Pricing" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+											{$domain.regperiod} {$domain.yearsLanguage}
+											<span class="caret"></span>
+										</button>
+										<ul class="dropdown-menu" aria-labelledby="{$domain.domain}Pricing">
+											{foreach $domain.pricing as $years => $price}
+												<li>
+													<a href="#" class="dropdown-item" onclick="OPCselectDomainPeriodInCart('{$domain.domain}', '{$price.register}', {$years}, '{if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if}');
+														return false;">
+														{$years} {if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if} @ {$price.register}
+													</a>
+												</li>
+											{/foreach}
+										</ul>
+									</div>
+								{/if}
+								{if $domain.dnsmanagement}&nbsp;&raquo; {$LANG.domaindnsmanagement}<br />{/if}
+								{if $domain.emailforwarding}&nbsp;&raquo; {$LANG.domainemailforwarding}<br />{/if}
+								{if $domain.idprotection}&nbsp;&raquo; {$LANG.domainidprotection}<br />{/if}
+
+							</span>
+							<span class="pull-right float-right">{$domain.price}<br />
+								{if $domain.type eq "register"}
+									<button type="button" class="btn btn-add-to-cart2 btn-icon btn-domain-remove" data-whois="1" data-domain="{$domain.domain}"><i class="fas fa-trash bigger-120"></i></button>                                    
+								{/if}
+							</span>
+						</div>
+					</div>
+				{/foreach}
+
+				{foreach $renewalsByType['services'] as $num => $service}
+					<div class="summary_domains">
+						<ul>
+							<li>
+								<strong>{lang key='renewService.titleAltSingular'}</strong><br />{$service.name}<br /> <i>{$service.domainName} - {$service.billingCycle}</i>
+							</li>
+							<li>{$service.recurringBeforeTax}<br /></li>
+						</ul>
+					</div>
+				{/foreach}
+		
+				{foreach $renewalsByType['domains'] as $num => $domain}
+					<div class="summary_domains">
+						<ul>
+							<li>
+								<strong>{$LANG.domainrenewal}</strong><br /><i>{$domain.domain} - {$domain.regperiod} {$LANG.orderyears}</i><br />
+								{if $domain.dnsmanagement}&nbsp;&raquo; {$LANG.domaindnsmanagement}<br />{/if}
+								{if $domain.emailforwarding}&nbsp;&raquo; {$LANG.domainemailforwarding}<br />{/if}
+								{if $domain.idprotection}&nbsp;&raquo; {$LANG.domainidprotection}<br />{/if}
+							</li>
+							<li>{$domain.price}</li>
+						</ul>
+					</div>
+				{/foreach}
+
+				{if $product.pricing.setup || $product.pricing.recurring || $product.pricing.addons}
+					<div class="subtotal">
+						{if $product.pricing.setup}
+							<div class="clearfix">
+								<span class="pull-left float-left">{$LANG.cartsetupfees}:</span>
+								<span class="pull-right float-right">{$product.pricing.setup}</span>
+							</div>
+						{/if}	
+						{foreach from=$product.pricing.recurringexcltax key=cycle item=recurring}
+							<div class="clearfix">
+								<span class="pull-left float-left text-muted">{$cycle}:</span>
+								<span class="pull-right float-right text-muted">{$recurring}</span>
+							</div>
+						{/foreach}
+					</div>
+				{/if}
+
+				<div class="subtotal">			
+					<ul>
+						<li>{$LANG.ordersubtotal}</li>
+						<li>{$subtotal}</li>
+					</ul>
+				</div>
+
+				{if $promotioncode}
+					<div class="promotion">
+						<ul>
+							<li>{$promotiondescription}</li>
+							<li>- {$discount}</li>
+						</ul>
+					</div>
+				{/if}
+
+				<div class="subtotal">			
+					{if $taxrate}
+						<ul>
+							<li>{$taxname} @ {$taxrate}%</li>
+							<li>{$taxtotal}</li>
+						</ul>
+					{/if}
+					{if $taxrate2}
+						<ul>
+							<li>{$taxname2} @ {$taxrate2}%</li>
+							<li>{$taxtotal2}</li>
+						</ul>
+					{/if}
+				</div>
+			</div>
+
+			<div class="total">
+				<div class="d-flex align-items-center">
+					<button type="button" class="btn btn-cart-contents"><i class="fas fa-chevron-up"></i></button>
+				</div>
+				<ul>
+					<li><span class="text-muted total-text">{$LANG.ordertotalduetoday}</span></li>
+					<li>{$total}</li>
+				</ul>
+			</div>
+			
+			{/if}
+			<div class="cart-loader">
+				<i class="fad fa-circle-notch fa-spin fa-2x"></i>
+			</div>
+						
+		</div>
+		
+		<div class="order_form_submit">
+			<button type="submit" id="order_submit" class="btn btn-primary btn-block btn-lg"{if $cartitems == 0} disabled="disabled"{/if}><i class="fas fa-share"></i>&nbsp;{$LANG.completeorder}</button>			
+		</div>
+	</div>
+	
+	<script type="text/javascript">
+		jQuery(document).ready(function() {
+		   jQuery("#order_submit").click(function() {
+			   jQuery("#frmCheckout").submit();
+		   });
+		});
+	</script>
+{/if}

includes/viewcart/summary-table.tpl

@@ -0,0 +1,364 @@
+<form method="post" action="{$smarty.server.PHP_SELF}?a=view">
+	<div class="panel panel-default cart-item">
+		<div class="panel-heading">
+			<div class="row">
+				<div class="{if $showqtyoptions || $showAddonQtyOptions}col-6{else}col-7{/if}">
+					<strong class="fw-500">{$LANG.orderForm.productOptions}</strong>
+				</div>
+				{if $showqtyoptions || $showAddonQtyOptions}
+					<div class="col-sm-2 text-center">
+						<strong class="fw-500">{$LANG.orderForm.qty}</strong>
+					</div>
+				{/if}
+				<div class="col">
+					<strong class="fw-500">{$LANG.orderForm.priceCycle}</strong>
+				</div>
+			</div>
+		</div>
+		{foreach $products as $num => $product}
+			<div class="panel-body">
+				<div class="row">
+					<div class="items{if $showqtyoptions || $showAddonQtyOptions} col-6{else} col-7{/if}">												
+						<span class="item-title">
+							<span class="item-heading small text-muted mb-2">{$LANG.orderproduct}</span>
+							<span class="fw-500 inline">{$product.productinfo.groupname} - {$product.productinfo.name}</span>
+							{if $product.domain}
+								<span class="item-domain">
+									<i>{$product.domain}</i>
+								</span>
+							{/if}
+						</span>
+						{if $product.configoptions}
+							<div class="item-addons">
+								<div class="prod-addons-container configuration">
+									{foreach key=confnum item=configoption from=$product.configoptions}
+										<span class="item-group inline">{$configoption.name}: </span>
+										<span class="item-name inline"> {if $configoption.type eq 1 || $configoption.type eq 2}{$configoption.option}{elseif $configoption.type eq 3}{if $configoption.qty}{$configoption.option}{else}{$LANG.no}{/if}{elseif $configoption.type eq 4}{$configoption.qty} x {$configoption.option}{/if}</span><br />
+									{/foreach}
+								</div>
+							</div>
+						{/if}
+					</div>
+					{if $showqtyoptions || $showAddonQtyOptions}
+						<div class="col-2 item-qty{if !$product.allowqty} prod-qty-empty{/if}">
+							{if $product.allowqty}
+								<input type="number" name="qty[{$num}]" value="{$product.qty}" class="form-control text-center" min="0" />
+								<button type="submit" class="btn btn-xs btn-default">
+									{$LANG.orderForm.update}
+								</button>
+							{/if}
+						</div>
+					{/if}
+					<div class="col item-price">
+						<span class="pricing-heading small text-muted mb-2">{$LANG.orderprice}</span>
+						<span>
+							<strong>{$product.pricing.totalTodayExcludingTaxSetup}</strong><span class="cycle inline">{if $product.billingcycle !="free"}/{/if}{if $product.billingcycle =="onetime"}{$LANG.orderpaymenttermonetime}{elseif $product.billingcycle eq "monthly"}{$LANG.pricingCycleShort.monthly}{elseif $product.billingcycle eq "quarterly"}{$LANG.pricingCycleShort.quarterly}{elseif $product.billingcycle eq "semiannually"}{$LANG.pricingCycleShort.semiannually}{elseif $product.billingcycle eq "annually"}{$LANG.pricingCycleShort.annually}{elseif $product.billingcycle eq "biennially"}{$LANG.pricingCycleShort.biennially}{elseif $product.billingcycle eq "triennially"}{$LANG.pricingCycleShort.triennially}{/if}</span>
+						</span>
+						{if $product.pricing.productonlysetup}
+							<small class="text-muted">+ {$product.pricing.productonlysetup->toPrefixed()} {$LANG.ordersetupfee}</small>
+						{/if}
+						{if $product.proratadate}<br /><small class="text-muted">({$LANG.orderprorata} {$product.proratadate})</small>{/if}
+					</div>
+					<div class="item-actions">
+						<a href="{$WEB_ROOT}/cart.php?a=confproduct&i={$num}" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.edit}">
+							<i class="fas fa-edit"></i>
+						</a>
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('p', '{$num}')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+
+					{if $product.addons}
+						<div class="w-100"></div>
+						<div class="item-addons col">
+							<div class="prod-addons-container">
+								{foreach $product.addons as $addonnum => $addon}
+									<div class="row">
+										<div class="{if $showqtyoptions || $showAddonQtyOptions}col-6{else}col-7{/if}">
+											<span class="addon-item-group inline">
+												{$LANG.orderaddon}:
+											</span>
+											<span class="addon-item-title inline">
+												{$addon.name}
+											</span>
+										</div>
+										{if $showqtyoptions || $showAddonQtyOptions}
+											<div class="col-4 col-md-2 addon-item-qty{if $addon.allowqty !== 2} addon-qty-empty{/if}">
+												{if $addon.allowqty === 2}
+													<input type="number" name="paddonqty[{$num}][{$addonnum}]" value="{$addon.qty}" class="form-control text-center" min="0" />
+													<button type="submit" class="btn btn-xs btn-default">
+														{$LANG.orderForm.update}
+													</button>
+												{/if}
+											</div>
+										{/if}
+										<div class="col addon-item-price">
+											{if $addon.billingcycle != "free"}
+												<span>{$addon.totaltoday}<span class="cycle inline">/{if $addon.billingcycle =="free"}{$LANG.orderpaymenttermfree}{elseif $addon.billingcycle =="onetime"}{$LANG.orderpaymenttermonetime}{elseif $addon.billingcycle eq "monthly"}{$LANG.pricingCycleShort.monthly}{elseif $addon.billingcycle eq "quarterly"}{$LANG.pricingCycleShort.quarterly}{elseif $addon.billingcycle eq "semiannually"}{$LANG.pricingCycleShort.semiannually}{elseif $addon.billingcycle eq "annually"}{$LANG.pricingCycleShort.annually}{elseif $addon.billingcycle eq "biennially"}{$LANG.pricingCycleShort.biennially}{elseif $addon.billingcycle eq "triennially"}{$LANG.pricingCycleShort.triennially}{/if}</span></span>
+											{else}
+												-
+											{/if}
+											{if $addon.setup}<small class="text-muted">+ {$addon.setup->toPrefixed()} {$LANG.ordersetupfee}</small>{/if}
+											{if $addon.isProrated}<br /><small class="text-muted">({$LANG.orderprorata} {$addon.prorataDate})</small>{/if}
+										</div>
+									</div>
+								{/foreach}
+							</div>
+						</div>
+					{/if}
+				</div>
+			</div>
+		{/foreach}
+
+		{foreach $addons as $num => $addon}
+			<div class="panel-body">
+				<div class="row">
+					 <div class="items{if $showqtyoptions || $showAddonQtyOptions} col-6{else} col-7{/if}">
+						<span class="item-title">
+							<span class="fw-500 inline">{$addon.name} - {$addon.productname}</span>
+							{if $addon.domainname}
+								<span class="item-domain">
+									<i>{$addon.domainname}</i>
+								</span>
+							{/if}
+						</span>
+						{if $addon.setup}
+							<span class="item-setup">
+								{$addon.setup} {$LANG.ordersetupfee}
+							</span>
+						{/if}
+					</div>
+					{if $showqtyoptions || $showAddonQtyOptions}
+						<div class="col-2 item-qty{if $addon.allowqty !== 2} prod-qty-empty{/if}">
+							{if $addon.allowqty === 2}
+								<input type="number" name="addonqty[{$num}]" value="{$addon.qty}" class="form-control text-center" min="0" />
+								<button type="submit" class="btn btn-xs">
+									{$LANG.orderForm.update}
+								</button>
+							{/if}
+						</div>
+					{/if}
+					<div class="col item-price">
+						{if $addon.billingcycle != "free"}
+							<span>{$addon.totaltoday}<span class="cycle inline">/{if $addon.billingcycle =="free"}{$LANG.orderpaymenttermfree}{elseif $addon.billingcycle =="onetime"}{$LANG.orderpaymenttermonetime}{elseif $addon.billingcycle eq "monthly"}{$LANG.pricingCycleShort.monthly}{elseif $addon.billingcycle eq "quarterly"}{$LANG.pricingCycleShort.quarterly}{elseif $addon.billingcycle eq "semiannually"}{$LANG.pricingCycleShort.semiannually}{elseif $addon.billingcycle eq "annually"}{$LANG.pricingCycleShort.annually}{elseif $addon.billingcycle eq "biennially"}{$LANG.pricingCycleShort.biennially}{elseif $addon.billingcycle eq "triennially"}{$LANG.pricingCycleShort.triennially}{/if}</span></span>
+						{else}
+							-
+						{/if}
+						{if $addon.setup}<small class="text-muted">{$addon.setup->toPrefixed()} {$LANG.ordersetupfee}</small>{/if}
+						{if $addon.isProrated}<br /><br /><small class="text-muted">({$LANG.orderprorata} {$addon.prorataDate})</small>{/if}						
+					</div>
+					<div class="item-actions">
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('a', '{$num}')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+				</div>
+			</div>
+		{/foreach}
+
+		{foreach $domains as $num => $domain}
+			<div class="panel-body">
+				<div class="row">
+					<div class="items{if $showqtyoptions || $showAddonQtyOptions} col-6{else} col-7{/if}">
+						<span class="item-title">
+							{if $domain.type eq "register"}<span class="fw-500 inline">{$LANG.orderdomainregistration}</span>{else}<span class="fw-500 inline">{$LANG.orderdomaintransfer}</span>{/if}
+							{if $domain.domain}
+								<span class="item-domain">
+									{$domain.domain}
+								</span>
+							{/if}															
+						</span>
+						<div class="item-addons">
+							<div class="prod-addons-container configuration">
+								{if $domain.dnsmanagement}{$LANG.domaindnsmanagement}<br />{/if}
+								{if $domain.emailforwarding}{$LANG.domainemailforwarding}<br />{/if}
+								{if $domain.idprotection}{$LANG.domainidprotection}<br />{/if}
+							</div>
+						</div>
+					</div>
+					{if $showqtyoptions || $showAddonQtyOptions}
+						<div class="prod-qty prod-qty-empty col-2">
+							
+						</div>
+					{/if}													
+					<div class="col item-price">
+						{if count($domain.pricing) == 1 || $domain.type == 'transfer'}
+							<span class="inline strong" name="{$domain.domain}Price">{$domain.price}</span>
+							<span class="cycle inline">{$domain.shortYearsLanguage}</span>
+							<span class="renewal cycle">
+								{if isset($domain.renewprice)}<small class="text-muted">{lang key='domainrenewalprice'}</small> <span class="renewal-price">{$domain.renewprice->toPrefixed()}{$domain.shortRenewalYearsLanguage}{/if}</span>
+							</span>
+						{else}
+							<span classs="d-none" name="{$domain.domain}Price"></span>
+							<div class="dropdown">
+								<button class="btn btn-default p-2 dropdown-toggle" type="button" id="{$domain.domain}Pricing" name="{$domain.domain}Pricing" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+									<strong>{$domain.price}</strong>/{$domain.regperiod}{$domain.yearsLanguage}
+									<span class="caret"></span>
+								</button>
+								<ul class="dropdown-menu" aria-labelledby="{$domain.domain}Pricing">
+									{foreach $domain.pricing as $years => $price}
+										<li>
+											<a class="dropdown-item" href="#" onclick="selectDomainPeriodInCartCustom('{$domain.domain}', '{$price.register}', {$years}, '{if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if}');return false;">
+											{$years} {if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if} @ {$price.register}
+											</a>
+										</li>
+									{/foreach}
+								</ul>
+							</div>
+							<span class="renewal cycle">
+								<small class="text-muted">{lang key='domainrenewalprice'}</small> <span class="renewal-price">{if isset($domain.renewprice)}{$domain.renewprice->toPrefixed()}{$domain.shortRenewalYearsLanguage}{/if}</span>
+							</span>
+						{/if}
+					</div>
+					<div class="item-actions">
+						<a href="{$WEB_ROOT}/cart.php?a=confdomains" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.edit}">
+							<i class="fas fa-edit"></i>
+						</a>
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('d', '{$num}')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+				</div>
+			</div>
+		{/foreach}
+
+		{foreach $renewalsByType['services'] as $num => $service}
+			<div class="panel-body">
+				<div class="row">
+					<div class="col-sm-7">
+						<span class="item-title fw-500">
+							{lang key='renewService.titleAltSingular'}
+						</span>
+							<span class="item-group">
+							{$service.name}
+						</span>
+							<span class="item-domain">
+							{$service.domainName}
+						</span>
+					</div>
+					<div class="col item-price">
+						<span>{$service.recurringBeforeTax}</span>
+						<span class="cycle">{$service.billingCycle}</span>
+					</div>
+					<div class="item-actions">
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('r','{$num}','service')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+				</div>
+			</div>
+		{/foreach}
+
+		{foreach $renewalsByType['domains'] as $num => $domain}
+			<div class="panel-body">
+				<div class="row">
+					<div class="items{if $showqtyoptions || $showAddonQtyOptions} col-6{else} col-7{/if}">
+						<span class="item-title fw-500">
+							{$LANG.domainrenewal}
+						</span>
+						<span class="item-domain">
+							{$domain.domain}
+						</span>
+						<div class="item-addons">
+							<div class="prod-addons-container configuration">
+								{if $domain.dnsmanagement}{$LANG.domaindnsmanagement}<br />{/if}
+								{if $domain.emailforwarding}{$LANG.domainemailforwarding}<br />{/if}
+								{if $domain.idprotection}{$LANG.domainidprotection}<br />{/if}
+							</div>
+						</div>
+					</div>
+					{if $showqtyoptions || $showAddonQtyOptions}
+						<div class="prod-qty prod-qty-empty col-2">
+							
+						</div>
+					{/if}													
+					<div class="col item-price">
+						<span>{$domain.price}</span>
+						<span class="cycle">{$domain.regperiod} {$LANG.orderyears}</span>
+					</div>
+					<div class="item-actions">
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('r','{$num}','domain')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+				</div>
+			</div>
+		{/foreach}
+
+		{foreach $upgrades as $num => $upgrade}
+			<div class="panel-body">
+				<div class="row">
+					<div class="items{if $showqtyoptions || $showAddonQtyOptions} col-6{else} col-7{/if}">
+						<span class="item-title">
+							{$LANG.upgrade}
+						</span>
+						<span class="item-group">
+							{if $upgrade->type == 'service'}
+								{$upgrade->originalProduct->productGroup->name}<br>{$upgrade->originalProduct->name} => {$upgrade->newProduct->name}
+							{elseif $upgrade->type == 'addon'}
+								{$upgrade->originalAddon->name} => {$upgrade->newAddon->name}
+							{/if}
+						</span>
+						<span class="item-domain">
+							{if $upgrade->type == 'service'}
+								{$upgrade->service->domain}
+							{/if}
+						</span>
+					</div>
+					{if $showqtyoptions || $showUpgradeQtyOptions}
+						<div class="col-2 item-qty{if !$upgrade->allowMultipleQuantities} prod-qty-empty{/if}">
+							{if $upgrade->allowMultipleQuantities}
+								<input type="number" name="upgradeqty[{$num}]" value="{$upgrade->qty}" class="form-control text-center" min="{$upgrade->minimumQuantity}" />
+								<button type="submit" class="btn btn-xs">
+									{$LANG.orderForm.update}
+								</button>
+							{/if}
+						</div>
+					{/if}
+					<div class="col item-price">
+						<span>{$upgrade->newRecurringAmount}</span>
+						<span class="cycle">{$upgrade->localisedNewCycle}</span>
+					</div>
+					<div class="item-actions">
+						<button type="button" class="btn btn-icon" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{$LANG.orderForm.remove}" onclick="removeItem('u', '{$num}')">
+							<i class="fas fa-trash"></i>
+						</button>
+					</div>
+				</div>
+				{if $upgrade->totalDaysInCycle > 0}
+					<div class="row row-upgrade-credit">
+						<div class="col-sm-7">
+							<span class="item-group">
+								{$LANG.upgradeCredit}
+							</span>
+							<div class="upgrade-calc-msg">
+								{lang key="upgradeCreditDescription" daysRemaining=$upgrade->daysRemaining totalDays=$upgrade->totalDaysInCycle}
+							</div>
+						</div>
+						<div class="col-sm-4 item-price">
+							<span>-{$upgrade->creditAmount}</span>
+						</div>
+					</div>
+				{/if}
+			</div>
+		{/foreach}
+
+		<div class="panel-footer white">
+			<div class="d-flex align-items-center space-between">
+				<span>
+					<a href="{$WEB_ROOT}/cart.php" class="btn btn-default btn-xs" id="continueShopping">
+						<i class="fas fa-reply"></i>
+						<span>{$LANG.orderForm.continueShopping}</span>
+					</a>
+					{if $taxenabled && !$loggedin}
+						<a data-toggle="modal" data-target="#estimate-taxes" class="btn btn-default btn-xs" href="#">{$LANG.orderForm.estimateTaxes}</a>
+					{/if}
+				</span>
+				<button type="button" class="btn btn-default btn-xs" id="btnEmptyCart">
+					<i class="fas fa-trash"></i>
+					<span>{$LANG.emptycart}</span>
+				</button>
+			</div>
+		</div>
+	</div>
+</form>

products.tpl

@@ -1,3 +1,4 @@
+{debug}
 {include file="orderforms/{$carttpl}/common.tpl"}
 
 <!-- Start of Template: orderforms/thurdata/products.tpl -->
@@ -257,7 +258,9 @@
 							</tr>
 						</table>
 						{if $product.pricing.type eq 'free'}
-							{if (count($clientActiveFree) + count($clientCardFree)) > (1 + $clientsdetails.notes|strstr:"AddTrials="|truncate:11:""|replace:"AddTrials=":"")}
+
+							{if (count($clientActiveFree) + count($clientCardFree)) > ((int)$clientsdetails.notes|strstr:"AddTrials="|truncate:11:""|replace:"AddTrials=":"")}
+
 								<a href="{$WEB_ROOT}/submitticket.php?step=2&deptid=1&subject={$LANG.moretrials} {$product.name}" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;">
 									{$LANG.request}
 								</a>
@@ -329,15 +332,12 @@
 		$(".pricing-box").owlCarousel({
 		
 			{if count($products) == 1}
-			
 				responsive:{
 					0:{
 						items:1,
 					}
 				}
-			
 			{elseif count($products) == 2}
-				
 				responsive:{
 					0:{
 						items:1,

products.tpl.dist

@@ -0,0 +1,7 @@
+{include file="orderforms/{$carttpl}/common.tpl"}
+
+{if $themesettings.orderform.cartstyle eq ""}
+	{include file="orderforms/$carttpl/includes/products/style-1.tpl"}
+{else}
+	{include file="orderforms/$carttpl/includes/products/style-2.tpl"}
+{/if}

products.tpl.org

@@ -0,0 +1,390 @@
+{include file="orderforms/{$carttpl}/common.tpl"}
+
+<!-- Start of Template: orderforms/thurdata/products.tpl -->
+
+<div style="width: 100%;text-align:center; border-bottom:1px solid silver; color:gray;">
+    			<h1>Produkte bestellen</h1>
+
+</div>
+<br />
+
+
+	{if count($products) < 4}
+	<style rel="stylesheet" type="text/css">
+		@media (min-width: 1400px) {
+			#order-clouder {
+				{if count($products) == 1}
+					margin: 0 auto; max-width: 25%; width: 25%;
+				{elseif count($products) == 2}
+					margin: 0 auto; max-width: 50%; width: 50%;
+				{elseif count($products) == 3}
+					margin: 0 auto; max-width: 75%; width: 75%;
+				{else}
+				{/if}
+			}
+		}
+		
+		@media (min-width: 992px) and (max-width: 1399px) {
+			#order-clouder {
+				{if count($products) == 1}
+					margin: 0 auto; max-width: 33%; width: 33%;
+				{elseif count($products) == 2}
+					margin: 0 auto; max-width: 75%; width: 75%;
+				{else}
+				{/if}
+			}
+		}	
+	</style>
+	{/if}
+
+
+	
+<div id="order-standard_cart">
+
+    <div class="row">
+	
+        <div class="col-md-12">
+        	<div class="TM-categories-options justify-content-center" style="padding-bottom:20px">
+				<form>
+					Produktgruppe auswählen: <select name="gid" id="gidForm" onchange="javascript:redirectToCartPage()" class="form-control">
+						<optgroup label="Product Categories">
+							{foreach key=num item=productgroup from=$productgroups}
+								<option value="{$productgroup.routePath}"{if $gid eq $productgroup.gid} selected="selected"{/if}>{$productgroup.name}</option>
+							{/foreach}
+						</optgroup>
+						<optgroup label="Actions">
+							{if $loggedin}
+								<option value="{$WEB_ROOT}/cart.php?gid=addons"{if $gid eq "addons"} selected{/if}>{$LANG.cartproductaddons}</option>
+								{if $renewalsenabled}
+									<option value="{$WEB_ROOT}/cart.php?gid=renewals"{if $gid eq "renewals"} selected{/if}>{$LANG.domainrenewals}</option>
+								{/if}
+							{/if}
+							{if $registerdomainenabled}
+								<option value="{$WEB_ROOT}/cart.php?gid=registerdomain"{if $domain eq "register"} selected{/if}>{$LANG.navregisterdomain}</option>
+							{/if}
+							{if $transferdomainenabled}
+								<option value="{$WEB_ROOT}/cart.php?gid=transferdomain"{if $domain eq "transfer"} selected{/if}>{$LANG.transferinadomain}</option>
+							{/if}
+							<option value="{$WEB_ROOT}/cart.php?a=view"{if $action eq "view"} selected{/if}>{$LANG.viewcart}</option>
+						</optgroup>
+					</select>
+				</form>
+				<br />
+				<br />
+			</div>
+
+
+{if file_exists("templates/orderforms/{$carttpl}/layouts/head.tpl")}
+	{include file="templates/orderforms/{$carttpl}/layouts/head.tpl"}
+{/if}
+
+
+			{if file_exists("templates/orderforms/{$carttpl}/layouts/head.tpl")}
+			{else}
+        		    <div class="header-lined">
+				<h2>
+					TEST {$productGroup.name}
+				</h2>
+				{if $productGroup.headline}
+					<h4 class="text-muted">{$productGroup.headline}</h4>
+				{/if}
+				{if $productGroup.tagline}
+					<p class="text-muted">{$productGroup.tagline}</p>
+				{/if}
+			    </div>
+			{/if}
+
+			
+            {if $errormessage}
+                <div class="alert alert-danger">
+                    {$errormessage}
+                </div>
+            {elseif !$productGroup}
+                <div class="alert alert-info">
+                    {lang key='orderForm.selectCategory'}
+                </div>
+            {/if}
+        </div>
+	<style>
+		.flickity-button:hover {
+			background-color: #0273d4;
+			color:white;
+		}
+	    .flickity-slider { 
+		height: 100%;
+		min-height: 100%; 
+	    }
+	    .flickity-slider > div {
+		min-height: 100%;
+	    }
+	    .flickity-page-dots {
+			position: relative;
+	        top: 30px;
+	    }
+	    .carousel-cell { 
+		height: 100% 
+	    }
+	    .prefix {
+		font-size:150%;
+		font-family: Roboto;
+	    }
+	    .cost {
+		font-size:250%;
+		font-family: Roboto;
+		font-weight:800;
+	    }
+	    .suffix {
+		font-size:250%;
+		font-weight:600;
+	    }
+	    .cycle {
+		font-size:150%;
+		font-family: Roboto;
+	    }
+	</style>
+        <div class="col-md-12">
+			<div id="order-clouder" style="max-width:unset;width:unset;">
+				<!-- <div id="products" class="cros-pricing-container"> -->
+					{if $products|@count < 3} 
+					    <div class="carousel" style="position:absolute;top:0px;left:0px;bottom:0px;right:0px;" data-flickity='{ "groupCells": true, "adaptiveHeight": true, "autoPlay": false, "prevNextButtons": false, "pageDots": false }'>
+					{else}
+					    <div class="carousel" style="position:absolute;top:0px;left:0px;bottom:0px;right:0px;" data-flickity='{ "groupCells": true, "adaptiveHeight": true, "autoPlay": false }'>
+					{/if}
+					{foreach $products as $key => $product}
+						<div class="carousell-cell" style="width:325px;height:100%;margin-right:25px;padding-left:20px;padding-right:20px;padding-bottom:20px;border:1px solid silver;border-radius:8px;" id="product{$product@iteration}"> 
+						<!-- <div class="carousell-cell" style="width:325px;height:100% !important; margin-right:25px;border:1px solid silver;border-radius:8px;" id="product{$product@iteration}"> -->
+							<table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
+							    <tr style="height:140px;">
+								<td valign="top" style="max-height:140px !important;"> <!-- Title and description -->
+								    <!-- <div style="overflow:hidden;max-height:140px !important;"> -->
+								    <!-- Class defined in Custom CSS of Croster Panel -->
+								    <div class="producttitlediv">
+									<h4 id="product{$product@iteration}-name" style="font-weight:700; font-family:Roboto; color:#2368AD;">{$product.name}</h4>
+									{if $product.featuresdesc}
+									    {$product.featuresdesc}
+									{else}
+									    <br />
+									{/if}
+								    </div>
+								</td>
+							    </tr>
+							    {if $product.bid}
+								<tr>
+								    <td> <!-- Price Simple -->
+									{$LANG.bundledeal}
+								    	    {if $product.displayprice}
+										<span class="text-secondary bolder" style="font-size: 33px;">{$product.displayPriceSimple}</span>
+									    {/if}
+								    </td>
+								</tr>
+							    {/if}
+							    <tr style="height:60px;">
+								<td> <!-- Price -->
+									{if $product.bid}
+								    {elseif $product.pricing.type eq 'free'}
+									<mark style="font-size:160%;background-color:#2368AD;">{$LANG.orderfree}</mark>
+								    {elseif $product.paytype eq "onetime"}
+									<span>{$product.pricing.onetime} </span>{$LANG.orderpaymenttermonetime}
+								    {else}
+									{*
+									{if $product.pricing.hasconfigoptions}
+								    	    {$LANG.from}
+									{/if}
+									*}
+									{assign var="ccurrency" value=$product.pricing.minprice.price->getCurrency()}
+									<span class="prefix" style="color:#2368AD;">{$ccurrency["prefix"]}</span>&nbsp;
+									<span class="cost" style="color:#2368AD;">{$product.pricing.minprice.price->toNumeric()}</span>&nbsp;
+									<span class="suffix" style="color:#2368AD;" >{$ccurrency["suffix"]}</span>
+									<span class="cycle">
+									    {if $product.pricing.minprice.cycle eq "monthly"}
+										/{$LANG.pricingCycleShort.monthly}
+									    {elseif $product.pricing.minprice.cycle eq "quarterly"}
+										/{$LANG.pricingCycleShort.quarterly}
+									    {elseif $product.pricing.minprice.cycle eq "semiannually"}
+										/{$LANG.pricingCycleShort.semiannually}
+									    {elseif $product.pricing.minprice.cycle eq "annually"}
+										/{$LANG.pricingCycleShort.annually}
+									    {elseif $product.pricing.minprice.cycle eq "biennially"}
+										/{$LANG.pricingCycleShort.biennially}
+									    {elseif $product.pricing.minprice.cycle eq "triennially"}
+									    	/{$LANG.pricingCycleShort.triennially}
+									    {/if}
+									</span>
+								    {/if}
+								    {if $product.pricing.minprice.setupFee}
+								    	<div class="small text-muted">({$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee})</div>
+								    {/if}
+								</td>
+							</tr>
+							<!-- <tr> <td> <br /></td> </tr> -->
+							<tr>
+								<td> <!-- Product Details -->
+								    <table class="plan-features collapse" id="PlanLists1" style="display:unset;">
+									{foreach from=$product.features key=feature item=value}
+									  <tr>
+                                                                              <td style="padding-right: 13px;"><b>{$feature}:</b></td>
+                                                                              <td>
+	                                                                          {if $value == "Ja"} 
+	                                                                        	<i class="far fa-check-square" style="font-size:14px"></i>
+        	                                                                  {elseif $value == "Nein"} 
+        	                                                                	<i class="far fa-square" style="font-size:14px"></i>
+        	                                                                  {elseif $value == "Optional"} 
+        	                                                                	<i class="fas fa-plus" style="font-size:14px"></i>
+            	                                                                  {else}
+                	                                                              {$value}
+                    		                                                  {/if}
+                            	                                              </td>
+									    </tr>
+									{/foreach}
+								    </table>
+								    {* 
+								    <ul class="plan-features collapse" id="PlanLists1">
+									{foreach from=$product.features key=feature item=value}
+										<li>TD {$feature} <b>{$value}</b></li>
+									{/foreach}
+								    </ul>
+								    *}
+								    {if $product.isFeatured}
+									<!-- Popular plan sticker -->
+									<div class="sticker-wrapper">
+										<div class="sticker">
+											{$LANG.featuredProduct}
+										</div>
+									</div>
+									<!-- //End popular plan sticker-->
+								    {/if}
+								</td>
+							</tr>
+						</table>
+						{if $product.pricing.type eq 'free'}
+							{if (count($clientActiveFree) + count($clientCardFree)) > (1 + $clientsdetails.notes|strstr:"AddTrials="|truncate:11:""|replace:"AddTrials=":"")}
+								<a href="{$WEB_ROOT}/submitticket.php?step=2&deptid=1&subject={$LANG.moretrials} {$product.name}" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;">
+									{$LANG.request}
+								</a>
+							{elseif in_array($product.pid, $clientPids) && !in_array($product.pid, $clientActiveFree)}
+								<a href="{$WEB_ROOT}/submitticket.php?step=2&deptid=1&subject={$LANG.tryagain} {$product.name}" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;">
+									{$LANG.tryagain}
+								</a>
+							{elseif in_array($product.pid, $clientCardFree)}
+								<a class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;pointer-events:none;">
+									{$LANG.alreadyincard}
+								</a>
+							{elseif in_array($product.pid, $clientActiveFree)}
+								<a href="{$WEB_ROOT}/clientarea.php?action=services" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;" id="product{$product@iteration}-order-button">
+									{$LANG.alreadyactive}
+								</a>
+							{else}
+								<a href="{$WEB_ROOT}/cart.php?a=add&{if $product.bid}bid={$product.bid}{else}pid={$product.pid}{/if}" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;" id="product{$product@iteration}-order-button">
+									{$LANG.ordernowbutton}
+								</a>
+							{/if}
+						{else}
+							<a href="{$WEB_ROOT}/cart.php?a=add&{if $product.bid}bid={$product.bid}{else}pid={$product.pid}{/if}" class="btn btn-primary btn-block" style="position:absolute; left:20px; bottom:10px; right:20px; height:40px; width:unset;padding-top:6.5px;" id="product{$product@iteration}-order-button">
+								{$LANG.ordernowbutton}
+							</a>
+						{/if}
+						    </table>
+						</div>
+					{/foreach}
+				    </div>
+				<!-- </div> -->
+						
+			</div>
+			
+			{if count($productGroup.features) > 0}
+				
+				<div class="space-30"></div>
+				
+				<div class="block-s3">
+					<div class="text-center">
+						<h2 class="no-margin">{$LANG.orderForm.includedWithPlans}</h2>
+					</div>
+				</div>
+					
+				<hr class="separator"></hr>
+				
+				<div class="cart-features no-margin-top">							
+					<div class="includes-features">
+						<ul class="list-features">
+							{foreach $productGroup.features as $features}
+								<li>{$features.feature}</li>
+							{/foreach}
+						</ul>
+					</div>
+				</div>
+			{/if}
+			
+		</div>
+	</div>
+	
+	
+</div>
+			
+{if file_exists("templates/orderforms/{$carttpl}/layouts/foot.tpl")}
+	{include file="templates/orderforms/{$carttpl}/layouts/foot.tpl"}
+{/if}
+
+<script type="text/javascript">
+	$(document).ready(function() {		
+		$(".pricing-box").owlCarousel({
+		
+			{if count($products) == 1}
+			
+				responsive:{
+					0:{
+						items:1,
+					}
+				}
+			
+			{elseif count($products) == 2}
+				
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					}
+				}
+			{elseif count($products) == 3}
+			
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					},
+					992:{
+						items:3,
+					}
+				}
+			{else}
+				responsive:{
+					0:{
+						items:1,
+					},
+					768:{
+						items:2,
+					},
+					992:{
+						items:3,
+					},
+					1200:{
+						items:4,
+					}
+				}			
+			{/if}
+		});
+	});
+
+    function redirectToCartPage()
+    {
+        var path = jQuery('#gidForm').val();
+        if (path) {
+            window.location.href = path;
+        }
+    }	
+</script>
+
+<!-- End of Template: orderforms/thurdata/products.tpl -->

viewcart.tpl

@@ -1,3 +1,5 @@
+<!-- templates/orderforms/thurdata/viewcart.tpl -->
+
 {if $smarty.post.onepageorder == "1"}
 
     {if $action eq 'checkout'}
@@ -601,10 +603,12 @@
                             {if $cartitems > 0}
                                 <div class="panel-footer light">
                                     <div class=" d-flex align-items-center space-between">
+					<!-- 
                                         <a href="cart.php" class="btn btn-default btn-xs" id="continueShopping">
                                             <i class="fas fa-reply"></i>
                                             <span>{$LANG.orderForm.continueShopping}</span>
                                         </a>
+					-->
                                         <button type="button" class="btn btn-default btn-xs" id="btnEmptyCart">
                                             <i class="fas fa-trash-alt"></i>
                                             <span>{$LANG.emptycart}</span>
@@ -818,9 +822,11 @@ Promocode & Steuertab -> entfernt von Thurdata auf Wunsch von Andy (Ende)*}
             <div class="text">
                 <h4>{$LANG.cartempty}</h4>
             </div>
+	    <!--
             <a href="{if $themesettings.orderform.orderopc != ""}order{else}cart{/if}.php" class="btn btn-default" id="continueShopping">
                 {$LANG.navservicesorder}
             </a>
+	    -->
         </div>
     </div>