.zoom {

    position: relative;
    text-align: center;
    height: 500px;
    width: 300px;
    padding: 50px;
    background-color: white;
    transition: transform .2s; /* Animation */
    border-radius: 25px;
    
    margin: 100 auto;
    box-shadow: 0px 1px 3px -1px rgb(21, 21, 216);

  }
  .zoomx {

    margin-left:10px;
    position: relative;
    text-align: center;
    width: 300px;
    padding: 50px;
    background-color: white;
    transition: transform .2s; /* Animation */
    border-radius: 25px;
    height: 600px;
    margin: 100 auto;
    box-shadow: 0px 1px 3px -1px rgb(21, 21, 216);
  }
  .zoom li{
    margin-left: 33.3%;
  }
  .gopro{
  color: green;
  text-decoration: none;
  }
  .para{
    
    position: absolute;
    font-size:20px;
    left:5px;
    bottom: 20%;
    font-weight: bold;
  }
  .parax{
    position: absolute;
    font-size:20px;
    left:5px;
    bottom: 30%;
    font-weight: bold;
  }
  .subpara{
    position: absolute;
    left:20px;
    bottom: 10%;
  }
  .subparax{
    position: absolute;
    left:5px;
    bottom: 20%;
  }
  .price1{
    position: absolute;
    left:20px;
    bottom: 5%;
    color:green;
    font-size:20px;
  }
  .price1x{
    font-size: 25px;
    font-weight: bold;
    position: absolute;
    left:5px;
    bottom:25%;
    color:green;
  }
  .price2{
    font-weight: bold;
    opacity:70%;
    font-size:15px;
    position: absolute;
    bottom: 5%;
    left:100px;
   
    
    -webkit-text-decoration-line: line-through; /* Safari */
     text-decoration-line: line-through; 
  }
  .price2x{
    font-size: 25px;
    font-weight: bold;
    opacity:80%;
    position: absolute;
    left:120px;
    bottom:25%;
    -webkit-text-decoration-line: line-through; /* Safari */
     text-decoration-line: line-through; 
  }
  .para:hover{
  color: green;
  }

  .zoomx img,.zoom img{
    height: 300px;
    width: 300px;
    position: absolute;
    left:0%;
    top:4%;
  
  }
  .zoomx img{
    height: 150px;
    width: 150px;
    position: absolute;
    padding:50px;
    left:10%;
  
  }
  .zoomx img:hover{
  
    transform: scale(1.3);
   
    position: absolute;
    
    transition-duration: 1s;
  }
  
  .zoom:hover,.zoomx:hover {
    border-style: solid;
    border-width: thin;
    border-color: rgb(21, 190, 72);
    /* transform: scale(1.05); */  /* (50% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  
  }  
  .columnzoom {
    margin-top: 10px;
    position: relative;
    float: left;
    width: 25%;
  
    
  }
  
  /* Clear floats after the columns */
  .rowzoom:after {
    position: relative;
    
    content: "";
    display: table;
    clear: both;
  }
  .xyz{
    margin-left: 20px;
  }