.seal {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  height: 100px;
  opacity:1;
  margin-top:20px;
}

.outter-ring {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-outter-ring.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 2;
}

.seal-text{
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-text.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
}
.inner-ring {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-inner-ring.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 10;
}

.rotate{
	animation: rotation 60s infinite linear;
	animation-delay: 0.5s;
}

.rotate-slowly{
	animation: rotation-fade 168s infinite linear;
}

.fade-in-text{
	animation: fadeIn 2s;
}

.rotate-reversed{
	animation: rotation 60s infinite linear;
	animation-direction: reverse;
}
@keyframes rotation {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(359deg);
	}
}
@keyframes rotation-fade {
		0%{opacity: 0;}
		1%{opacity: 1;}
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(359deg);
	}
}
.seal-shield {
  animation: fadeIn 5s;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-shield.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 8;
}

.seal-book {
  animation: fadeIn 8s;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-book.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
}
.seal-VRBI {
  animation: fadeIn 15s;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-VRBI.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
}
.seal-ET {
  animation: fadeIn 15s;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-ET.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
}
.seal-ORBI {
  animation: fadeIn 15s;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  background-image: url('../images/seal-ORBI.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 1;
}
@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

.pulse{
	animation: pulse 3s infinite;
	
	&:hover {
	animation-play-state: paused;
  }
}

@keyframes pulse {
  0% {
	transform: scale(1);
  }

  50% {
	transform: scale(1.1);
  }

  100% {
	transform: scale(1);
  }
}
