/* ==========================================
   TRUSTED ROTATION
========================================== */

.trusted{

    position:relative;

    background:#fff;

    overflow:hidden;

}

.trusted::before{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    background:rgba(196,155,58,.08);

    border-radius:50%;

    filter:blur(120px);

    left:-150px;

    top:-120px;

}

.trusted::after{

    content:"";

    position:absolute;

    width:450px;

    height:450px;

    background:rgba(196,155,58,.06);

    border-radius:50%;

    filter:blur(120px);

    right:-150px;

    bottom:-150px;

}

.trusted-title {
  text-align: center;

  margin-bottom: 60px;
}

.trusted-circle {
  position: relative;

  width: 600px;

  height: 600px;

  margin: 0 auto;

  animation: orbit 45s linear infinite;
}

.trusted-center {
  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

  width: 140px;

  height: 140px;

  border-radius: 50%;

  background: #fff;

  display: flex;

  justify-content: center;

  align-items: center;

  box-shadow: var(--shadow-lg);

  z-index: 10;
}

.trusted-center img {
  width: 70px;
}

.trusted-item {
  position: absolute;

  width: 120px;

  height: 120px;

  border-radius: 50%;

  background: #fff;

  display: flex;

  justify-content: center;

  align-items: center;

  box-shadow: var(--shadow-md);

  animation: keepUpright 45s linear infinite;
}

.trusted-item img {
  width: 60px;
}

/* Positions */

.item-1 {
  top: 0;

  left: 50%;

  transform: translateX(-50%);
}

.item-2 {
  top: 18%;

  right: 0;
}

.item-3 {
  bottom: 18%;

  right: 0;
}

.item-4 {
  bottom: 0;

  left: 50%;

  transform: translateX(-50%);
}

.item-5 {
  bottom: 18%;

  left: 0;
}

.item-6 {
  top: 18%;

  left: 0;
}

/* Ring Rotation */

@keyframes orbit {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* Keep Logos Upright */

@keyframes keepUpright {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(-360deg);
  }
}

@media (max-width: 768px) {
  .trusted-circle {
    width: 420px;

    height: 420px;
  }

  .trusted-item {
    width: 80px;

    height: 80px;
  }

  .trusted-item img {
    width: 40px;
  }

  .trusted-center {
    width: 90px;

    height: 90px;
  }
}

