diff --git a/app/views/layouts/main.php b/app/views/layouts/main.php
index 3bcda2c..5e4c9e2 100755
--- a/app/views/layouts/main.php
+++ b/app/views/layouts/main.php
@@ -81,8 +81,8 @@ $this->registerJsFile(Yii::$app->request->baseUrl.'/js/new-basket.js',['position
 
 </div>
 
-<div id="overlay" style="display: block;"></div>
-<div id="new-basket-modal" class="new-basket-modal" style="display: block">
+<div id="overlay" style="display: none;"></div>
+<div id="new-basket-modal" class="new-basket-modal" style="display: none">
     <div class="site">
         <div class="style basket-modal-wr">
             <div class="style title-basket-modal">
@@ -166,10 +166,16 @@ $this->registerJsFile(Yii::$app->request->baseUrl.'/js/new-basket.js',['position
                     </div>
                 </div>
 
-                <div class="style buttons-b-wr">
+                <div class="style buttons-b-wr hidden-xs">
                     <a class="link-to-basket" href="#">оформить заказ</a>
                     <a class="close-basket" href="#">продолжить покупки</a>
                 </div>
+
+                <div class="style buttons-b-wr visible-xs hidden">
+                    <a class="close-basket" href="#">продолжить покупки</a>
+                    <a class="link-to-basket" href="#">оформить заказ</a>
+                </div>
+
             </div>
         </div>
     </div>
diff --git a/app/views/products/_product.php b/app/views/products/_product.php
index 7762301..65ae816 100755
--- a/app/views/products/_product.php
+++ b/app/views/products/_product.php
@@ -30,5 +30,5 @@ use yii\helpers\Url;
           <p class="rubric"><?=$item->catalog->name?></p>
                 <a href="<?=Url::to(['products/show','translit_rubric'=>$item->catalog->translit,'translit'=>$item->translit,'id'=>$item->id])?>" class="name"><?=$item->name?></a>
                 <div class="cost">цена <?=$item->cost->cost?> грн</div>
-		<a href="<?=Url::to(['products/show','translit_rubric'=>$item->catalog->translit,'translit'=>$item->translit,'id'=>$item->id])?>" class="buy">Купить</a>
+		<a href="<?=Url::to(['products/show','translit_rubric'=>$item->catalog->translit,'translit'=>$item->translit,'id'=>$item->id])?>" class="buy new-btn-modal-basket">Купить</a>
 	</div>
diff --git a/app/views/products/show.php b/app/views/products/show.php
index 6304045..386456b 100755
--- a/app/views/products/show.php
+++ b/app/views/products/show.php
@@ -157,7 +157,7 @@ $this->registerJs("
 						</div>
 						<div class="boy_box">
 							<input type='hidden' id='product_id' />
-                                                        <a href="#" rel='product' class="buy fr modal-link" data-form="new-basket-modal">Купить</a>
+                                                        <a href="#" rel='product' class="buy fr basket-card">Купить</a>
 							<div class="fl txtfb">цена <span id="cost">0</span> грн</div><div class="both"></div>
 						</div>
 						<div class="info">
diff --git a/app/widgets/views/_product_view.php b/app/widgets/views/_product_view.php
index 129dfc3..5a1bc3f 100644
--- a/app/widgets/views/_product_view.php
+++ b/app/widgets/views/_product_view.php
@@ -65,7 +65,7 @@
     <div class="cost">цена <?= $item->cost->cost ?> грн</div>
     <a
         href="#"
-        class="buy t_buy_btn new-btn-modal-basket modal-link" data-form="new-basket-modal"
+        class="buy t_buy_btn new-btn-modal-basket"
     >
         Купить
     </a>
diff --git a/css/new-style.scss b/css/new-style.scss
index 8c79cf2..7edf767 100644
--- a/css/new-style.scss
+++ b/css/new-style.scss
@@ -248,7 +248,17 @@ $greenColor: #59a926;
   }
 }
 
+.hidden {
+  display: none !important;
+}
+
 @media (max-width: 767px) {
+  .visible-xs {
+    display: block !important;
+  }
+  .hidden-xs {
+    display: none !important;
+  }
   .table-basket {
 
     tr {
@@ -282,4 +292,7 @@ $greenColor: #59a926;
       float: none;
     }
   }
+  .basket-modal-wr {
+      border-radius: 0;
+  }
 }
\ No newline at end of file
diff --git a/js/basket.js b/js/basket.js
index af59b56..f3f6d2c 100755
--- a/js/basket.js
+++ b/js/basket.js
@@ -1,12 +1,12 @@
 (function($){
 
     $.fn.basket = function(callerSettings) {
-	
+
 	var basket_id = this;
 
-		var find_products = function(){ 
-         $("a[rel~='product']").each(function (i) { 
-                $(this).bind('click',function(){ 
+		var find_products = function(){
+         $("a[rel~='product']").each(function (i) {
+                $(this).bind('click',function(){
                 var rel = $(this).attr('rel');
                 var id = $('#product_id').val();
                 var count = $('#count').val();
@@ -19,16 +19,16 @@
                 })
          });
         };
-        
+
 		var go_product = function(data){
 		    var product_id = data.product_id;
 			$.post("/basket/add/",  data ,
-			function(data){ 
+			function(data){
 				//alert_msg("Товар добавлен<br /> в корзину",product_id);
 				start_basket();
-			});		
+			});
 		};
-		
+
         var start_basket = function(){
 			$.post("/basket/info/",
 			function(data){
@@ -37,7 +37,7 @@
 
         };
 
-		var alert_msg = function(msg,product_id){ 
+		var alert_msg = function(msg,product_id){
 			winW = document.body.offsetWidth;
 			winH = document.body.offsetHeight
 			$('.modal_box').remove();
@@ -66,7 +66,7 @@
 				$('#data_box').remove();
 			});
 		};
-		
+
 		find_products();
 		start_basket();
 
@@ -173,11 +173,11 @@
 
                 } );
             }
-            
+
         };
 
         Controll.init();
 		// frontend calculator
-	}	
+	}
 
 })(jQuery);
\ No newline at end of file
diff --git a/js/new-basket.js b/js/new-basket.js
index 906d6a3..a343000 100644
--- a/js/new-basket.js
+++ b/js/new-basket.js
@@ -4,9 +4,6 @@ $(document).ready(function() {
     function modalForms() {
         $('body').on('click', '.modal-link', function (e) {
             e.preventDefault();
-
-
-
             var idForm = $(this).data('form');
             var pos = ($(window).scrollTop()) + 30;
 
@@ -38,6 +35,23 @@ $(document).ready(function() {
         });
     }
 
+    $(document).on('click', '.new-btn-modal-basket', showBasket);
+    $(document).on('click', '.basket-card', showBasket);
+
+    function showBasket(e) {
+        e.preventDefault();
+
+        var idForm = 'new-basket-modal';
+        var pos = ($(window).scrollTop()) + 30;
+
+        $('#overlay').fadeIn(400,
+            function(){
+                $('#'+idForm).css('display', 'block').animate({opacity: 1, top: pos}, 200);
+            }
+        );
+    }
+
+
     $(document).on('click', '.quantity-wr span', changeBasket);
     $(document).on('keypress', '.quantity-wr input', setControl);
 
--
libgit2 0.21.4