.total-wrap {
  width: 670px;
  margin: 50px auto;
}
.rot-wrap {
  display: block;
  width: 670px;
}
.objec {
  float: left;
  margin: 20px;
  margin-left: 90px;
  border-top: 20px solid #000;
  border-bottom: 20px solid #000;
  border-left: 20px solid #444;
  border-right: 20px solid #444;
  width: 0;
  height: 0;
  border-radius: 50%;
  animation: boxed 3s infinite 1s;
  -webkit-animation: boxed 3s infinite 1s;
}

@keyframes boxed {
  0% {transform: rotate(0deg) scale(1,1);}
  5% {transform: rotate(-60deg) scale(1,1);}
  10% {transform: rotate(60deg) scale(1.2,1.2);}
  30% {transform: rotate(0deg) scale(1,1);}
  100% {transform: rotate(0deg) scale(1,1);}
}
@-webkit-keyframes boxed {
  0% {-webkit-transform: rotate(0deg) scale(1,1);}
  5% {-webkit-transform: rotate(-60deg) scale(1,1);}
  10% {-webkit-transform: rotate(60deg) scale(1.2,1.2);}
  30% {-webkit-transform: rotate(0deg) scale(1,1);}
  100% {-webkit-transform: rotate(0deg) scale(1,1);}
}
.con-wrap {
  display: block;
  width: 670px;
  overflow: hidden;
  position: relative;
}

.convey {
  width: 100%;
  height: 20px;
  background-position: top left;
  animation: moveleft 3s infinite 1s;
  -webkit-animation: moveleft 3s infinite 1s;
}
@keyframes moveleft {
  0% {background-position: top left 0;}
  5% {background-position: top left 20%;}
  10% {background-position: top left -230%;}
  30% {background-position: top left -215%;}
  100% {background-position: top left -215%;}
}
@-webkit-keyframes moveleft {
  0% {background-position: top left 0;}
  5% {background-position: top left 20%;}
  10% {background-position: top left -230%;}
  30% {background-position: top left -215%;}
  100% {background-position: top left -215%;}
}

.con-text {
  width: 670px;
  height: 100px;
  overflow: hidden;
  font-family: sans-serif;
  text-transform: uppercase;
  font-size: 30px;
  text-align: center;
  padding: 18px 0;
}
.con-text p {
  padding: 0;
  margin: 0;
  position: absolute;
  left: 50px;
  animation: first-para 6s infinite 1s;
  -webkit-animation: first-para 6s infinite 1s;
}

@keyframes first-para {
  0% {left: 50px;}
  2% {left: 70px;}
8% {left: -280px;}
10% {left: -270px;}
50% {left: -270px;}
52% {left: -250px;} 
58% {left: -590px;} 
60% {left: -580px;}
99.999% {left: -580px;}
100% {left: 0;}
}
@-webkit-keyframes first-para {
  0% {left: 50px;}
  2% {left: 70px;}
8% {left: -280px;}
10% {left: -270px;}
50% {left: -270px;}
52% {left: -250px;} 
58% {left: -590px;} 
60% {left: -580px;}
99.999% {left: -580px;}
100% {left: 0;}
}
.con-text p:after {
  width: 670px;
  display: block;
  content: attr(data-content);
  position: absolute;
  top: 0;
  left: 580px;
}

.clear {
  clear: both;
}
