.crypto-container {
  width: 300px;
  height: 300px;
  border-radius: 50%;
  position: relative;
  animation: spin 20s linear infinite;
}

.coin {
  width: 50px;
  height: 50px;
  background-size: cover;
  background-position: center;
  position: absolute;
  border-radius: 50%;
}

.bitcoin    { background-image: url('https://cryptologos.cc/logos/bitcoin-btc-logo.png'); top: 0; left: 50%; transform: translateX(-50%); }
.ethereum   { background-image: url('https://cryptologos.cc/logos/ethereum-eth-logo.png'); top: 50%; left: 100%; transform: translate(-50%, -50%); }
.ripple     { background-image: url('https://cryptologos.cc/logos/xrp-xrp-logo.png'); bottom: 0; left: 50%; transform: translateX(-50%); }
.tether     { background-image: url('https://cryptologos.cc/logos/tether-usdt-logo.png'); top: 50%; left: 0; transform: translate(-50%, -50%); }
.binance    { background-image: url('https://cryptologos.cc/logos/binance-coin-bnb-logo.png'); top: 10%; left: 10%; }
.litecoin   { background-image: url('https://cryptologos.cc/logos/litecoin-ltc-logo.png'); bottom: 10%; right: 10%; }

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@media (max-width: 500px) {
  .crypto-container {
    width: 200px;
    height: 200px;
  }

  .coin {
    width: 60px;
    height: 60px;
  }
}

.bitcoin    { background-image: url('sid5.jpg'); top: 0; left: 50%; transform: translateX(-50%); }
.ethereum   { background-image: url('sid4.jpg'); top: 50%; left: 100%; transform: translate(-50%, -50%); }
.ripple     { background-image: url('sid3.jpg'); bottom: 0; left: 50%; transform: translateX(-50%); }
.tether     { background-image: url('sid2.jpg'); top: 50%; left: 0; transform: translate(-50%, -50%); }
.binance    { background-image: url('sid1.jpg'); top: 10%; left: 10%; }
.litecoin   { background-image: url('sid.jpg'); bottom: 10%; right: 10%; }