html {height:100%;}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin:0;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}
img {max-width: 100%; width: 250px; height: auto;}
.header {margin: 0 auto; width: 100%;}
.logo-bg {
  background-image: url(../images/Coin-Buy-Elites-Logo-Web-removebg-preview.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  width: 250px;
  height: 250px;
}
.bg {
  /* animation:slide 3s ease-in-out infinite alternate; */
  background-image: linear-gradient(-60deg, gold 45%, #000 55%);
  bottom:0;
  left:-50%;
  opacity:.5;
  position:fixed;
  right:-50%;
  top:0;
  z-index:-1;
}
.bg2 {animation-direction:alternate-reverse;animation-duration:4s;}
.bg3 {animation-duration:5s;}
section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  width: 100%;
}
.wrapper {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 20px;
  width: 100%;
}
.inner-wrapper {
  display: flex;
  flex: 0 0 26.6667%;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: flex-start;
  align-self: self-start;
  margin-right: 20px;
}
.content {
  background-color:rgba(255,255,255,.5);
  border-radius:.25em;
  box-shadow:0 0 .25em rgba(0,0,0,.25);
  box-sizing:border-box;
  display: flex;
  flex: 0 0 26.66666%;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 20px;
  padding: 2vmin;
  margin: 0 10px 5vmin;
  text-align: center;
  width: 100%;
  /* position:fixed;
  left:50%;
  top: 60%;
  transform:translate(-50%, -50%); */
}
.content p {color: #000;}
iframe#widget {overflow: hidden; width: 100%; height: auto; min-height: 700px;}
footer {
  background-color: #000;
  border-top: solid 1px goldenrod;
  margin-top: auto;
  width: 100%;
  text-align: center;
  color: goldenrod;
  font-size: 11px;
}
@keyframes slide {
  0% {
    transform:translateX(-25%);
  }
  100% {
    transform:translateX(25%);
  }
}
@media (max-width: 1466px) {
  .content {flex: 0 0 33%;}
}
@media (max-width: 1100px) {
  .content {flex: 0 0 40%;}
}
@media (max-width: 900px) {
  .content {flex: 0 0 48%;}
}
@media (max-width: 680px) {
  .wrapper {flex-direction: column; flex-wrap: wrap;}
  .inner-wrapper {margin: 0;}
  .content {flex: 0 0 98%; margin: 0 auto 20px;}
}