diff --git a/addons/website_sale/models/product.py b/addons/website_sale/models/product.py
index f01a90c604f..a341083e650 100644
--- a/addons/website_sale/models/product.py
+++ b/addons/website_sale/models/product.py
@@ -132,7 +132,7 @@ class product_template(osv.Model):
         'website_sequence': fields.integer('Sequence', help="Determine the display order in the Website E-commerce"),
         'website_url': fields.function(_website_url, string="Website url", type="char"),
         'public_categ_ids': fields.many2many('product.public.category', string='Public Category', help="Those categories are used to group similar products for e-commerce."),
-        'optional_product_ids': fields.many2many('product.template','product_optional_rel','src_id','dest_id',string='Optional Products'),
+        'optional_product_ids': fields.many2many('product.template','product_optional_rel','src_id','dest_id',string='Optional Products', help="Products to propose when add to cart."),
     }
 
     def _defaults_website_sequence(self, cr, uid, *l, **kwargs):
diff --git a/addons/website_sale/static/src/css/website_sale.css b/addons/website_sale/static/src/css/website_sale.css
index cff966fed88..c3774f9ed03 100644
--- a/addons/website_sale/static/src/css/website_sale.css
+++ b/addons/website_sale/static/src/css/website_sale.css
@@ -305,7 +305,7 @@
 .css_not_available.js_product > *:nth-child(3) > *, .css_not_available.js_product *:nth-child(4) > * {
   display: none;
 }
-.css_not_available.js_product .product_price {
+.css_not_available.js_product .product_price, .css_not_available.js_product .css_quantity {
   display: none;
 }
 .css_not_available.js_product .css_not_available_msg {
diff --git a/addons/website_sale/static/src/css/website_sale.sass b/addons/website_sale/static/src/css/website_sale.sass
index 09bcbad36e8..17dfcb8ea44 100644
--- a/addons/website_sale/static/src/css/website_sale.sass
+++ b/addons/website_sale/static/src/css/website_sale.sass
@@ -262,7 +262,7 @@
 .css_not_available.js_product
     > *:nth-child(3) > *, *:nth-child(4) > *
         display: none
-    .product_price
+    .product_price, .css_quantity
         display: none
     .css_not_available_msg
         display: block
diff --git a/addons/website_sale/static/src/js/website_sale.js b/addons/website_sale/static/src/js/website_sale.js
index e865a8e2486..ef4d0136fb7 100644
--- a/addons/website_sale/static/src/js/website_sale.js
+++ b/addons/website_sale/static/src/js/website_sale.js
@@ -194,4 +194,18 @@ $(document).ready(function () {
         return false;
     });
 
+
+    $(".oe_website_sale select[name='country_id']").change(function () {
+        var $select = $("select[name='state_id']");
+        $select.find("option:not(:first)").hide();
+        var nb = $select.find("option[data-country_id="+($(this).val() || 0)+"]").show().size();
+        $select.parent().toggle(nb>1);
+    }).change();
+    $(".oe_website_sale select[name='shipping_country_id']").change(function () {
+        var $select = $("select[name='shipping_state_id']");
+        $select.find("option:not(:first)").hide();
+        var nb = $select.find("option[data-country_id="+($(this).val() || 0)+"]").show().size();
+        $select.parent().toggle(nb>1);
+    }).change();
+
 });
diff --git a/addons/website_sale/views/templates.xml b/addons/website_sale/views/templates.xml
index 57033305e70..49c778709cd 100644
--- a/addons/website_sale/views/templates.xml
+++ b/addons/website_sale/views/templates.xml
@@ -540,7 +540,7 @@
 
 <template id="product_quantity" inherit_id="website_sale.product" optional="enabled" name="Select Quantity">
   <xpath expr="//t[@t-placeholder='button']" position="before">
-    <div class="input-group" style="width: 108px;">
+    <div class="css_quantity input-group" style="width: 108px;">
         <span class="input-group-addon">
             <a t-attf-href="#" class="mb8 js_add_cart_json">
                 <i class="fa fa-minus"></i>
