diff --git a/lib/Dojo.pm b/lib/Dojo.pm
index 91a066d..9cf3515 100755
--- a/lib/Dojo.pm
+++ b/lib/Dojo.pm
@@ -27,7 +27,8 @@ use Dojo::Model::Users;
     $r->any('/contact')->to('home#contact');
     $r->any('/contact2')->to('home#contact2');
     $r->any('/pang')->to('home#pang');
-    #   $r->any('/tst')->to('home#tst');
+    $r->any('/storep')->to('home#storep');
+    $r->any('/storep/:id'  => [id => qr/\d+/])->to('home#storep');
 # =============================================================================
 
 
diff --git a/lib/Dojo/Controller/Home.pm b/lib/Dojo/Controller/Home.pm
index 9b6f10d..de42a01 100755
--- a/lib/Dojo/Controller/Home.pm
+++ b/lib/Dojo/Controller/Home.pm
@@ -43,9 +43,9 @@ sub tst{
     # interesan create time, id, payer: email address, shippng address  
   }
   else{
-    my %f=('descripcion',' Había una vez un lobito bueno al que maltrataban todos los corderos','precio','33','promo','si!','existencia','3','nombre','Super master evil man','titulo'=>'venganzas del medievo');
-    $c->stash(%f);
-    $c->stash(res=> "no");
+    my $data=$c->dbg->store_id($c->param('id'));
+    $c->redirect_to('store') unless ($data->{'id'});
+    $c->stash($data);
     $c->stash(layout=>'default');
   }
   #$c->render(text=> $c->config->{radio}{'channel'});
