.mobile-basket-container{
  height:90%;;
  width:100%;
  background-color:#ededed;
  position:relative
}
.heading{
  font-size:1.5em;
}
.basket-row{
  width:100%;
  height:230px;
  background-color:rgb(255, 255, 255);
  display:flex;
  position:relative;
  margin-top:15px;
  
}
#basket-thumb-wrap{
  height:65%;
  width:fit-content;
  background-color:rgb(255, 255, 255);
  flex-grow:0;
}
.basket-row img{
  height:100%;
  border-style:solid;
  border-color:white;
  border-width:12px;
  display:inline-block;
  width:auto;
  
}
.basket-details{
  max-height:65%;
  background-color:rgba(12, 12, 230, 0);
  flex-grow:10;
  padding:12px;
  font-family:'roboto',sans-serif;
  font-size:15px;
  color: #121212;
  
  
  

  
}
.basket-details .bold{
  font-weight:bold;
}
.basket-details span:nth-child(1){
  /*brand*/
  font-size:25px;;
  font-weight:bold;
  font-family:'roboto condensed', sans-serif;
  text-transform: uppercase;
}
.basket-details span:nth-child(3){
  /* shoe name*/
  font-size:18px;
  font-family:'roboto condensed', sans-serif;
  text-transform:capitalize;
}
.mobile-quantity-panel{
  height:35%;
  width:50%;
  background-color:rgba(23, 237, 12, 0);
  position:absolute;
  bottom:0;
  display:flex;
  align-items:center;
  padding:12px;
  justify-content:center;
  
}
.remove-btn-wrap{
  width:100%;
  background-color:rgba(0, 0, 255, 0);
  display:flex;
  justify-content:flex-end;
  align-items: center;
}
.remove-btn-wrap button{
  font-size:16px;
  height:50px;
  margin-right:40px;

}
.mobile-basket-grand-total{
  font-family:'roboto', sans-serif;
  font-size:1.5em;
  margin-top:15px;
  font-weight:bold;
}

@media  (max-width:354px){
  /* very small mobiles */
  
  .basket-details{
    background-color:rgba(0, 0, 255, 0);
    height:fit-content;
  }
  
  .basket-details span:nth-child(1){
    font-size:20px;;
    
  }
  .basket-details span:nth-child(3){
    font-size:15px;
    
  }
  
  
  .remove-btn-wrap button{
    font-size:12px;
    
    margin:10px;
  
  }

  .mobile-quantity-panel{
    height:35%;
    width:100%;
    background-color:rgba(13, 177, 231, 0);
    
    bottom:0;
    display:flex;
    align-items:center;
    padding:12px;
    justify-content:center;
    
    flex-direction:column;
  }
  .basket-row{
    height:300px;
    background-color:rgb(255, 255, 255);
    
  }
  .remove-btn-wrap{
    width:100%;
    background-color:rgba(0, 0, 255, 0);
    display:flex;
    justify-content:flex-end;
    align-items: center;

    
    position:relative;
    margin:0;
    padding:0px;
    justify-content:center;
  }
  .remove-btn-wrap button{
    font-size:16px;
    height:50px;
    margin-right:40px;

    margin-right:0;
    width:100%;
    margin:0;
    margin-top:10px;
    
  }

  #basket-thumb-wrap{
    height:65%;
    width:fit-content;
    background-color:rgb(255, 255, 255);
    flex-grow:0;

    height:50%;
  }
  #total-table {
    
    background-color:rgba(0, 128, 0, 0);
  }
.total-box{
  background-color:rgba(255, 255, 0, 0);
  width:90%;
}

}
@media (min-width:750px) and (max-width:1050px){
  
  /* tablets */

  .mobile-quantity-panel{
    
    position:relative;
    align-self:center;
    
  }

  .basket-row{
    height:165px;
  }
  #basket-thumb-wrap{
    height:100%;
    
  }
  
}
@media (min-width:750px) and (max-width:1050px){
  .shipping-promo{
    position:absolute;
    left:50%;
    bottom:-50%;
    background-color:rgba(0, 128, 0, 0);
    transform:translate(-50%,0);
    font-size:calc(12px + 0.5vw);
    
  }
  #cont-shopping{
  
    
    margin-top:120px;
    padding-bottom:25px;
    
  }
  .mobile-basket-container{height:fit-content}
}

@media (min-width:100px) and (max-width:749px){
  .mobile-quantity-panel{
    
    width:100%;
    
    
  }
  .mobile-basket-container{height:fit-content}
  .table-end{
    flex-direction:column;
    align-items: center;
  }
  .total-box{
    display:flex;
    flex-direction:column;
    
  }
  .shipping-promo{
    font-size:calc(12px + 0.5vw);
  }
  .card-tray{
    width:80%;
  }
  #cont-shopping{
    background-color:rgba(0, 0, 255, 0);
    padding:40px;
    margin-top:0;
  }

  .proceed-to-payment{
    
    font-size:calc(12px + 1vw)
    
  }
}