@charset "utf-8";
html,body{
    width: 100%;
    margin: auto;
    max-width: 800px;
}


@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.shop-content li img{
    box-shadow: 10px 10px 5px #aaaaaa;
    margin-bottom: 10px;
}
div.top-l {
  width: 100%;
  padding-left: 10px;
  position: relative;
  animation: mymove 2s infinite;
  animation-iteration-count: 1;
  margin-top: 10px;
  
  
}
div.top-l img{
    width:30%;
  
}
#div.top-l{
    animation-timing-function: linear;
    
}

@keyframes mymove {
  from {right: -250px;}
  to {right: -20px;}
}

div.modal-body{
    width: 100%;
    height: auto;
    max-height: auto;
    overflow: auto;
    background-color: white;
    margin: auto;
    border: 5px solid white;
}

div.modal-body{
    -ms-overflow-style:none;
    scrollbar-width:none;
}
div.modal-body::-webkit-scrollbar{
    display: none;

}
.top-b{

position : fixed;
right : 45%;
bottom:60px;
z-index:9999999;
width:40px;
font-size:2em;
height:40px;
border:1px solid black;
text-align:center;
padding-top:2px;
border-radius:25px;
color:white;
border:none;
display:none;
border: 1px solid white;
background-color: rgba(0,0,0,0.2);

}

.searchbar{
    position: absolute;
    right: 25px;
    top: 15px;
    
}