@@ -85,7 +85,9 @@ sub cal {
 
 sub event{
   my $c = shift;
-  $c->stash($c->dbv->event($c->param("id")));
+  my $data=$c->dbv->event($c->param('id'));
+  $c->redirect_to('cal') unless ($data->{'cname'});
+  $c->stash($data);
   $c->stash(layout=> "defaultContact");
 }
 
@@ -118,6 +120,50 @@ sub store{
   $c->stash(layout=> "defaultContact");
 }
 
+sub storep{
+  my $c=shift;
+  if( defined($c->req->json) ){
+    my $oid = $c->req->json->{'orderID'} //0;
+    log( $oid ); 
+    #credentials====
+    my $client='AQdZ1JJL-GNBgGTI3W6cXChmj6MnZsInRGlWeHw1kbGiE_49eTtZ2fPvEq9ersU2y6O5WpxccdsyAQw7';
+    my $secter='EBn8CNOCrJbVZ_fNllXB7oUIm9_vhtqrJMm2zSBGbxSyiiych3cHOIWOLAD5NVw4Z3dmNhmsHQwPsrZ0';
+    my $pauth='https://api.sandbox.paypal.com/v1/oauth2/token/';
+    my $porder='https://api.sandbox.paypal.com/v2/checkout/orders/';
+    #=================
+    #pre auth ====
+    my $ua = LWP::UserAgent->new;
+    my $req=POST $pauth, ["grant_type"=>"client_credentials"];
+    $req->authorization_basic($client,$secter);
+    $req->content_type('application/x-www-form-urlencoded');
+    my $res=$ua->request($req);
+    log("paypal pre auth error! $res->status_line") unless ($res->is_success );
+    my $json = JSON->new->utf8;
+    my $r=$json->decode($res->decoded_content);
+    #==============
+
+    #order details ====
+    my $ub = LWP::UserAgent->new;
+    $ub->default_header('Content-Type'=> 'application/json' );
+    $ub->default_header('Authorization'=> 'Bearer ' . $r->{access_token} );
+    my $resb=$ub->get($porder.$oid);
+    log("paypal checkout error!") unless ($resb->is_success );
+    my $jsonb = JSON->new->utf8;
+    my $s=$jsonb->decode($resb->decoded_content);
+    #===================
+    $c->rendered(200); #es default,nomas para enfatizar que puede ser 400 o 500
+    # interesan create time, id, payer: email address, shippng address  
+  }
+  else{
+    my $data=$c->dbg->store_id($c->param('id'));
+    $c->redirect_to('cal') if ($c->param('id')==4);
+    $c->redirect_to('store') unless ($data->{'id'});
+    $c->stash($data);
+    $c->stash(layout=>'default');
+  }
+
+}
+
 sub tv{
   my $c = shift;
   $c->stash( videos=>$c->dbv->tv_videos, table=>$c->dbv->tv_series);
diff --git a/lib/Dojo/Model/Data/store/qIdStore.q b/lib/Dojo/Model/Data/store/qIdStore.q
new file mode 100755
index 0000000..239532d
--- /dev/null
+++ b/lib/Dojo/Model/Data/store/qIdStore.q
@@ -0,0 +1,14 @@
+select 
+ id,
+ objeto,
+ nombre,
+ precio,
+ subnombre,
+ promocion,
+ opcion,
+ descripcion,
+ imagenb as "imagen",
+ existencia,
+ entrega_id "entrega_id"
+from tienda where id=? and activo =1;
+
diff --git a/lib/Dojo/Model/Users.pm b/lib/Dojo/Model/Users.pm
index 2f8bc9e..05d2c8c 100755
--- a/lib/Dojo/Model/Users.pm
+++ b/lib/Dojo/Model/Users.pm
@@ -62,6 +62,11 @@ sub store{
   return _read ($data_path->child("/store/qStore.q")->slurp);
 }
 
+sub store_id{
+  my ($self,$id)=@_;
+  return _read ($data_path->child("/store/qIdStore.q")->slurp,$id)->[0];
+}
+
 sub _read{
   my ($q,@bind)=@_;
   my (@empty,$arr);
diff --git a/public/home/store/shop.css b/public/home/store/shop.css
index bb91fd8..ac94cb5 100755
--- a/public/home/store/shop.css
+++ b/public/home/store/shop.css
@@ -6,8 +6,6 @@ article.heading{
   background-color: #333333;
   text-align: center;
   margin-top: 50px;
-
-
 }
 p.heading{
   font-size:5em;
@@ -20,6 +18,17 @@ article.shop{
   -webkit-justify-content:center;
   margin-top: 40px;
 } 
+article.shop:hover{
+  background-color:rgba(240,240,240);
+  cursor:pointer;
+}
+
+a:link, a:visited {
+  text-decoration: none;
+  color:unset;
+}
+
+
 div.simage{
   flex:3;
   max-width:350px;
@@ -50,3 +59,4 @@ article.separator{
  margin-top:30px;
 }
 
+
diff --git a/public/home/storep/grulla_10.jpg b/public/home/storep/grulla_10.jpg
new file mode 100755
index 0000000..5e7a690
Binary files /dev/null and b/public/home/storep/grulla_10.jpg differ
diff --git a/public/home/storep/storep.css b/public/home/storep/storep.css
new file mode 100755
index 0000000..af077aa
--- /dev/null
+++ b/public/home/storep/storep.css
@@ -0,0 +1,106 @@
+section.item{
+ background-size:cover;
+ background-attachment: fixed;
+ background-image:url("grulla_10.jpg");
+ background-position:center;
+ display:block;
+ padding:50px 0px 0px 0px;
+
+}
+section.transp{
+  background-color:rgba(255,255,255,0.8);
+  max-width: 1000px;
+margin: auto;
+padding: 20px 0px;
+}
+ 
+article.iimage{
+  flex:5 1;
+  margin:auto;
+  display:inline;
+  padding:0px 5px;
+
+}
+img.small{
+  border-radius:20px;
+  display:block;
+  width:auto;
+  height:100%;
+  min-height:60vh;
+  margin:auto;
+  padding:15px;
+}
+article.iinfo{
+  flex:4 1;
+  margin:auto;
+  padding: 5px 15px;
+}
+p.txt{
+  background-color:white;
+  font-size:1.2em;
+  padding: 20px;
+  text-align: center;
+}
+
+section.ibottom{
+ background: #C22A39;
+ padding:40px;
+ 
+}
+
+section.description{
+ background-color:white;
+ justify-content: center;
+ -webkit-justify-content: center;
+}
+
+p.promo{
+color: #c22a39;
+font-size: 1.4em;
+text-align:right;
+margin-right:10%;
+  font-weight:bold;
+}
+
+
+p.elow{
+color: black;
+font-size: 1.4em;
+text-align:right;
+margin-right:10%;
+}
+
+p.eldep{
+color: #c22a39;
+font-size: 1.4em;
+text-align:right;
+ text-transform: uppercase;
+margin-right:10%;
+  font-weight:bold;
+}
+
+div.ppl{
+background-color: rgba(0,0,0,0.8);
+border-radius: 25px;
+padding:20px;
+text-align: center;
+}
+p.nombre{
+ font-size: 2.2em;
+ color: white;
+ text-align: left;
+ margin: auto;
+  text-decoration: underline;
+  max-width:850px;
+  font-weight:bold;
+}
+
+p.tit{
+ font-size: 1.8em;
+ color: white;
+ text-align: center;
+ margin: 30px auto;
+ font-style: italic;
+}
+
+
diff --git a/templates/home/store.html.ep b/templates/home/store.html.ep
index 6317874..0b90455 100755
--- a/templates/home/store.html.ep
+++ b/templates/home/store.html.ep
@@ -2,6 +2,7 @@
 <section class="shop">
   <article class="heading"> <p class="heading">TIENDA VIRTUAL</p> </article>
   %  for (@$r){
+  <a href="/storep/<%= $_->{id} %>">
   <article class="shop flex">
     <div class="simage" > <img src=<%= "$controller/$action/img/$_->{imagen} "%> ></div>
     <div class="description">
@@ -14,6 +15,7 @@
      <p class="promo"> <%= $_->{promocion} %> </p>
     </div>
   </article>
+  </a>
   <article class="separator"></article>
  %}
 </section>
diff --git a/templates/home/storep.html.ep b/templates/home/storep.html.ep
new file mode 100755
index 0000000..9177c4f
--- /dev/null
+++ b/templates/home/storep.html.ep
@@ -0,0 +1,60 @@
+<!--<head>-->
+  <!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
+  <!--<meta http-equiv="X-UA-Compatible" content="IE=edge" />-->
+<!--</head>-->
+%stash css=>["/home/storep/storep.css"];
+<section class="item"> <section class="transp flex">
+  <article class=iimage> 
+    <img class="small" src= "/home/store/img/<%= $imagen %>"> 
+  </article>
+  <article class=iinfo>
+   <p class="txt"><%= $subnombre %></p> 
+   <p class="txt"><%= $descripcion %></p> 
+   <p class="promo"><%= $promocion %></p> 
+   <p class="precio">Precio:$<%= $precio %> pesos</p> 
+   <p class="existencia">
+   <% if    ($existencia > 10) { =%> <p class="eok"></p>  <% } =%>
+   <% elsif ($existencia >= 1) {  =%> <p class="elow">¡Nos quedan pocos!</p>  <% } =%>
+   <% elsif ($existencia == 0) { =%> <p class="eldep">¡Agotado!</p> <% } =%> 
+    <div class=ppl>
+    <div id="paypal-button-container"></div>
+    </div>
+  </article>
+</section> </section>
+<section class="ibottom">
+   <p class="nombre"><%= $objeto %></p> 
+   <p class="tit"><%= $nombre %></p> 
+</section>
+<section class="bdat"> </section>
+
+
+    <script src="https://www.paypal.com/sdk/js?client-id=AQdZ1JJL-GNBgGTI3W6cXChmj6MnZsInRGlWeHw1kbGiE_49eTtZ2fPvEq9ersU2y6O5WpxccdsyAQw7&currency=MXN"></script>
+  <script>
+    paypal.Buttons({
+      // Set up the transaction
+      createOrder: function(data, actions) {
+        return actions.order.create({
+          purchase_units: [{
+            amount: {
+              value: '0.18'
+            }
+          }]
+        }); },
+      onApprove: function(data, actions) {
+        return actions.order.capture().then(function(details) {
+          return fetch('/tst', {
+            method: 'post',
+            headers: {
+              'content-type': 'application/json'
+            },
+            body: JSON.stringify({
+              orderID: data.orderID
+            })
+          })
+      //      .then(response=>response.json())
+      //      .then(data => {alert(data)})
+        });
+      }
+    }).render('#paypal-button-container');
+  </script>
+
diff --git a/templates/home/tst.html.ep b/templates/home/tst.html.ep
index 3052997..6ec4bab 100755
--- a/templates/home/tst.html.ep
+++ b/templates/home/tst.html.ep
@@ -5,11 +5,12 @@
 %stash css=>["/home/tst/tst.css"];
 <section class="item"> <section class="transp flex">
   <article class=iimage> 
-    <img class="small" src= "home/store/img/libro.jpg"> 
+    <img class="small" src= "/home/store/img/<%= $imagen %>"> 
   </article>
   <article class=iinfo>
+   <p class="txt"><%= $subnombre %></p> 
    <p class="txt"><%= $descripcion %></p> 
-   <p class="promo"><%= $promo %></p> 
+   <p class="promo"><%= $promocion %></p> 
    <p class="precio">Precio:$<%= $precio %> pesos</p> 
    <p class="existencia">
    <% if    ($existencia > 10) { =%> <p class="eok"></p>  <% } =%>
@@ -21,8 +22,8 @@
   </article>
 </section> </section>
 <section class="ibottom">
-   <p class="nombre"><%= $nombre %></p> 
-   <p class="tit"><%= $titulo %></p> 
+   <p class="nombre"><%= $objeto %></p> 
+   <p class="tit"><%= $nombre %></p> 
 </section>
 <section class="bdat"> </section>