@import url('https://fonts.googleapis.com/css2?family=Gloock&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');

.readMore{
	margin-right: 50px;
}


.readMore .btn {
  display: inline-block;
  color: #005A9C;
  padding: 24px;
  position: relative;
  letter-spacing: 1px;
}
.readMore .btn__circle, .btn__text, .btn__white-circle {
  position: absolute;
}
.readMore .btn__circle {
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 100%;
  width: 100%;
  box-shadow: 0 0 1px 1px #005A9C;;
  transition: 0.3s linear;
}
.readMore .btn__white-circle {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  width: 56px;
  height: 56px;
  border-radius: 100%;
  background: #005A9C;
  display: flex;
  transition: 0.3s ease-in-out;
}
.readMore .btn__white-circle svg {
  width: 24px;
  height: 24px;
  margin: auto;
}
.readMore .btn__text {
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  z-index: 2;
  padding: 24px 8px;
  transition: 0.3s linear;
}
.readMore .btn:hover .btn__circle {
  transform: scale(0);
}
.readMore .btn:hover .btn__white-circle {
  transform: translate(-50%, -50%) scale(1);
}
.readMore .btn:hover .btn__text {
  transform: translate(40px, -50%);
}