@@ -1009,15 +1009,6 @@
                       <label class="control-label" for="zip">Zip / Postal Code</label>
                       <input type="text" name="zip" class="form-control" t-att-value="checkout.get('zip')"/>
                   </div>
-                  <div t-attf-class="form-group #{error.get('state_id') and 'has-error' or ''} col-lg-6">
-                      <label class="control-label" for="state_id" style="font-weight: normal">State / Province</label>
-                      <select name="state_id" class="form-control">
-                          <option value="">select...</option>
-                          <t t-foreach="states or []" t-as="state">
-                              <option t-att-value="state.id" t-att-selected="state.id == checkout.get('state_id')"><t t-esc="state.name"/></option>
-                          </t>
-                      </select>
-                  </div>
                   <div t-attf-class="form-group #{error.get('country_id') and 'has-error' or ''} col-lg-6">
                       <label class="control-label" for="contact_name">Country</label>
                       <select name="country_id" class="form-control">
@@ -1027,6 +1018,15 @@
                           </t>
                       </select>
                   </div>
+                  <div t-attf-class="form-group #{error.get('state_id') and 'has-error' or ''} col-lg-6">
+                      <label class="control-label" for="state_id" style="font-weight: normal">State / Province</label>
+                      <select name="state_id" class="form-control">
+                          <option value="">select...</option>
+                          <t t-foreach="states or []" t-as="state">
+                              <option t-att-value="state.id" style="display:none;" t-att-data-country_id="state.country_id.id" t-att-selected="state.id == checkout.get('state_id')"><t t-esc="state.name"/></option>
+                          </t>
+                      </select>
+                  </div>
 
                   <div class="clearfix"/>
 
@@ -1061,15 +1061,6 @@
                       <label class="control-label" for="contact_name">Zip / Postal Code</label>
                       <input type="text" name="shipping_zip" class="form-control" t-att-value="checkout.get('shipping_zip', '')"/>
                   </div>
-                  <div t-attf-class="form-group #{error.get('shipping_state_id') and 'has-error' or ''} col-lg-6">
-                      <label class="control-label" for="contact_name" style="font-weight: normal">State / Province</label>
-                      <select name="shipping_state_id" class="form-control">
-                          <option value="">State / Province...</option>
-                          <t t-foreach="states or []" t-as="state">
-                              <option t-att-value="state.id" t-att-selected="state.id == checkout.get('shipping_state_id')"><t t-esc="state.name"/></option>
-                          </t>
-                      </select>
-                  </div>
                   <div t-attf-class="form-group #{error.get('shipping_country_id') and 'has-error' or ''} col-lg-6">
                       <label class="control-label" for="contact_name">Country</label>
                       <select name="shipping_country_id" class="form-control">
@@ -1079,7 +1070,17 @@
                           </t>
                       </select>
                   </div>
+                  <div t-attf-class="form-group #{error.get('shipping_state_id') and 'has-error' or ''} col-lg-6">
+                      <label class="control-label" for="contact_name" style="font-weight: normal">State / Province</label>
+                      <select name="shipping_state_id" class="form-control">
+                          <option value="">State / Province...</option>
+                          <t t-foreach="states or []" t-as="state">
+                              <option t-att-value="state.id" style="display:none;" t-att-data-country_id="state.country_id.id" t-att-selected="state.id == checkout.get('shipping_state_id')"><t t-esc="state.name"/></option>
+                          </t>
+                      </select>
+                  </div>
               </div>
+              <a href="/shop/cart" class="btn btn-default mb32"><span class="fa fa-long-arrow-left"/> Return to Cart</a>
               <a class="btn btn-default btn-primary pull-right mb32 a-submit">Confirm <span class="fa fa-long-arrow-right"/></a>
           </div>
           <div class="col-lg-offset-1 col-lg-3 col-md-3 text-muted">