diff --git a/config/carrier.php b/config/carrier.php
index 84b260d3c..c6da8a2f0 100644
--- a/config/carrier.php
+++ b/config/carrier.php
@@ -2,16 +2,50 @@
 
 return [
 
-    [
-        'code' => 'flatrate',
-        'title' => 'Flat Rate',
+    'flatrate' => [
+        [
+            'code' => 'flatrate_one',
+            'title' => 'Flatrate One',
+            'name' => 'fixed 20% discount for today',
+            'description' => 'this is a flat rate',
+            'status' => '1',
+            'price' => '10',
+            'type' => [
+                    'per_unit' => 'Per Unit',
+                    'per order' => 'Per Order',
+                ],
+            'class' => 'Webkul\Shipping\Helper\Rate',
+        ],
+
+        [
+        'code' => 'flatrate_two',
+        'title' => 'Flatrate Two',
+        'name' => 'fixed 50% discount till 10/10/2018',
         'description' => 'this is a flat rate',
         'status' => '1',
+        'price' => '100',
         'type' => [
                 'per unit' => 'Per Unit',
                 'per order' => 'Per Order',
             ],
+        'class' => 'Webkul\Shipping\Helper\Rate',
+        ],
+
+        [
+        'code' => 'flatrate_three',
+        'title' => 'Flatrate Three',
+        'name' => 'fixed 30% discount',
+        'description' => 'this is a flat rate',
+        'status' => '1',
+        'price' => '1000',
+        'type' => [
+                'per unit' => 'Per Unit',
+                'per order' => 'Per Order',
+            ],
+        'class' => 'Webkul\Shipping\Helper\Rate',
+        ]
     ]
+
 ]
 
 ?>
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/attributes/create.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/attributes/create.blade.php
index b6b37b540..836447e9d 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/attributes/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/attributes/create.blade.php
@@ -73,9 +73,9 @@
                     <div class="hide">
                         <accordian :title="'{{ __('admin::app.catalog.attributes.options') }}'" :active="true" :id="'options'">
                             <div slot="body">
-                            
+
                                 <option-wrapper></option-wrapper>
-                                
+
                             </div>
                         </accordian>
                     </div>
@@ -122,7 +122,7 @@
                                     <option value="0">{{ __('admin::app.catalog.attributes.no') }}</option>
                                 </select>
                             </div>
-                        
+
                             <div class="control-group">
                                 <label for="value_per_locale">{{ __('admin::app.catalog.attributes.value_per_locale') }}</label>
                                 <select class="control" id="value_per_locale" name="value_per_locale">
@@ -130,7 +130,7 @@
                                     <option value="1">{{ __('admin::app.catalog.attributes.yes') }}</option>
                                 </select>
                             </div>
-                        
+
                             <div class="control-group">
                                 <label for="value_per_channel">{{ __('admin::app.catalog.attributes.value_per_channel') }}</label>
                                 <select class="control" id="value_per_channel" name="value_per_channel">
@@ -138,7 +138,7 @@
                                     <option value="1">{{ __('admin::app.catalog.attributes.yes') }}</option>
                                 </select>
                             </div>
-                        
+
                             <div class="control-group">
                                 <label for="is_filterable">{{ __('admin::app.catalog.attributes.is_filterable') }}</label>
                                 <select class="control" id="is_filterable" name="is_filterable">
@@ -146,7 +146,7 @@
                                     <option value="1">{{ __('admin::app.catalog.attributes.yes') }}</option>
                                 </select>
                             </div>
-                        
+
                             <div class="control-group">
                                 <label for="is_configurable">{{ __('admin::app.catalog.attributes.is_configurable') }}</label>
                                 <select class="control" id="is_configurable" name="is_configurable">
@@ -154,7 +154,7 @@
                                     <option value="1">{{ __('admin::app.catalog.attributes.yes') }}</option>
                                 </select>
                             </div>
-                        
+
                             <div class="control-group">
                                 <label for="is_visible_on_front">{{ __('admin::app.catalog.attributes.is_visible_on_front') }}</label>
                                 <select class="control" id="is_visible_on_front" name="is_visible_on_front">
@@ -184,7 +184,7 @@
                             @foreach(Webkul\Core\Models\Locale::all() as $locale)
 
                                 <th>{{ $locale->name . ' (' . $locale->code . ')' }}</th>
-                            
+
                             @endforeach
 
                             <th>{{ __('admin::app.catalog.attributes.position') }}</th>
@@ -192,7 +192,7 @@
                             <th></th>
                         </tr>
                     </thead>
-                        
+
                     <tbody>
                         <tr v-for="row in optionRows">
                             <td>
@@ -244,7 +244,7 @@
 
             var optionWrapper = Vue.component('option-wrapper', {
 
-                template: '#options-template', 
+                template: '#options-template',
 
                 data: () => ({
                     optionRowCount: 0,
diff --git a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php
new file mode 100644
index 000000000..4221017eb
--- /dev/null
+++ b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php
@@ -0,0 +1,45 @@
+<?php
+
+namespace Webkul\Cart\Http\Controllers;
+use Illuminate\Routing\Controller;
+use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use Auth;
+
+/**
+ * Chekout controller for the customer
+ * and guest for placing order
+ *
+ * @author    Rahul Shukla <rahulshukla.symfony517@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class CheckoutController extends Controller
+{
+
+    /**
+     * Display a listing of the resource.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    protected $_config;
+
+    public function __construct()
+    {
+        // $this->middleware(['customer', 'guest']);
+
+        $this->_config = request('_config');
+    }
+
+    /**
+     * Display a listing of the resource.
+     *
+     * @return \Illuminate\Http\Response
+    */
+    public function index()
+    {
+        $customer_id = auth()->guard('customer')->user();
+
+        return view($this->_config['view'],compact('customer_id'));
+    }
+
+}
\ No newline at end of file
diff --git a/packages/Webkul/Cart/src/Providers/CartServiceProvider.php b/packages/Webkul/Cart/src/Providers/CartServiceProvider.php
index 205ed4a82..f2ad3c67f 100644
--- a/packages/Webkul/Cart/src/Providers/CartServiceProvider.php
+++ b/packages/Webkul/Cart/src/Providers/CartServiceProvider.php
@@ -11,7 +11,7 @@ class CartServiceProvider extends ServiceProvider
     public function boot(Router $router)
     {
 
-        $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
+        // $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
 
         $this->loadMigrationsFrom(__DIR__ . '/../Database/migrations');
     }
diff --git a/packages/Webkul/Product/src/Models/Product.php b/packages/Webkul/Product/src/Models/Product.php
index 1d761c523..77f876c58 100644
--- a/packages/Webkul/Product/src/Models/Product.php
+++ b/packages/Webkul/Product/src/Models/Product.php
@@ -132,6 +132,22 @@ class Product extends Model
         return $this->attribute_family->custom_attributes->pluck('code')->contains($attribute);
     }
 
+    /**
+     * @param string $key
+     *
+     * @return bool
+     */
+    public function isSaleable()
+    {
+        if($this->status) {
+            if($this->inventories->sum('qty')) {
+                return true;
+            }
+        }
+    
+        return false;
+    }
+
     /**
      * Get an attribute from the model.
      *
diff --git a/packages/Webkul/Product/src/Product/ConfigurableOption.php b/packages/Webkul/Product/src/Product/ConfigurableOption.php
new file mode 100644
index 000000000..6cb84ad3d
--- /dev/null
+++ b/packages/Webkul/Product/src/Product/ConfigurableOption.php
@@ -0,0 +1,228 @@
+<?php
+
+namespace Webkul\Product\Product;
+
+use Webkul\Attribute\Repositories\AttributeOptionRepository as AttributeOption;
+use Webkul\Product\Product\Gallery;
+use Webkul\Product\Product\Price;
+
+class ConfigurableOption extends AbstractProduct
+{
+    /**
+     * AttributeOptionRepository object
+     *
+     * @var array
+     */
+    protected $attributeOption;
+
+    /**
+     * Gallery object
+     *
+     * @var array
+     */
+    protected $gallery;
+
+    /**
+     * Price object
+     *
+     * @var array
+     */
+    protected $price;
+
+    /**
+     * Create a new controller instance.
+     *
+     * @param  Webkul\Attribute\Repositories\AttributeOptionRepository $attributeOption
+     * @param  Webkul\Product\Product\Gallery                          $gallery
+     * @param  Webkul\Product\Product\Price                            $price
+     * @return void
+     */
+    public function __construct(
+        AttributeOption $attributeOption,
+        Gallery $gallery,
+        Price $price
+    )
+    {
+        $this->attributeOption = $attributeOption;
+
+        $this->gallery = $gallery;
+
+        $this->price = $price;
+    }
+
+    /**
+     * Returns the allowed variants
+     *
+     * @param Product $product
+     * @return float
+     */
+    public function getAllowProducts($product)
+    {
+        $variants = [];
+
+        foreach ($product->variants as $variant) {
+            if ($variant->isSaleable()) {
+                $variants[] = $variant;
+            }
+        }
+        
+        return $variants;
+    }
+
+    /**
+     * Returns the allowed variants JSON
+     *
+     * @param Product $product
+     * @return float
+     */
+    public function getConfigurationConfig($product)
+    {
+        $options = $this->getOptions($product, $this->getAllowProducts($product));
+
+        $config = [
+            'attributes' => $this->getAttributesData($product, $options),
+            'index' => isset($options['index']) ? $options['index'] : [],
+            'variant_prices' => $this->getVariantPrices($product),
+            'variant_images' => $this->getVariantImages($product),
+            'chooseText' => trans('shop::app.products.choose-option')
+        ];
+
+        return $config;
+    }
+
+    /**
+     * Get allowed attributes
+     *
+     * @param Product $product
+     * @return array
+     */
+    public function getAllowAttributes($product)
+    {
+        return $product->super_attributes;
+    }
+
+    /**
+     * Get Configurable Product Options
+     *
+     * @param Product $currentProduct
+     * @param array $allowedProducts
+     * @return array
+     */
+    public function getOptions($currentProduct, $allowedProducts)
+    {
+        $options = [];
+
+        $allowAttributes = $this->getAllowAttributes($currentProduct);
+
+        foreach ($allowedProducts as $product) {
+
+            $productId = $product->id;
+
+            foreach ($allowAttributes as $productAttribute) {
+                $productAttributeId = $productAttribute->id;
+
+                $attributeValue = $product->{$productAttribute->code};
+
+                $options[$productAttributeId][$attributeValue][] = $productId;
+
+                $options['index'][$productId][$productAttributeId] = $attributeValue;
+            }
+        }
+
+        return $options;
+    }
+
+    /**
+     * Get product attributes
+     *
+     * @param Product $product
+     * @param array $options
+     * @return array
+     */
+    public function getAttributesData($product, array $options = [])
+    {
+        $defaultValues = [];
+
+        $attributes = [];
+
+        foreach ($product->super_attributes as $attribute) {
+
+            $attributeOptionsData = $this->getAttributeOptionsData($attribute, $options);
+
+            if ($attributeOptionsData) {
+                $attributeId = $attribute->id;
+
+                $attributes[] = [
+                    'id' => $attributeId,
+                    'code' => $attribute->code,
+                    'label' => $attribute->name,
+                    'options' => $attributeOptionsData
+                ];
+            }
+        }
+
+        return $attributes;
+    }
+
+    /**
+     * @param Attribute $attribute
+     * @param array $options
+     * @return array
+     */
+    protected function getAttributeOptionsData($attribute, $options)
+    {
+        $attributeOptionsData = [];
+
+        foreach ($attribute->options as $attributeOption) {
+
+            $optionId = $attributeOption->id;
+
+            if(isset($options[$attribute->id][$optionId])) {
+                $attributeOptionsData[] = [
+                    'id' => $optionId,
+                    'label' => $attributeOption->label,
+                    'products' => $options[$attribute->id][$optionId]
+                ];
+            }
+        }
+
+        return $attributeOptionsData;
+    }
+
+    /**
+     * Get product prices for configurable variations
+     *
+     * @param Product $product
+     * @return array
+     */
+    protected function getVariantPrices($product)
+    {
+        $prices = [];
+
+        foreach ($this->getAllowProducts($product) as $variant) {
+            $prices[$variant->id] = [
+                'regular_price' => $variant->price,
+                'final_price' => $this->price->getMinimalPrice($variant),
+            ];
+        }
+
+        return $prices;
+    }
+
+    /**
+     * Get product images for configurable variations
+     *
+     * @param Product $product
+     * @return array
+     */
+    protected function getVariantImages($product)
+    {
+        $images = [];
+
+        foreach ($this->getAllowProducts($product) as $variant) {
+            $images[$variant->id] = $this->gallery->getImages($variant);
+        }
+
+        return $images;
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Product/src/Product/Gallery.php b/packages/Webkul/Product/src/Product/Gallery.php
new file mode 100644
index 000000000..7e47592c1
--- /dev/null
+++ b/packages/Webkul/Product/src/Product/Gallery.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace Webkul\Product\Product;
+
+use Webkul\Attribute\Repositories\AttributeOptionRepository as AttributeOption;
+
+class Gallery extends AbstractProduct
+{
+    /**
+     * Retrieve collection of gallery images
+     *
+     * @param Product $product
+     * @return array
+     */
+    public function getImages($product)
+    {
+        $images[] = [
+            'small_image_url' => '',
+            'medium_image_url' => '',
+            'large_image_url' => '',
+        ];
+
+        return $images;
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Product/src/Product/Price.php b/packages/Webkul/Product/src/Product/Price.php
index f07417649..98e10e4f4 100644
--- a/packages/Webkul/Product/src/Product/Price.php
+++ b/packages/Webkul/Product/src/Product/Price.php
@@ -78,7 +78,7 @@ class Price extends AbstractProduct
     public function getSpecialPrice($product)
     {
         if($this->haveSpecialPrice($product)) {
-                return $product->special_price;
+            return $product->special_price;
         } else {
             return $product->price;
         }
diff --git a/packages/Webkul/Product/src/Product/Review.php b/packages/Webkul/Product/src/Product/Review.php
index d359d4729..3fc979da2 100644
--- a/packages/Webkul/Product/src/Product/Review.php
+++ b/packages/Webkul/Product/src/Product/Review.php
@@ -4,6 +4,17 @@ namespace Webkul\Product\Product;
 
 class Review extends AbstractProduct
 {
+    /**
+     * Returns the product's avg rating
+     *
+    * @param Product $product
+     * @return float
+     */
+    public function getReviews($product)
+    {
+        return $product->reviews()->where('status', 'approved');
+    }
+
     /**
      * Returns the product's avg rating
      *
@@ -12,7 +23,7 @@ class Review extends AbstractProduct
      */
     public function getAverageRating($product)
     {
-        return round($product->reviews->where('status',1)->average('rating'));
+        return number_format(round($product->reviews()->where('status', 'approved')->average('rating'), 2), 1);
     }
 
     /**
@@ -23,7 +34,7 @@ class Review extends AbstractProduct
      */
     public function getTotalReviews($product)
     {
-        return $product->reviews()->where('status',1)->count();
+        return $product->reviews()->where('status', 'approved')->count();
     }
 
     /**
diff --git a/packages/Webkul/Shipping/src/Carrier/FlatRate.php b/packages/Webkul/Shipping/src/Carrier/FlatRate.php
new file mode 100644
index 000000000..62d0d7593
--- /dev/null
+++ b/packages/Webkul/Shipping/src/Carrier/FlatRate.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace Webkul\Shipping\Carrier;
+
+use Webkul\Shipping\Contracts\AbstractShipping;
+use Config;
+
+/**
+ * Class Rate.
+ *
+ */
+class FlatRate extends AbstractShipping
+{
+
+    public function calculate()
+    {
+        $all = Config::get('carrier');
+        return $all;
+    }
+
+
+
+}
\ No newline at end of file
diff --git a/packages/Webkul/Shipping/src/Contracts/ShippingInterface.php b/packages/Webkul/Shipping/src/Contracts/AbstractShipping.php
similarity index 54%
rename from packages/Webkul/Shipping/src/Contracts/ShippingInterface.php
rename to packages/Webkul/Shipping/src/Contracts/AbstractShipping.php
index aa2db0685..5f016722a 100644
--- a/packages/Webkul/Shipping/src/Contracts/ShippingInterface.php
+++ b/packages/Webkul/Shipping/src/Contracts/AbstractShipping.php
@@ -3,15 +3,13 @@
 namespace Webkul\Shipping\Contracts;
 
 /**
- * Interface ShippingInterface
+ * Abstract class Shipping
  * @author Rahul Shukla <rahulshukla.symfony517@webkul.com>
  */
-
-interface ShippingInterface
+abstract class AbstractShipping
 {
 
-    public function calculate();
-
+    abstract public function calculate();
 
 }
 
diff --git a/packages/Webkul/Shipping/src/Helper/Rate.php b/packages/Webkul/Shipping/src/Helper/Rate.php
new file mode 100644
index 000000000..d500829df
--- /dev/null
+++ b/packages/Webkul/Shipping/src/Helper/Rate.php
@@ -0,0 +1,31 @@
+<?php
+
+namespace Webkul\Shipping\Helper;
+
+use Webkul\Shipping\Carrier\FlatRate;
+
+/**
+ * Class Rate.
+ *
+ */
+class Rate extends FlatRate
+{
+    public function collectRates()
+    {
+        $data = $this->calculate();
+        $rates =[];
+
+        foreach($data as  $rate){
+            foreach($rate as $flat){
+                $rates[$flat['name']] = $flat['price'];
+            }
+        }
+
+        return $rates;
+    }
+
+}
+
+
+
+
diff --git a/packages/Webkul/Shipping/src/Helpers/Rate.php b/packages/Webkul/Shipping/src/Helpers/Rate.php
deleted file mode 100644
index bdc4b9cda..000000000
--- a/packages/Webkul/Shipping/src/Helpers/Rate.php
+++ /dev/null
@@ -1,21 +0,0 @@
-<?php
-
-namespace App\Shipping\Helpers;
-
-
-use Webkul\Shipping\Contracts\ShippingInterface;
-
-/**
- * Class Rate.
- *
- * @package namespace App\Criteria;
- */
-class Rate implements ShippingInterface
-{
-
-    public function calculate()
-    {
-        return 'gg';
-    }
-}
-
diff --git a/packages/Webkul/Shipping/src/Providers/ShippingServiceProvider.php b/packages/Webkul/Shipping/src/Providers/ShippingServiceProvider.php
index ab04b444d..7dc88b160 100644
--- a/packages/Webkul/Shipping/src/Providers/ShippingServiceProvider.php
+++ b/packages/Webkul/Shipping/src/Providers/ShippingServiceProvider.php
@@ -16,9 +16,13 @@ class ShippingServiceProvider extends ServiceProvider
     public function boot(Router $router)
     {
 
-        $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
+        // $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
 
-        $this->loadMigrationsFrom(__DIR__ . '/../Database/migrations');
+        // $this->loadMigrationsFrom(__DIR__ . '/../Database/migrations');
+
+        // include __DIR__ . '/../Http/routes.php';
+
+        // $this->loadViewsFrom(__DIR__ . '/../Resources/views', 'shipping');
     }
 
     /**
diff --git a/packages/Webkul/Shop/src/Http/routes.php b/packages/Webkul/Shop/src/Http/routes.php
index 75019b238..a960ff3dc 100644
--- a/packages/Webkul/Shop/src/Http/routes.php
+++ b/packages/Webkul/Shop/src/Http/routes.php
@@ -10,10 +10,15 @@ Route::group(['middleware' => ['web']], function () {
         'view' => 'shop::products.index'
     ]);
 
+    Route::get('/checkout', 'Webkul\Cart\Http\Controllers\CheckoutController@index')->defaults('_config', [
+        'view' => 'shop::customers.checkout.index'
+    ])->name('shop.checkout');
+
+
     /* dummy routes */
     Route::view('/customer/order','shop::customers.account.orders.index');
 
-    Route::view('/customer/checkout','shop::customers.checkout.index');
+    // Route::view('/customer/checkout','shop::customers.checkout.index');
 
     Route::view('/customer/signin','shop::customers.checkout.signin');
 
@@ -22,6 +27,10 @@ Route::group(['middleware' => ['web']], function () {
     Route::view('/customer/payment_method','shop::customers.checkout.payment-method');
 
     Route::view('/customer/payment_complete','shop::customers.checkout.complete');
+
+    Route::view('/test','shop::index');
+
+
     /* dummy routes ends here */
 
 
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
index 87047f10b..0606f90fe 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@@ -376,7 +376,7 @@ body {
                 height: 32px;
                 margin-bottom: 14px;
                 border-bottom: 1px solid #e8e8e8;
-                
+
                 span {
                     font-size: 16px;
                     color: #242424;
@@ -397,11 +397,11 @@ body {
                 width: 100%;
                 height: 100px;
             }
-    
+
             .nav > li {
                 float: none;
                 border-bottom: 1px solid #e8e8e8;
-               
+
                 a {
                     margin-left: 10px;
                 }
@@ -410,13 +410,13 @@ body {
                    float: right;
                    margin-top: 5px;
                    margin-right: 5px;
-                } 
+                }
             }
 
             .nav > li:first-child {
                 border-top: 1px solid #e8e8e8;
             }
-    
+
             .nav > li:last-child {
                 float:none;
 
@@ -425,14 +425,14 @@ body {
                     color: #FF6472;
                     letter-spacing: -0.38px;
                 }
-    
+
                 img {
                     margin-left: 20px;
                 }
             }
-    
+
             /* submenu positioning*/
-    
+
             .nav ul {
                 position: absolute;
                 white-space: nowrap;
@@ -441,26 +441,26 @@ body {
                 z-index: 1;
                 left: -99999em;
             }
-    
+
             .nav > li:hover > ul {
                 left: auto;
                 min-width: 100%;
             }
-    
+
             .nav > li li:hover > ul {
                 left: 100%;
                 margin-left: 1px;
                 top: -1px;
             }
-    
+
             .nav > li:hover > a:first-child:nth-last-child(2):before {
                 margin-top:-5px
             }
-    
+
             .nav li li > a:first-child:nth-last-child(2):before {
                 margin-top: -5px
             }
-    
+
             .nav li li:hover > a:first-child:nth-last-child(2):before {
                 right: 10px;
             }
@@ -533,11 +533,11 @@ body {
                 width: 100%;
                 height: 100px;
             }
-    
+
             .nav > li {
                 float: none;
                 border-bottom: 1px solid #e8e8e8;
-               
+
                 a {
                     margin-left: 10px;
                 }
@@ -546,13 +546,13 @@ body {
                    float: right;
                    margin-top: 5px;
                    margin-right: 5px;
-                } 
+                }
             }
 
             .nav > li:first-child {
                 border-top: 1px solid #e8e8e8;
             }
-    
+
             .nav > li:last-child {
                 float:none;
 
@@ -561,14 +561,14 @@ body {
                     color: #FF6472;
                     letter-spacing: -0.38px;
                 }
-    
+
                 img {
                     margin-left: 20px;
                 }
             }
-    
+
             /* submenu positioning*/
-    
+
             .nav ul {
                 position: absolute;
                 white-space: nowrap;
@@ -577,26 +577,26 @@ body {
                 z-index: 1;
                 left: -99999em;
             }
-    
+
             .nav > li:hover > ul {
                 left: auto;
                 min-width: 100%;
             }
-    
+
             .nav > li li:hover > ul {
                 left: 100%;
                 margin-left: 1px;
                 top: -1px;
             }
-    
+
             .nav > li:hover > a:first-child:nth-last-child(2):before {
                 margin-top:-5px
             }
-    
+
             .nav li li > a:first-child:nth-last-child(2):before {
                 margin-top: -5px
             }
-    
+
             .nav li li:hover > a:first-child:nth-last-child(2):before {
                 right: 10px;
             }
@@ -826,6 +826,15 @@ section.slider-block {
         .product-ratings {
             width: 100%;
             margin-bottom: 14px;
+
+            .icon {
+                width: 16px;
+                height: 16px;
+            }
+
+            .total-reviews {
+                display: none;
+            }
         }
 
         .cart-fav-seg {
@@ -1315,15 +1324,10 @@ section.slider-block {
     //address form ends
 }
 //account ends here
-
-
-
-
 //customers page css ends here
 
 // product pages css starts here
-
-section.product-detail, section.product-review {
+section.product-detail {
     font-size: 16px;
     color: $product-font-color;
 
@@ -1479,20 +1483,32 @@ section.product-detail, section.product-review {
         }
 
         .details {
+            .product-price {
+                margin-bottom: 14px;
+            }
+
+            .product-ratings {
+                margin-bottom: 20px;
+
+                .icon {
+                    width: 16px;
+                    height: 16px;
+                }
+
+                .total-reviews {
+                    display: inline-block;
+                    margin-left: 15px;
+                }
+            }
 
             .product-heading {
                 font-size: 24px;
                 color: $product-font-color;
-                margin-bottom: 14px;
-            }
-
-            .rating {
-                color: $product-font-color;
-                margin-bottom: 14px;
+                margin-bottom: 15px;
             }
 
             .product-price {
-                margin-bottom: 14px;
+                margin-bottom: 15px;
                 font-size: 24px;
 
                 .special-price {
@@ -1501,11 +1517,13 @@ section.product-detail, section.product-review {
             }
 
             .stock-status {
-                margin-bottom: 14px;
+                margin-bottom: 15px;
             }
 
             .description {
-                margin-bottom: 14px;
+                margin-bottom: 15px;
+                padding-bottom: 15px;
+                border-bottom: solid 1px rgba(162, 162, 162, 0.2)
             }
 
             .full-specifications {
@@ -1528,145 +1546,81 @@ section.product-detail, section.product-review {
             .attributes {
                 display: block;
                 width: 100%;
-
-                .attribute {
-                    height: 39px;
-                    margin-bottom: 20px;
-
-                    .title {
-                        float: left;
-                        height: 100%;
-                        min-width: 130px;
-                        padding-top: 9px;
-                    }
-
-                    .values {
-                        display: inline-flex;
-
-                        .colors {
-                            margin-right:5px;
-                        }
-                        .colors:last-child {
-                            margin-right: 0;
-                        }
-
-                        .red {
-                            height: 37px;
-                            width: 37px;
-                            background: red;
-                            border: 1px solid $border-color;
-                            border-radius:  2px;
-                        }
-
-                        .blue {
-                            height: 37px;
-                            width: 37px;
-                            background: blue;
-                            border: 1px solid $border-color;
-                            border-radius:  2px;
-                        }
-
-                        .green {
-                            height: 37px;
-                            width: 37px;
-                            background: green;
-                            border: 1px solid $border-color;
-                            border-radius:  2px;
-                        }
-
-                        .size {
-                            margin-right:5px;
-                            line-height: 38px;
-                            height: 37px;
-                            width: 60px;
-                            border: 1px solid $border-color;
-                            border-radius:  2px;
-                            text-align: center;
-                            vertical-align: middle;
-                        }
-                        .size:last-child {
-                            margin-right: 0;
-                        }
-
-                        .quantity {
-                            .values {
-                                .control {
-                                    height: 37px !important;
-                                    width: 30px !important;
-                                }
-                            }
-                        }
-                    }
-                }
+                border-bottom: solid 1px rgba(162, 162, 162, 0.2);
             }
 
             .full-description {
                 font-size: 16px;
             }
+        }
+    }
+}
 
-            .rating-reviews {
-                margin-top: 30px;
+.rating-reviews {
 
-                .title {
-                    margin-bottom: 15px;
-                    font-weight: 600;
-                }
+    .rating-header {
+        font-weight: 600;
+        padding: 20px 0;
+    }
 
-                .overall {
-                    margin-bottom: 5px;
+    .stars {
+        .icon {
+            width: 16px;
+            height: 16px;
+        }
+    }
 
-                    .review-info {
-                        .number {
-                            font-size: 34px;
-                        }
-                    }
+    .overall {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-between;
 
-                    button {
-                        float: right;
-                        border-radius: 0px !important;
-                    }
-
-                }
-
-                .reviews {
-                    margin-top: 34px;
-                    margin-bottom: 80px;
-
-                    .review {
-                        margin-bottom: 25px;
-
-                        .stars {
-                            margin-bottom: 15px;
-                            display: inline-block;
-
-                            .icon {
-                                width: 18px;
-                                height: 18px;
-                            }
-                        }
-
-                        .message {
-                            margin-bottom: 10px;
-                        }
-
-                        .reviewer-details {
-                            color: #5E5E5E;
-                        }
-                    }
-
-                    .view-all {
-                        margin-top:15px;
-                        color: $logo-color;
-                        margin-bottom:15px;
-                    }
-                }
+        .review-info {
+            .number {
+                font-size: 34px;
             }
+
+            .total-reviews {
+                margin-top: 10px;
+            }
+        }
+    }
+
+    .reviews {
+        margin-top: 40px;
+        margin-bottom: 40px;
+
+        .review {
+            margin-bottom: 25px;
+
+            .title {
+                margin-bottom: 5px;
+            }
+
+            .stars {
+                margin-bottom: 15px;
+                display: inline-block;
+            }
+
+            .message {
+                margin-bottom: 10px;
+            }
+
+            .reviewer-details {
+                color: #5E5E5E;
+            }
+        }
+
+        .view-all {
+            margin-top:15px;
+            color: $logo-color;
+            margin-bottom:15px;
         }
     }
 }
 
 /* cart pages and elements css begins here */
-
 section.cart {
     color: $product-font-color;
     font-size: 16px;
@@ -1975,14 +1929,14 @@ section.cart {
 
         .placed-on {
             display: flex;
-            flex-direction: row;  
-    
+            flex-direction: row;
+
             .place-text {
                 width: 210px;
 
                 span {
                     color: #5E5E5E;
-                    letter-spacing: -0.12px;  
+                    letter-spacing: -0.12px;
                     font-size: 16px;
                 }
 
@@ -1992,10 +1946,10 @@ section.cart {
             }
 
             .place-date {
-               
+
                 span {
                     color: #5E5E5E;
-                    letter-spacing: -0.12px;  
+                    letter-spacing: -0.12px;
                     font-size: 16px;
                 }
             }
@@ -2003,24 +1957,24 @@ section.cart {
 
         .payment-status {
             display: flex;
-            flex-direction: row;  
+            flex-direction: row;
             margin-top: 22px;
-    
+
             .payment-text {
                 width: 210px;
 
                 span {
                     color: #5E5E5E;
-                    letter-spacing: -0.12px;  
+                    letter-spacing: -0.12px;
                     font-size: 16px;
                 }
             }
 
             .status {
-               
+
                 span {
                     color: #5E5E5E;
-                    letter-spacing: -0.12px;  
+                    letter-spacing: -0.12px;
                     font-size: 16px;
                 }
             }
@@ -2036,10 +1990,10 @@ section.cart {
     }
 
     .order-details{
-        width:100%; 
+        width:100%;
         margin-top: 2.5%;
         margin-bottom: 2%;
-    
+
         .detail{
             font-size: 18px;
             color: #8E8E8E;
@@ -2055,7 +2009,7 @@ section.cart {
             td {
                 padding : 16px;
             }
-        } 
+        }
     }
 
     .total {
@@ -2067,7 +2021,7 @@ section.cart {
             float: right;
 
             .sub-total {
-            
+
                 span {
                     font-size: 14px;  font-size: 14px;
                     color: #3A3A3A;
@@ -2091,11 +2045,11 @@ section.cart {
                     font-size: 14px;
                     color: #3A3A3A;
                 }
-    
+
                 .left {
                     margin-left: 24px;
                 }
-    
+
                 .middle {
                     margin-right: 5px;
                     margin-left: 5px;
@@ -2170,13 +2124,13 @@ section.cart {
         vertical-align: middle;
         background: #e8e8e8;
     }
-    
+
     .order-information {
         display: flex;
         flex-direction: row;
         justify-content: space-between;
         margin-top: 2.3%;
-        
+
         .order-address-method {
             width : 250px;
 
@@ -2185,7 +2139,7 @@ section.cart {
                 color: #8E8E8E;
             }
         }
-    
+
         p {
             font-size: 16px;
             color: #3A3A3A;
@@ -2210,8 +2164,8 @@ section.cart {
         .order-section-head-small {
             display: block;
             margin-top: -15px;
-            
-            span {  
+
+            span {
                 display:inline-block;
                 width:33.3%;
             }
@@ -2259,7 +2213,7 @@ section.cart {
 
             .placed-on {
                 display: flex;
-                flex-direction: column;  
+                flex-direction: column;
 
                 .place-text {
                     width:100%;
@@ -2292,10 +2246,10 @@ section.cart {
 
             .payment-status {
                 display: flex;
-                flex-direction: column;  
-               
+                flex-direction: column;
+
                 .payment-text {
-            
+
                     span {
                         font-size: 14px;
                     }
@@ -2305,7 +2259,7 @@ section.cart {
                     margin-top: 2px;
                 }
             }
-    
+
             .horizontal-rule {
                 margin-top: 1.1%;
                 width: 100%;
@@ -2322,11 +2276,11 @@ section.cart {
         .total {
             margin-top: 5%;
             height: 130px;
-    
+
             .calculate {
                 width: 100%;
                 float: left;
-               
+
                 .sub-total {
 
                     .left {
@@ -2343,13 +2297,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .ship-handle {
-            
+
                     .left {
                         margin-left: 0px;
                     }
-        
+
                     .middle {
                        display: none;
                     }
@@ -2359,13 +2313,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .discount {
-                    
+
                     .left {
                         margin-left: 0px;
                     }
-    
+
                     .middle {
                         display: none;
                     }
@@ -2375,9 +2329,9 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .grand-total {
-                   
+
                     .left {
                         margin-left: 0px;
                     }
@@ -2391,13 +2345,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .due {
-                    
+
                     .left {
                         margin-left: 0px;
                     }
-    
+
                     .middle {
                         display: none;
                     }
@@ -2417,23 +2371,23 @@ section.cart {
         .table {
             display:none;
         }
-        
+
         .product-config {
             border: 1px solid #E8E8E8;
             height: 19%;
             width:100%;
-            margin-top: 10px;   
+            margin-top: 10px;
             display: block;
 
             .product-attribute {
                 display: flex;
-                flex-direction: row; 
-        
+                flex-direction: row;
+
                 .product-property {
                     width: 30%;
                     margin-top: 10px;
                     margin-left: 5px;
-                    
+
                     span {
                         font-size: 14px;
                         color: #5E5E5E;
@@ -2457,7 +2411,7 @@ section.cart {
 
         .order-information {
             flex-direction: column;
-           
+
             .order-address-method {
                 width : 250px;
             }
@@ -2490,8 +2444,8 @@ section.cart {
         .order-section-head-small {
             display: block;
             margin-top: -15px;
-            
-            span {  
+
+            span {
                 display:inline-block;
                 width:33.3%;
             }
@@ -2539,7 +2493,7 @@ section.cart {
 
             .placed-on {
                 display: flex;
-                flex-direction: column;  
+                flex-direction: column;
 
                 .place-text {
                     width:100%;
@@ -2572,10 +2526,10 @@ section.cart {
 
             .payment-status {
                 display: flex;
-                flex-direction: column;  
-               
+                flex-direction: column;
+
                 .payment-text {
-            
+
                     span {
                         font-size: 14px;
                     }
@@ -2585,7 +2539,7 @@ section.cart {
                     margin-top: 2px;
                 }
             }
-    
+
             .horizontal-rule {
                 margin-top: 1.1%;
                 width: 100%;
@@ -2602,11 +2556,11 @@ section.cart {
         .total {
             margin-top: 5%;
             height: 130px;
-    
+
             .calculate {
                 width: 100%;
                 float: left;
-               
+
                 .sub-total {
 
                     .left {
@@ -2623,13 +2577,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .ship-handle {
-            
+
                     .left {
                         margin-left: 0px;
                     }
-        
+
                     .middle {
                        display: none;
                     }
@@ -2639,13 +2593,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .discount {
-                    
+
                     .left {
                         margin-left: 0px;
                     }
-    
+
                     .middle {
                         display: none;
                     }
@@ -2655,9 +2609,9 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .grand-total {
-                   
+
                     .left {
                         margin-left: 0px;
                     }
@@ -2671,13 +2625,13 @@ section.cart {
                         width:25%;
                     }
                 }
-    
+
                 .due {
-                    
+
                     .left {
                         margin-left: 0px;
                     }
-    
+
                     .middle {
                         display: none;
                     }
@@ -2697,23 +2651,23 @@ section.cart {
         .table {
             display:none;
         }
-        
+
         .product-config {
             border: 1px solid #E8E8E8;
             height: 19%;
             width:100%;
-            margin-top: 10px;   
+            margin-top: 10px;
             display: block;
 
             .product-attribute {
                 display: flex;
-                flex-direction: row; 
-        
+                flex-direction: row;
+
                 .product-property {
                     width: 30%;
                     margin-top: 10px;
                     margin-left: 5px;
-                    
+
                     span {
                         font-size: 14px;
                         color: #5E5E5E;
@@ -2737,7 +2691,7 @@ section.cart {
 
         .order-information {
             flex-direction: column;
-           
+
             .order-address-method {
                 width : 250px;
             }
@@ -2765,7 +2719,7 @@ section.cart {
 
 .checkout-process{
     display: flex;
-    flex-direction: row;    
+    flex-direction: row;
     width: 100%;
     margin-top:3%;
 
@@ -2778,16 +2732,16 @@ section.cart {
             width: 100%;
 
             ul.checkout-detail {
-                height: 60px;                    
+                height: 60px;
                 display: inline-flex;
                 justify-content: space-between;
                 width: 100%;
                 padding: 5px;
 
-                
+
                 li {
-                    height: 48px;                    
-                    
+                    height: 48px;
+
                     .wrapper {
                         display:flex;
 
@@ -2796,13 +2750,13 @@ section.cart {
                             width: 48px;
                             border: 1px solid black;
                             border-radius: 50%;
-                            display: inline-flex;                            
+                            display: inline-flex;
                             border: 1px solid #E8E8E8;
                             img {
                                 margin: auto;
                             }
                         }
-    
+
                         .decorator.active {
                             border: 1px solid blue;
                         }
@@ -2814,7 +2768,7 @@ section.cart {
                             font-size: 16px;
                         }
 
-                    }                    
+                    }
                 }
             }
 
@@ -2827,7 +2781,7 @@ section.cart {
             }
         }
     }
-    
+
     .right-side {
         height: 300px;
         width: 300px;
@@ -2846,7 +2800,7 @@ section.cart {
                 }
             }
 
-            
+
             .item-detail {
                 margin-top:12px;
 
@@ -2886,7 +2840,7 @@ section.cart {
                         font-weight: bold;
                     }
                     .right {
-            
+
                         float:right;
                         font-size: 16px;
                         color: #242424;
@@ -2895,7 +2849,7 @@ section.cart {
             }
         }
     }
-    
+
 }
 
 .order-info{
@@ -2916,14 +2870,6 @@ section.cart {
 
     .sign-in {
         float:right;
-        background: #0031F0;
-        font-size: 14px;
-        color: #FFFFFF;
-        letter-spacing: -0.26px;
-        text-align: center;
-        height: 38px;
-        width: 103px;
-        border: none;
     }
 
 
@@ -2941,7 +2887,7 @@ section.cart {
         span {
             color:red;
         }
-       
+
     }
 
     .different-billing-addr {
@@ -2964,17 +2910,6 @@ section.cart {
 
     .countinue-button {
         margin-top: 3%;
-        
-        button { 
-            background: #0031F0;
-            font-size: 14px;
-            color: #FFFFFF;
-            letter-spacing: -0.26px;
-            text-align: center;
-            height: 38px;
-            width: 137px;
-            border: none;
-        }
     }
 }
 
@@ -2992,26 +2927,26 @@ section.cart {
             width: 100%;
             margin-right: 0%;
             height: 60px;
-            
+
             .checkout-menu {
                 width: 100%;
-    
+
                 ul.checkout-detail {
-                    height: 60px;                    
+                    height: 60px;
                     width: 100%;
                     padding: 5px;
-    
+
                     li {
-                        height: 48px;   
-                                   
+                        height: 48px;
+
                         .wrapper {
                             display:flex;
-    
+
                             span {
                                display: none;
                             }
-    
-                        }                    
+
+                        }
                     }
 
                     .line {
@@ -3023,7 +2958,7 @@ section.cart {
                         height: 1px;
                     }
                 }
-    
+
                 .horizontal-rule {
                    display: none;
                 }
@@ -3040,7 +2975,7 @@ section.cart {
         margin-right: 0%;
         margin-top: 10px;
         height:50px;
-        
+
         .control-group {
 
             .control{
@@ -3051,11 +2986,11 @@ section.cart {
         .different-billing-addr {
             margin-top: 5%;
         }
-    
+
         .horizontal-rule {
             margin-top: 10%;
         }
-    
+
         .countinue-button {
             margin-top: 8%;
         }
@@ -3072,26 +3007,26 @@ section.cart {
             width: 100%;
             margin-right: 0%;
             height: 60px;
-            
+
             .checkout-menu {
                 width: 100%;
-    
+
                 ul.checkout-detail {
-                    height: 60px;                    
+                    height: 60px;
                     width: 100%;
                     padding: 5px;
-    
+
                     li {
-                        height: 48px;   
-                                   
+                        height: 48px;
+
                         .wrapper {
                             display:flex;
-    
+
                             span {
                                display: none;
                             }
-    
-                        }                    
+
+                        }
                     }
 
                     .line {
@@ -3103,7 +3038,7 @@ section.cart {
                         height: 1px;
                     }
                 }
-    
+
                 .horizontal-rule {
                    display: none;
                 }
@@ -3120,7 +3055,7 @@ section.cart {
         margin-right: 0%;
         margin-top: 10px;
         height:50px;
-        
+
         .control-group {
 
             .control{
@@ -3131,11 +3066,11 @@ section.cart {
         .different-billing-addr {
             margin-top: 3%;
         }
-    
+
         .horizontal-rule {
             margin-top: 10%;
         }
-    
+
         .countinue-button {
             margin-top: 5%;
         }
@@ -3190,7 +3125,7 @@ section.cart {
         span {
             color:red;
         }
-       
+
     }
 
     .forgot-pass {
@@ -3212,8 +3147,8 @@ section.cart {
 
     .countinue-button {
         margin-top: 3%;
-        
-        button { 
+
+        button {
             background: #0031F0;
             font-size: 14px;
             color: #FFFFFF;
@@ -3261,8 +3196,8 @@ section.cart {
                 font-weight: bold;
             }
 
-        }  
-        
+        }
+
         .price-checkbox-text {
             margin-left: 25px;
             width:580px;
@@ -3279,8 +3214,8 @@ section.cart {
                 line-height: 22px;
             }
         }
-        
-      
+
+
     }
 
     .horizontal-rule {
@@ -3293,8 +3228,8 @@ section.cart {
 
     .countinue-button {
         margin-top: 3%;
-        
-        button { 
+
+        button {
             background: #0031F0;
             font-size: 14px;
             color: #FFFFFF;
@@ -3341,8 +3276,8 @@ section.cart {
                 font-weight: bold;
             }
 
-        }  
-        
+        }
+
         .payment-checkbox-text {
             margin-left: 25px;
             width:580px;
@@ -3359,8 +3294,8 @@ section.cart {
                 line-height: 22px;
             }
         }
-        
-      
+
+
     }
 
     .horizontal-rule {
@@ -3373,8 +3308,8 @@ section.cart {
 
     .countinue-button {
         margin-top: 3%;
-        
-        button { 
+
+        button {
             background: #0031F0;
             font-size: 14px; .horizontal-rule {
                 margin-top: 7%;
@@ -3403,13 +3338,13 @@ section.cart {
 
 
 // complete page start here
- 
+
 .complete-page{
     width:880px;
     height: 1050px;
 
     .order-summary {
-    
+
         span {
             font-size: 24px;
             color: #242424;
@@ -3420,15 +3355,15 @@ section.cart {
 
     .address {
         display: flex;
-        flex-direction: row; 
+        flex-direction: row;
         margin-top: 30px;
-        
+
         .shipping-address {
             height: 100px;
             width: 415px;
 
             .shipping-title {
-                
+
                 span {
                     font-weight: bold;
                     font-size: 16px;
@@ -3439,7 +3374,7 @@ section.cart {
             .shipping-content {
                 margin-top: 15px;
                 width: 175px;
-               
+
                 .addr {
                     margin-top: 5px;
 
@@ -3470,9 +3405,9 @@ section.cart {
 
         .billing-address {
             width: 415px;
-           
+
             .shipping-title {
-                
+
                 span {
                     font-weight: bold;
                     font-size: 16px;
@@ -3483,7 +3418,7 @@ section.cart {
             .shipping-content {
                 margin-top: 15px;
                 width: 175px;
-               
+
                 .addr {
                     margin-top: 5px;
 
@@ -3519,11 +3454,11 @@ section.cart {
         border-radius: 3px;
         margin-top: 30px;
         display: flex;
-        flex-direction: row; 
+        flex-direction: row;
 
         .product-image {
             margin: 20px 0px 20px 20px;
-           
+
             img {
                 height: 160px;
                 width:160px;
@@ -3533,7 +3468,7 @@ section.cart {
         .product-desc {
             margin-top: 20px;
             margin-left: 10px;
-            
+
             .product-title {
 
                 span {
@@ -3587,7 +3522,7 @@ section.cart {
                 margin-top:14px;
 
                 span {
-                    
+
                     font-size: 16px;
                     color: #242424;
                 }
@@ -3600,26 +3535,26 @@ section.cart {
         border-radius: 3px;
         margin-top: 30px;
         display: flex;
-        flex-direction: row; 
+        flex-direction: row;
         justify-content: space-between;
-         
+
         .payment {
-           
+
             .shipping{
                 display: flex;
-                flex-direction: row; 
+                flex-direction: row;
 
                 .pay-icon {
                     height: 48px;
                     width: 48px;
                     border-radius: 50%;
                     border: 1px solid #E8E8E8;
-    
+
                     img {
                         margin-left: 8px;
                         margin-top: 8px;
                     }
-    
+
                     span {
                         margin-left: 10px;
                         font-size: 16px;
@@ -3630,7 +3565,7 @@ section.cart {
 
                 .shipping-text {
                     display: flex;
-                    flex-direction: column; 
+                    flex-direction: column;
 
                     .price {
                         margin-top: 5px;
@@ -3645,7 +3580,7 @@ section.cart {
 
                     .fedex-shipping {
                         margin-left: 5px;
-                        
+
                         span {
                             font-size: 16px;
                             color: #242424;
@@ -3658,14 +3593,14 @@ section.cart {
             .net-banking{
                 margin-top: 23px;
                 display: flex;
-                flex-direction: row; 
+                flex-direction: row;
 
                 .pay-icon {
                     height: 48px;
                     width: 48px;
                     border-radius: 50%;
                     border: 1px solid #E8E8E8;
-    
+
                     img {
                         margin-left: 8px;
                         margin-top: 8px;
@@ -3685,13 +3620,13 @@ section.cart {
         .product-bill {
             height:200px;
             width:300px;
-           
+
             .sub-total {
 
                 span {
                     font-size: 16px;
                     color: #242424;
-                    letter-spacing: -0.38px;   
+                    letter-spacing: -0.38px;
                 }
 
                 .right{
@@ -3705,9 +3640,9 @@ section.cart {
                 span {
                     font-size: 16px;
                     color: #242424;
-                    letter-spacing: -0.38px;   
+                    letter-spacing: -0.38px;
                 }
-                
+
                 .right{
                     float:right;
                 }
@@ -3727,14 +3662,14 @@ section.cart {
                 span {
                     font-size: 16px;
                     color: #242424;
-                    letter-spacing: -0.38px;   
+                    letter-spacing: -0.38px;
                 }
-                
+
                 .right{
                     float:right;
                 }
             }
-        }        
+        }
     }
 
     .horizontal-rule {
@@ -3760,7 +3695,7 @@ section.cart {
     }
 }
 
-// complete page end here 
+// complete page end here
 
 
 // review page start here
@@ -3779,7 +3714,7 @@ section.review {
         margin-top: 20px;
 
         .product-info {
-            
+
             .image {
                 border:1px solid red;
 
@@ -3855,21 +3790,21 @@ section.review {
             }
 
             .stars {
-               
+
                 width: 270px;
                 display: inline-block;
-             
+
                 label.star {
                 font-size: 36px;
                 color: #d4d4d4;
                 transition: all .2s;
                 }
-                  
+
                 label.star:before {
                     content: '\2605';
                 }
-                  
-            } 
+
+            }
 
             .write-review {
                 margin-top: 25px;
@@ -3913,7 +3848,7 @@ section.review {
                     margin-top: 40px;
                     margin-left: 20px;
                     width: 48%;
-                    
+
                     .avg-rating-count{
 
                         span {
diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php
index 914f33216..f2aaaf9a6 100644
--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@@ -49,6 +49,9 @@ return [
         'specification' => 'Specification',
         'total-reviews' => ':total Reviews',
         'by' => 'By :name',
-        'up-sell-title' => 'We found other products you might like!'
+        'up-sell-title' => 'We found other products you might like!',
+        'reviews-title' => 'Ratings & Reviews',
+        'write-review-btn' => 'Write Review',
+        'choose-option' => 'Choose an option'
     ]
 ];
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/common.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common.blade.php
deleted file mode 100644
index ba9174032..000000000
--- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/common.blade.php
+++ /dev/null
@@ -1,92 +0,0 @@
-<div class="checkout-process">
-
-    <div class="left-side">
-        <div class="checkout-menu">
-
-            <ul class="checkout-detail">
-
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator active">
-                            <img src="{{asset('themes/default/assets/images/address.svg')}}" />
-                        </div>
-                        
-                        <span>Information</span>
-                    </div>
-                    
-                </li>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/shipping.svg')}}" />
-                        </div>
-                        
-                        <span>Shipping</span>
-                    </div>
-                </li>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/payment.svg')}}" />
-                        </div>
-                        
-                        <span>Payment</span>
-                    </div>
-                </li>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/finish.svg')}}" />
-                        </div>
-                        
-                        <span>Complete</span>
-                    </div>
-                </li>
-            </ul> 
-
-            <div class="horizontal-rule">
-            </div>          
-        </div>
-    </div>
-
-    <div class="right-side">
-        <div class="purchase-detail">
-            <div class="price">
-                <span>Price Detail</span>
-            </div> 
-            
-            <div class="item-detail">
-                <span>
-                    <label>2 Items Price</label>
-                    <label class="right">$ 2,506.00</label>
-                </span>    
-            </div>
-
-            <div class="item-detail">
-                <span>
-                    <label>Delivery Charges</label>
-                    <label class="right">$ 40.00</label>
-                </span>    
-            </div>
-            <div class="item-detail">
-                <span>
-                    <label>Coupan Discount</label>
-                    <label class="right">$ 25.00</label>
-                </span>    
-            </div>
-
-            <div class="horizontal-rule">
-            </div>
-
-            <div class="payble-amount">
-                <span>
-                    <label>Amount Payble</label>
-                    <label class="right">$ 2571.00</label>
-                </span>    
-            </div>
-        </div>
-    </div>
-</div>
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/common.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/common.blade.php
new file mode 100644
index 000000000..68186c19b
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/common.blade.php
@@ -0,0 +1,8 @@
+<div class="checkout-process">
+
+    @include('shop::customers.checkout.common.nav-left')
+
+    @include('shop::customers.checkout.common.nav-right')
+
+</div>
+
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-left.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-left.blade.php
new file mode 100644
index 000000000..2a33dfe10
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-left.blade.php
@@ -0,0 +1,53 @@
+<div class="left-side">
+    <div class="checkout-menu">
+
+        <ul class="checkout-detail">
+
+            <li>
+                <div class="wrapper">
+                    <div class="decorator" v-bind:class="{ active: isGuest }">
+                        <img src="{{asset('themes/default/assets/images/address.svg')}}" />
+                    </div>
+
+                    <span>Information</span>
+
+                </div>
+
+            </li>
+
+            <li>
+                <div class="wrapper" >
+                    <div class="decorator" v-bind:class="{ active: isShip }">
+                        <img src="{{asset('themes/default/assets/images/shipping.svg')}}"/>
+                    </div>
+
+                    <span>Shipping</span>
+                </div>
+            </li>
+
+            <li>
+                <div class="wrapper">
+                    <div class="decorator">
+                        <img src="{{asset('themes/default/assets/images/payment.svg')}}" />
+                    </div>
+
+                    <span>Payment</span>
+                </div>
+            </li>
+
+            <li>
+                <div class="wrapper">
+                    <div class="decorator">
+                        <img src="{{asset('themes/default/assets/images/finish.svg')}}" />
+                    </div>
+
+                    <span>Complete</span>
+                </div>
+            </li>
+        </ul>
+
+        <div class="horizontal-rule">
+        </div>
+    </div>
+</div>
+
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-right.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-right.blade.php
new file mode 100644
index 000000000..2a7cba245
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/common/nav-right.blade.php
@@ -0,0 +1,37 @@
+<div class="right-side">
+    <div class="purchase-detail">
+        <div class="price">
+            <span>Price Detail</span>
+        </div>
+
+        <div class="item-detail">
+            <span>
+                <label>2 Items Price</label>
+                <label class="right">$ 2,506.00</label>
+            </span>
+        </div>
+
+        <div class="item-detail">
+            <span>
+                <label>Delivery Charges</label>
+                <label class="right">$ 40.00</label>
+            </span>
+        </div>
+        <div class="item-detail">
+            <span>
+                <label>Coupan Discount</label>
+                <label class="right">$ 25.00</label>
+            </span>
+        </div>
+
+        <div class="horizontal-rule">
+        </div>
+
+        <div class="payble-amount">
+            <span>
+                <label>Amount Payble</label>
+                <label class="right">$ 2571.00</label>
+            </span>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/guest.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/guest.blade.php
new file mode 100644
index 000000000..475c06621
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/guest.blade.php
@@ -0,0 +1,73 @@
+    <div class="order-info">
+        <div class="order-guest">
+            <span class="order-text">
+                Order as Guest
+            </span>
+            <button class="btn btn-lg btn-primary sign-in">
+                SIGN IN
+            </button>
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Email address <span>*</span></label>
+            <input type="text" class="control" name="email_address">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">First Name <span>*</span> </label>
+            <input type="text" class="control" name="first_name">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Last Name <span>*</span> </label>
+            <input type="text" class="control" name="last_name">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Company Name <span>*</span> </label>
+            <input type="text" class="control" name="company_name">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Street address <span>*</span> </label>
+            <input type="text" class="control" name="street_address">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">City <span>*</span> </label>
+            <input type="text" class="control" name="city">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Country <span>*</span> </label>
+            <input type="text" class="control" name="country">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Provinces <span>*</span> </label>
+            <input type="text" class="control" name="provinces">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Zip code <span>*</span> </label>
+            <input type="text" class="control" name="zip_code">
+        </div>
+
+        <div class="control-group">
+            <label for="first_name">Phone number <span>*</span> </label>
+            <input type="text" class="control" name="phone_number">
+        </div>
+
+        <div class="different-billing-addr">
+            <span>qwdevf</span>
+            <span>Usedifferent address for billing?</span>
+        </div>
+
+        <div class="horizontal-rule">
+        </div>
+
+        <div class="countinue-button">
+            <button class="btn btn-lg btn-primary" @click="count()">CONTINUE</button>
+        </div>
+
+    </div>
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/index.blade.php
index 817177347..8342d022e 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/index.blade.php
@@ -2,178 +2,68 @@
 
 @section('content-wrapper')
 
-<div class="checkout-process">
-
-    <div class="left-side">
-        <div class="checkout-menu">
-
-            <ul class="checkout-detail">
-
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator active">
-                            <img src="{{asset('themes/default/assets/images/address.svg')}}" />
-                        </div>
-                        
-                        <span>Information</span>
-                    </div>
-                    
-                </li>
-                <div class="line"> </div>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/shipping.svg')}}" />
-                        </div>
-                        
-                        <span>Shipping</span>
-                    </div>
-                </li>
-
-                <div class="line"></div>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/payment.svg')}}" />
-                        </div>
-                        
-                        <span>Payment</span>
-                    </div>
-                </li>
-
-                <div class="line"></div>
-                
-                <li>
-                    <div class="wrapper">
-                        <div class="decorator">
-                            <img src="{{asset('themes/default/assets/images/finish.svg')}}" />
-                        </div>
-                        
-                        <span>Complete</span>
-                    </div>
-                </li>
-            </ul> 
-
-            <div class="horizontal-rule">
-            </div>          
-        </div>
-    </div>
-
-    <div class="right-side">
-        <div class="purchase-detail">
-            <div class="price">
-                <span>Price Detail</span>
-            </div> 
-            
-            <div class="item-detail">
-                <span>
-                    <label>2 Items Price</label>
-                    <label class="right">$ 2,506.00</label>
-                </span>    
-            </div>
-
-            <div class="item-detail">
-                <span>
-                    <label>Delivery Charges</label>
-                    <label class="right">$ 40.00</label>
-                </span>    
-            </div>
-            <div class="item-detail">
-                <span>
-                    <label>Coupan Discount</label>
-                    <label class="right">$ 25.00</label>
-                </span>    
-            </div>
-
-            <div class="horizontal-rule">
-            </div>
-
-            <div class="payble-amount">
-                <span>
-                    <label>Amount Payble</label>
-                    <label class="right">$ 2571.00</label>
-                </span>    
-            </div>
-        </div>
-    </div>
-</div>
-
-<div class="order-info">
-    <div class="order-guest">
-        <span class="order-text">
-            Order as Guest
-        </span>
-        <button class="sign-in">
-            SIGN IN
-        </button>
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Email address <span>*</span></label>
-        <input type="text" class="control" name="email_address">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">First Name <span>*</span> </label>
-        <input type="text" class="control" name="first_name">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Last Name <span>*</span> </label>
-        <input type="text" class="control" name="last_name">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Company Name <span>*</span> </label>
-        <input type="text" class="control" name="company_name">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Street address <span>*</span> </label>
-        <input type="text" class="control" name="street_address">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">City <span>*</span> </label>
-        <input type="text" class="control" name="city">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Country <span>*</span> </label>
-        <input type="text" class="control" name="country">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Provinces <span>*</span> </label>
-        <input type="text" class="control" name="provinces">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Zip code <span>*</span> </label>
-        <input type="text" class="control" name="zip_code">
-    </div>
-
-    <div class="control-group">
-        <label for="first_name">Phone number <span>*</span> </label>
-        <input type="text" class="control" name="phone_number">
-    </div>
-
-    <div class="different-billing-addr">
-        <span>qwdevf</span>
-        <span>Use different address for billing?</span>
-    </div>
-
-    <div class="horizontal-rule">
-    </div>
-
-    <div class="countinue-button">
-        <button>CONTINUE</button>
-    </div>
-
-</div>
-
-
+    <checkout customer="{{$customer_id}}"> </checkout>
 
 @endsection
+
+@push('scripts')
+
+    <script type="text/x-template" id="checkout-template">
+
+        <div>
+            @include('shop::customers.checkout.common.common')
+
+            <div v-if="customer">
+                @include('shop::customers.checkout.ship-method')
+            </div>
+            <div v-if="!customer">
+                @include('shop::customers.checkout.guest')
+            </div>
+        </div>
+
+    </script>
+
+    <script>
+
+        Vue.component('checkout', {
+
+            props: ['customer'],
+
+            data: () => ({
+                isGuest:true,
+                isShip:false,
+                disabled: 0,
+                isShipMethod:false
+            }),
+
+            template: '#checkout-template',
+
+            mounted () {
+
+                if(this.customer){
+                    this.isShip=true;
+                }else{
+                    this.isGuest=true;
+                    this.disabled=1;
+
+                    console.log(this.disabled);
+                }
+            } ,
+
+            methods: {
+                count () {
+                    this.isShipMethod=true;
+                    console.log(this.isShipMethod)
+                }
+            }
+
+        })
+
+    </script>
+
+
+
+@endpush
+
+
+
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php
index 3508e711b..5eda20d85 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/payment-method.blade.php
@@ -3,7 +3,7 @@
 
 @section('content-wrapper')
 
-@include('shop::customers.checkout.common')
+@include('shop::customers.checkout.common.common')
 
 <div class="payment-method">
     <div class="payment-info">
@@ -45,7 +45,7 @@
         </div>
     </div>
 
-   
+
     <div class="horizontal-rule">
     </div>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php
index 08fc6f915..b0303e15d 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/checkout/ship-method.blade.php
@@ -1,9 +1,4 @@
 
-@extends('shop::layouts.master')
-
-@section('content-wrapper')
-
-@include('shop::customers.checkout.common')
 
 <div class="ship-method">
     <div class="ship-info">
@@ -14,7 +9,8 @@
 
     <div class="ship-price">
         <div class="price-checkbox">
-            <img src="{{asset('themes/default/assets/images/selected.svg')}}" />
+            {{--  <img src="{{asset('themes/default/assets/images/selected.svg')}}" />  --}}
+            <input type="radio" name="gender" value="male" checked>
             <span> $ 25.00 </span>
         </div>
         <div class="price-checkbox-text">
@@ -45,7 +41,7 @@
         </div>
     </div>
 
-    
+
     <div class="horizontal-rule">
     </div>
 
@@ -54,4 +50,3 @@
     </div>
 </div>
 
-@endsection
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/index.blade.php b/packages/Webkul/Shop/src/Resources/views/index.blade.php
new file mode 100644
index 000000000..a8e715d27
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/index.blade.php
@@ -0,0 +1,24 @@
+@inject('rateHelper' , 'Webkul\Shipping\Helper\Rate')
+
+
+<div>
+
+    @foreach($rateHelper->collectRates() as $key=>$count)
+
+    <div class="shipping-method">
+
+        <input type="radio" name="price"> ${{ core()->currency($count) }}  <span> {{ $key }} </span>
+
+
+    </div>
+
+    @endforeach
+
+
+</div>
+
+<style>
+    span {
+        margin-left: 10px;
+    }
+</style>
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
index 34f182e1a..4a8597386 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
@@ -22,11 +22,7 @@
         
         @include ('shop::products.price', ['product' => $product])
 
-        @if ($product->reviews->count())
-
-            @include ('shop::products.review', ['product' => $product])
-
-        @endif
+        @include ('shop::products.review', ['product' => $product])
 
         @include ('shop::products.add-to', ['product' => $product])
     
diff --git a/packages/Webkul/Shop/src/Resources/views/products/review.blade.php b/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
index f5cd7d9ed..fb9c2f09c 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
@@ -1,11 +1,19 @@
-<div class="product-ratings">
+@inject ('reviewHelper', 'Webkul\Product\Product\Review')
 
-    @inject ('reviewHelper', 'Webkul\Product\Product\Review')
+@if ($total = $reviewHelper->getTotalReviews($product))
+    <div class="product-ratings">
 
-    @for ($i = 1; $i <= $reviewHelper->getAverageRating($product); $i++)
+        <span class="stars">
+            @for ($i = 1; $i <= round($reviewHelper->getAverageRating($product)); $i++)
 
-        <span class="icon star-icon"></span>
-    
-    @endfor
-    
-</div>
\ No newline at end of file
+                <span class="icon star-icon"></span>
+            
+            @endfor
+        </span>
+
+        <div class="total-reviews">
+            {{ __('shop::app.products.total-reviews', ['total' => $total]) }}
+        </div>
+        
+    </div>
+@endif
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
index 763e98866..ee0f7a427 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
@@ -1,6 +1,7 @@
 @inject ('reviewHelper', 'Webkul\Product\Product\Review')
 @inject ('priceHelper', 'Webkul\Product\Product\Price')
 
+
 @extends('shop::layouts.master')
 @section('content-wrapper')
     <section class="product-review">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
index 8e776dd5f..c42e1a245 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
@@ -10,53 +10,56 @@
 
         <div class="layouter">
 
-            @include ('shop::products.view.gallery')
+            <form action="" style="display: inherit;">
 
-            <div class="details">
+                @csrf()
 
-                <div class="product-heading">
-                    <span>{{ $product->name }}</span>
-                </div>
+                <input type="hidden" name="product">
+                
+                <input type="hidden" name="selected_configurable_option">
 
-                <div class="rating">
-                    <img src="{{ bagisto_asset('images/5star.svg') }}" />
-                    75 Ratings & 11 Reviews
-                </div>
+                @include ('shop::products.view.gallery')
 
-                @include ('shop::products.price', ['product' => $product])
+                <div class="details">
 
-                @include ('shop::products.view.stock')
+                    <div class="product-heading">
+                        <span>{{ $product->name }}</span>
+                    </div>
 
-                <br/>
+                    @include ('shop::products.review', ['product' => $product])
 
-                <div class="description">
-                    {{ $product->short_description }}
-                </div>
+                    @include ('shop::products.price', ['product' => $product])
 
-                @if ($product->type == 'configurable')
+                    @include ('shop::products.view.stock')
+
+
+                    <div class="description">
+                        {{ $product->short_description }}
+                    </div>
 
                     @include ('shop::products.view.configurable-options')
-                
-                @endif
 
-                <accordian :title="{{ __('shop::app.products.description') }}" :active="true">
-                    <div slot="header">
-                        {{ __('shop::app.products.description') }}
-                        <i class="icon expand-icon right"></i>
-                    </div>
-
-                    <div slot="body">
-                        <div class="full-description">
-                            {{ $product->description }}
+                    <accordian :title="'{{ __('shop::app.products.description') }}'" :active="true">
+                        <div slot="header">
+                            {{ __('shop::app.products.description') }}
+                            <i class="icon expand-icon right"></i>
                         </div>
-                    </div>
-                </accordian>
 
-                @include ('shop::products.view.attributes')
+                        <div slot="body">
+                            <div class="full-description">
+                                {{ $product->description }}
+                            </div>
+                        </div>
+                    </accordian>
 
-                @include ('shop::products.view.reviews')
+                    @include ('shop::products.view.attributes')
+
+                    @include ('shop::products.view.reviews')
+
+                </div>
+                
+            </form>
 
-            </div>
         </div>
 
         @include ('shop::products.view.up-sells')
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
index c78988d35..be235e343 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
@@ -1,6 +1,6 @@
 @inject ('productViewHelper', 'Webkul\Product\Product\View')
 
-<accordian :title="{{ __('shop::app.products.specification') }}" :active="false">
+<accordian :title="'{{ __('shop::app.products.specification') }}'" :active="false">
     <div slot="header">
         {{ __('shop::app.products.specification') }}
         <i class="icon expand-icon right"></i>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
index 1ebdb1f39..f6cad3173 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
@@ -1,33 +1,165 @@
-<div class="attributes">
+@if ($product->type == 'configurable')
 
-    <div class="attribute color">
-        <div class="title">Color</div>
+    @inject ('configurableOptionHelper', 'Webkul\Product\Product\ConfigurableOption')
 
-        <div class="values">
-            <div class="colors red"></div>
-            <div class="colors blue"></div>
-            <div class="colors green"></div>
-        </div>
-    </div>
 
-    <div class="attribute size">
-        <div class="title">Size</div>
+    <product-options></product-options>
 
-        <div class="values">
-            <div class="size xl">XL</div>
-            <div class="size xxl">XXL</div>
-            <div class="size xxxl">XXXL</div>
-        </div>
-    </div>
+    @push('scripts')
 
-    <div class="attribute quantity">
-        <div class="title">Quantity</div>
+        <script type="text/x-template" id="product-options-template">
+            <div class="attributes">
 
-        <div class="values">
-            <div class="size">1</div>
-        </div>
-    </div>
+                <div v-for='(attribute, index) in childAttributes' class="attribute control-group" :class="[errors.has('super_attribute[' + attribute.id + ']') ? 'has-error' : '']">
+                    <label class="reqiured">@{{ attribute.label }}</label>
 
-</div>
+                    <select v-validate="'required'" class="control" :name="['super_attribute[' + attribute.id + ']']" :disabled="attribute.disabled" @change="configure(attribute, $event.target.value)">
 
-<hr/>
\ No newline at end of file
+                        <option  v-for='(option, index) in attribute.options' :value="option.id">@{{ option.label }}</option>
+                        
+                    </select>
+
+                    <span class="control-error" v-if="errors.has('super_attribute[' + attribute.id + ']')">@{{ errors.first('super_attribute[' + attribute.id + ']') }}</span>
+                </div>
+
+            </div>
+        </script>
+
+        <script>
+            Vue.component('product-options', {
+
+                template: '#product-options-template',
+
+                data: () => ({
+                    config: @json($configurableOptionHelper->getConfigurationConfig($product)),
+                    childAttributes: []
+                }),
+
+                created () {
+                    var childAttributes = this.childAttributes,
+                        attributes = this.config.attributes,
+                        index = attributes.length,
+                        attribute;
+
+                    while (index--) {
+                        // attribute = Object.assign({}, attributes[index]);
+                        attribute = attributes[index];
+
+                        attribute.options = [];
+
+                        if (index) {
+                            attribute.disabled = true;
+                        } else {
+                            this.fillSelect(attribute);
+                        }
+
+                        attribute = Object.assign(attribute, {
+                            childAttributes: childAttributes.slice(),
+                            prevAttribute: attributes[index - 1],
+                            nextAttribute: attributes[index + 1]
+                        });
+
+                        childAttributes.unshift(attribute);
+                    }
+                },
+
+                methods: {
+                    configure (attribute, value) {
+                        // this.simpleProduct = this._getSimpleProductId(attribute);
+
+                        if (value) {
+                            if (attribute.nextAttribute) {
+                                attribute.nextAttribute.disabled = false;
+                                this.fillSelect(attribute.nextAttribute);
+                                this.resetChildren(attribute.nextAttribute);
+                            } else {
+                                //Set product id hidden value
+                            }
+                        } else {
+                            this.resetChildren(attribute);
+                        }
+
+                        // this.reloadPrice();
+                        // this.changeProductImage();
+                    },
+
+                    fillSelect (attribute) {
+                        var options = this.getAttributeOptions(attribute.id),
+                            prevOption,
+                            index = 1,
+                            products,
+                            i,
+                            j;
+
+                        attribute.options = [];
+                        attribute.options[0] = {'id': '', 'label': this.config.chooseText, 'products': []};
+
+                        if (attribute.prevAttribute) {
+                            prevOption = attribute.prevAttribute.options[attribute.prevAttribute.selectedIndex];
+                        }
+
+                        // console.log(attribute)
+
+                        if (options) {
+                            for (i = 0; i < options.length; i++) {
+                                products = [];
+
+                                if (prevOption) {
+                                    for (j = 0; j < options[i].products.length; j++) {
+                                        if (prevOption.products &&
+                                            prevOption.products.indexOf(options[i].products[j]) > -1) {
+                                            products.push(options[i].products[j]);
+                                        }
+                                    }
+                                } else {
+                                    products = options[i].products.slice(0);
+                                }
+
+                                if (products.length > 0) {
+                                    options[i].products = products;
+                                    attribute.options[index] = options[i];
+
+                                    index++;
+                                }
+                            }
+                        }
+                    },
+
+                    resetChildren (attribute) {
+                        if (attribute.childAttributes) {
+                            attribute.childAttributes.forEach(function (set) {
+                                set.selectedIndex = 0;
+                                set.disabled = true;
+                            });
+                        }
+                    },
+                    
+                    getAttributeOptions (attributeId) {
+                        var this_this = this,
+                            options;
+
+                        
+                        this.config.attributes.forEach(function(attribute, index) {
+                            if (attribute.id == attributeId) {
+                                options = attribute.options;
+                            }    
+                        })
+
+                        return options;
+                    },
+
+                    reloadPrice () {
+
+                    },
+
+                    changeProductImage () {
+
+                    },
+                }
+
+            });
+
+        </script>
+    @endpush
+
+@endif
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
index bbe5e664d..4c7805a6d 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
@@ -7,7 +7,7 @@
         <img src="{{ bagisto_asset('images/jeans.jpg') }}" />
     </div>
 
-    <div class="product-hero-image">
+    <div class="product-hero-image" id="product-hero-image">
         <img src="{{ bagisto_asset('images/jeans_big.jpg') }}" />
         <img class="wishlist" src="{{ bagisto_asset('images/wish.svg') }}" />
         <img class="share" src="{{ bagisto_asset('images/icon-share.svg') }}" />
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
index b84816615..11e8eb560 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
@@ -2,8 +2,8 @@
 
 @if ($total = $reviewHelper->getTotalReviews($product))
 <div class="rating-reviews">
-    <div class="title">
-        Ratings & Reviews
+    <div class="rating-header">
+        {{ __('shop::app.products.reviews-title') }}
     </div>
 
     <div class="overall">
@@ -14,7 +14,7 @@
             </span>
 
             <span class="stars">
-                @for ($i = 1; $i <= $reviewHelper->getAverageRating($product); $i++)
+                @for ($i = 1; $i <= round($reviewHelper->getAverageRating($product)); $i++)
 
                     <span class="icon star-icon"></span>
                 
@@ -27,13 +27,15 @@
 
         </div>
 
-        <a href="{{ route('shop.reviews.create', $product->url_key) }}" class="btn btn-lg btn-primary">Write Review</a>
+        <a href="{{ route('shop.reviews.create', $product->url_key) }}" class="btn btn-lg btn-primary">
+            {{ __('shop::app.products.write-review-btn') }}
+        </a>
 
     </div>
 
     <div class="reviews">
 
-        @foreach ($product->reviews()->paginate(5) as $review)
+        @foreach ($reviewHelper->getReviews($product)->paginate(5) as $review)
             <div class="review">
                 <div class="title">
                     {{ $review->title }}
@@ -65,7 +67,6 @@
 
         <a href="{{ route('shop.reviews.index', $product->url_key) }}" class="view-all">View All</a>
 
-        <hr/>
     </div>
 </div>
 @endif
\ No newline at end of file
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index 7de78fb4b..5c1e1e14b 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -878,6 +878,15 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   margin-bottom: 14px;
 }
 
+.main-container-wrapper .product-card .product-ratings .icon {
+  width: 16px;
+  height: 16px;
+}
+
+.main-container-wrapper .product-card .product-ratings .total-reviews {
+  display: none;
+}
+
 .main-container-wrapper .product-card .cart-fav-seg {
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
@@ -1390,16 +1399,16 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   min-height: 345px;
 }
 
-section.product-detail, section.product-review {
+section.product-detail {
   font-size: 16px;
   color: #242424;
 }
 
-section.product-detail div.category-breadcrumbs, section.product-review div.category-breadcrumbs {
+section.product-detail div.category-breadcrumbs {
   display: inline;
 }
 
-section.product-detail div.layouter, section.product-review div.layouter {
+section.product-detail div.layouter {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1410,32 +1419,32 @@ section.product-detail div.layouter, section.product-review div.layouter {
   margin-top: 21px;
 }
 
-section.product-detail div.layouter .mixed-group .single-image, section.product-review div.layouter .mixed-group .single-image {
+section.product-detail div.layouter .mixed-group .single-image {
   padding: 2px;
 }
 
-section.product-detail div.layouter .mixed-group .single-image img, section.product-review div.layouter .mixed-group .single-image img {
+section.product-detail div.layouter .mixed-group .single-image img {
   height: 280px;
   width: 280px;
 }
 
-section.product-detail div.layouter .mixed-group .details .product-name, section.product-review div.layouter .mixed-group .details .product-name {
+section.product-detail div.layouter .mixed-group .details .product-name {
   margin-top: 20px;
   font-size: 24px;
   margin-bottom: 20px;
 }
 
-section.product-detail div.layouter .mixed-group .details .product-price, section.product-review div.layouter .mixed-group .details .product-price {
+section.product-detail div.layouter .mixed-group .details .product-price {
   margin-bottom: 14px;
 }
 
-section.product-detail div.layouter .rating-reviews, section.product-review div.layouter .rating-reviews {
+section.product-detail div.layouter .rating-reviews {
   margin-top: 0px;
   width: 50%;
   margin-left: 20px;
 }
 
-section.product-detail div.layouter .rating-reviews .title-inline, section.product-review div.layouter .rating-reviews .title-inline {
+section.product-detail div.layouter .rating-reviews .title-inline {
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
@@ -1449,12 +1458,12 @@ section.product-detail div.layouter .rating-reviews .title-inline, section.produ
   width: 100%;
 }
 
-section.product-detail div.layouter .rating-reviews .title-inline button, section.product-review div.layouter .rating-reviews .title-inline button {
+section.product-detail div.layouter .rating-reviews .title-inline button {
   float: right;
   border-radius: 0px !important;
 }
 
-section.product-detail div.layouter .rating-reviews .overall, section.product-review div.layouter .rating-reviews .overall {
+section.product-detail div.layouter .rating-reviews .overall {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1471,19 +1480,19 @@ section.product-detail div.layouter .rating-reviews .overall, section.product-re
   height: 150px;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .left-side, section.product-review div.layouter .rating-reviews .overall .left-side {
+section.product-detail div.layouter .rating-reviews .overall .left-side {
   margin-bottom: 20px;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .left-side .number, section.product-review div.layouter .rating-reviews .overall .left-side .number {
+section.product-detail div.layouter .rating-reviews .overall .left-side .number {
   font-size: 34px;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .right-side, section.product-review div.layouter .rating-reviews .overall .right-side {
+section.product-detail div.layouter .rating-reviews .overall .right-side {
   display: block;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .right-side .rater, section.product-review div.layouter .rating-reviews .overall .right-side .rater {
+section.product-detail div.layouter .rating-reviews .overall .right-side .rater {
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;
   display: inline-flex;
@@ -1492,52 +1501,52 @@ section.product-detail div.layouter .rating-reviews .overall .right-side .rater,
           align-items: center;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .right-side .rater .star, section.product-review div.layouter .rating-reviews .overall .right-side .rater .star {
+section.product-detail div.layouter .rating-reviews .overall .right-side .rater .star {
   width: 50px;
   height: 20px;
   padding: 1px;
   margin-right: 8px;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar, section.product-review div.layouter .rating-reviews .overall .right-side .rater .line-bar {
+section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar {
   height: 4px;
   width: 158px;
   margin-right: 12px;
   background: #D8D8D8;
 }
 
-section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar .line-value, section.product-review div.layouter .rating-reviews .overall .right-side .rater .line-bar .line-value {
+section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar .line-value {
   background-color: #0031F0;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews, section.product-review div.layouter .rating-reviews .reviews {
+section.product-detail div.layouter .rating-reviews .reviews {
   margin-top: 34px;
   margin-bottom: 90px;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews .review, section.product-review div.layouter .rating-reviews .reviews .review {
+section.product-detail div.layouter .rating-reviews .reviews .review {
   margin-bottom: 25px;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews .review .title, section.product-review div.layouter .rating-reviews .reviews .review .title {
+section.product-detail div.layouter .rating-reviews .reviews .review .title {
   margin-bottom: 5px;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews .review .stars, section.product-review div.layouter .rating-reviews .reviews .review .stars {
+section.product-detail div.layouter .rating-reviews .reviews .review .stars {
   margin-bottom: 15px;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews .review .message, section.product-review div.layouter .rating-reviews .reviews .review .message {
+section.product-detail div.layouter .rating-reviews .reviews .review .message {
   margin-bottom: 10px;
 }
 
-section.product-detail div.layouter .rating-reviews .reviews .view-all, section.product-review div.layouter .rating-reviews .reviews .view-all {
+section.product-detail div.layouter .rating-reviews .reviews .view-all {
   margin-top: 15px;
   color: #0031f0;
   margin-bottom: 15px;
 }
 
-section.product-detail div.layouter div.product-image-group, section.product-review div.layouter div.product-image-group {
+section.product-detail div.layouter div.product-image-group {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1551,7 +1560,7 @@ section.product-detail div.layouter div.product-image-group, section.product-rev
   margin-right: 2.5%;
 }
 
-section.product-detail div.layouter div.product-image-group .side-group, section.product-review div.layouter div.product-image-group .side-group {
+section.product-detail div.layouter div.product-image-group .side-group {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1562,195 +1571,152 @@ section.product-detail div.layouter div.product-image-group .side-group, section
   margin-right: 4px;
 }
 
-section.product-detail div.layouter div.product-image-group .product-hero-image, section.product-review div.layouter div.product-image-group .product-hero-image {
+section.product-detail div.layouter div.product-image-group .product-hero-image {
   display: block;
   position: relative;
 }
 
-section.product-detail div.layouter div.product-image-group .product-hero-image .wishlist, section.product-review div.layouter div.product-image-group .product-hero-image .wishlist {
+section.product-detail div.layouter div.product-image-group .product-hero-image .wishlist {
   position: absolute;
   top: 10px;
   right: 12px;
 }
 
-section.product-detail div.layouter div.product-image-group .product-hero-image .share, section.product-review div.layouter div.product-image-group .product-hero-image .share {
+section.product-detail div.layouter div.product-image-group .product-hero-image .share {
   position: absolute;
   top: 10px;
   right: 45px;
 }
 
-section.product-detail div.layouter .details .product-heading, section.product-review div.layouter .details .product-heading {
+section.product-detail div.layouter .details .product-price {
+  margin-bottom: 14px;
+}
+
+section.product-detail div.layouter .details .product-ratings {
+  margin-bottom: 20px;
+}
+
+section.product-detail div.layouter .details .product-ratings .icon {
+  width: 16px;
+  height: 16px;
+}
+
+section.product-detail div.layouter .details .product-ratings .total-reviews {
+  display: inline-block;
+  margin-left: 15px;
+}
+
+section.product-detail div.layouter .details .product-heading {
   font-size: 24px;
   color: #242424;
-  margin-bottom: 14px;
+  margin-bottom: 15px;
 }
 
-section.product-detail div.layouter .details .rating, section.product-review div.layouter .details .rating {
-  color: #242424;
-  margin-bottom: 14px;
-}
-
-section.product-detail div.layouter .details .product-price, section.product-review div.layouter .details .product-price {
-  margin-bottom: 14px;
+section.product-detail div.layouter .details .product-price {
+  margin-bottom: 15px;
   font-size: 24px;
 }
 
-section.product-detail div.layouter .details .product-price .special-price, section.product-review div.layouter .details .product-price .special-price {
+section.product-detail div.layouter .details .product-price .special-price {
   font-size: 24px;
 }
 
-section.product-detail div.layouter .details .stock-status, section.product-review div.layouter .details .stock-status {
-  margin-bottom: 14px;
+section.product-detail div.layouter .details .stock-status {
+  margin-bottom: 15px;
 }
 
-section.product-detail div.layouter .details .description, section.product-review div.layouter .details .description {
-  margin-bottom: 14px;
+section.product-detail div.layouter .details .description {
+  margin-bottom: 15px;
+  padding-bottom: 15px;
+  border-bottom: solid 1px rgba(162, 162, 162, 0.2);
 }
 
-section.product-detail div.layouter .details .full-specifications td, section.product-review div.layouter .details .full-specifications td {
+section.product-detail div.layouter .details .full-specifications td {
   padding: 10px 0;
   color: #5E5E5E;
 }
 
-section.product-detail div.layouter .details .full-specifications td:first-child, section.product-review div.layouter .details .full-specifications td:first-child {
+section.product-detail div.layouter .details .full-specifications td:first-child {
   padding-right: 40px;
 }
 
-section.product-detail div.layouter .details .accordian .accordian-header, section.product-review div.layouter .details .accordian .accordian-header {
+section.product-detail div.layouter .details .accordian .accordian-header {
   font-size: 16px;
   padding-left: 0;
   font-weight: 600;
 }
 
-section.product-detail div.layouter .details .attributes, section.product-review div.layouter .details .attributes {
+section.product-detail div.layouter .details .attributes {
   display: block;
   width: 100%;
+  border-bottom: solid 1px rgba(162, 162, 162, 0.2);
 }
 
-section.product-detail div.layouter .details .attributes .attribute, section.product-review div.layouter .details .attributes .attribute {
-  height: 39px;
-  margin-bottom: 20px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .title, section.product-review div.layouter .details .attributes .attribute .title {
-  float: left;
-  height: 100%;
-  min-width: 130px;
-  padding-top: 9px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values, section.product-review div.layouter .details .attributes .attribute .values {
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .colors, section.product-review div.layouter .details .attributes .attribute .values .colors {
-  margin-right: 5px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .colors:last-child, section.product-review div.layouter .details .attributes .attribute .values .colors:last-child {
-  margin-right: 0;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .red, section.product-review div.layouter .details .attributes .attribute .values .red {
-  height: 37px;
-  width: 37px;
-  background: red;
-  border: 1px solid #c7c7c7;
-  border-radius: 2px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .blue, section.product-review div.layouter .details .attributes .attribute .values .blue {
-  height: 37px;
-  width: 37px;
-  background: blue;
-  border: 1px solid #c7c7c7;
-  border-radius: 2px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .green, section.product-review div.layouter .details .attributes .attribute .values .green {
-  height: 37px;
-  width: 37px;
-  background: green;
-  border: 1px solid #c7c7c7;
-  border-radius: 2px;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .size, section.product-review div.layouter .details .attributes .attribute .values .size {
-  margin-right: 5px;
-  line-height: 38px;
-  height: 37px;
-  width: 60px;
-  border: 1px solid #c7c7c7;
-  border-radius: 2px;
-  text-align: center;
-  vertical-align: middle;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .size:last-child, section.product-review div.layouter .details .attributes .attribute .values .size:last-child {
-  margin-right: 0;
-}
-
-section.product-detail div.layouter .details .attributes .attribute .values .quantity .values .control, section.product-review div.layouter .details .attributes .attribute .values .quantity .values .control {
-  height: 37px !important;
-  width: 30px !important;
-}
-
-section.product-detail div.layouter .details .full-description, section.product-review div.layouter .details .full-description {
+section.product-detail div.layouter .details .full-description {
   font-size: 16px;
 }
 
-section.product-detail div.layouter .details .rating-reviews, section.product-review div.layouter .details .rating-reviews {
-  margin-top: 30px;
-}
-
-section.product-detail div.layouter .details .rating-reviews .title, section.product-review div.layouter .details .rating-reviews .title {
-  margin-bottom: 15px;
+.rating-reviews .rating-header {
   font-weight: 600;
+  padding: 20px 0;
 }
 
-section.product-detail div.layouter .details .rating-reviews .overall, section.product-review div.layouter .details .rating-reviews .overall {
-  margin-bottom: 5px;
+.rating-reviews .stars .icon {
+  width: 16px;
+  height: 16px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .overall .review-info .number, section.product-review div.layouter .details .rating-reviews .overall .review-info .number {
+.rating-reviews .overall {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+}
+
+.rating-reviews .overall .review-info .number {
   font-size: 34px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .overall button, section.product-review div.layouter .details .rating-reviews .overall button {
-  float: right;
-  border-radius: 0px !important;
+.rating-reviews .overall .review-info .total-reviews {
+  margin-top: 10px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews, section.product-review div.layouter .details .rating-reviews .reviews {
-  margin-top: 34px;
-  margin-bottom: 80px;
+.rating-reviews .reviews {
+  margin-top: 40px;
+  margin-bottom: 40px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews .review, section.product-review div.layouter .details .rating-reviews .reviews .review {
+.rating-reviews .reviews .review {
   margin-bottom: 25px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews .review .stars, section.product-review div.layouter .details .rating-reviews .reviews .review .stars {
+.rating-reviews .reviews .review .title {
+  margin-bottom: 5px;
+}
+
+.rating-reviews .reviews .review .stars {
   margin-bottom: 15px;
   display: inline-block;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews .review .stars .icon, section.product-review div.layouter .details .rating-reviews .reviews .review .stars .icon {
-  width: 18px;
-  height: 18px;
-}
-
-section.product-detail div.layouter .details .rating-reviews .reviews .review .message, section.product-review div.layouter .details .rating-reviews .reviews .review .message {
+.rating-reviews .reviews .review .message {
   margin-bottom: 10px;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews .review .reviewer-details, section.product-review div.layouter .details .rating-reviews .reviews .review .reviewer-details {
+.rating-reviews .reviews .review .reviewer-details {
   color: #5E5E5E;
 }
 
-section.product-detail div.layouter .details .rating-reviews .reviews .view-all, section.product-review div.layouter .details .rating-reviews .reviews .view-all {
+.rating-reviews .reviews .view-all {
   margin-top: 15px;
   color: #0031f0;
   margin-bottom: 15px;
@@ -2911,14 +2877,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo
 
 .order-info .sign-in {
   float: right;
-  background: #0031F0;
-  font-size: 14px;
-  color: #FFFFFF;
-  letter-spacing: -0.26px;
-  text-align: center;
-  height: 38px;
-  width: 103px;
-  border: none;
 }
 
 .order-info .control-group {
@@ -2959,17 +2917,6 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo
   margin-top: 3%;
 }
 
-.order-info .countinue-button button {
-  background: #0031F0;
-  font-size: 14px;
-  color: #FFFFFF;
-  letter-spacing: -0.26px;
-  text-align: center;
-  height: 38px;
-  width: 137px;
-  border: none;
-}
-
 @media all and (max-width: 480px) {
   .checkout-process {
     width: 100%;
diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js
index 92989e592..aee93be85 100644
--- a/public/themes/default/assets/js/shop.js
+++ b/public/themes/default/assets/js/shop.js
@@ -10648,7 +10648,7 @@ return jQuery;
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(global, setImmediate) {/*!
- * Vue.js v2.5.16
+ * Vue.js v2.5.17
  * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
@@ -15737,7 +15737,7 @@ Object.defineProperty(Vue, 'FunctionalRenderContext', {
   value: FunctionalRenderContext
 });
 
-Vue.version = '2.5.16';
+Vue.version = '2.5.17';
 
 /*  */
 
diff --git a/resources/views/vendor/mail/html/promotion.blade.php b/resources/views/vendor/mail/html/promotion.blade.php
index 0debcf8a3..2b048f071 100644
--- a/resources/views/vendor/mail/html/promotion.blade.php
+++ b/resources/views/vendor/mail/html/promotion.blade.php
@@ -4,4 +4,4 @@
             {{ Illuminate\Mail\Markdown::parse($slot) }}
         </td>
     </tr>
-</table>
+</table>
\ No newline at end of file