.model {
  display: none;
  position: fixed;
  z-index: 999;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}

.model.share-show {
  animation: scale-in 0.25s ease 0s 1 normal forwards;
}

.model.share-hide {
  animation: scale-out 0.25s ease 0s 1 normal forwards;
}

.model .model-content {
  padding: 20px;
}

.model .model-nav {
  padding: 8px 20px;
  font-size: 16px;
  line-height: 24px;
  color: rgb(148 163 184);
  background-color: rgb(241 245 249);
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.model .model-nav i.close {
  display: block;
  cursor: pointer;
  background-color: rgb(148 163 184);
  width: 16px;
  height: 16px;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M8 8L40 40'/%3E%3Cpath d='M8 40L40 8'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M8 8L40 40'/%3E%3Cpath d='M8 40L40 8'/%3E%3C/g%3E%3C/svg%3E");
  mask-size: 100%;
  -webkit-mask-size: 100%;
  transition: 0.1s;
}

.model .model-nav i.close:hover {
  background-color: rgb(71 85 105);
}

@keyframes scale-in {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes scale-out {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

.share ul li a {
  cursor: pointer;
}

.share li.s1 a {
  background-color: #0d5185;
  mask-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="16" height="16" viewBox="0 0 16 16"%3E%3Cpath fill="currentColor" d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131c.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951"%2F%3E%3C%2Fsvg%3E');
  -webkit-mask-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="16" height="16" viewBox="0 0 16 16"%3E%3Cpath fill="currentColor" d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131c.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951"%2F%3E%3C%2Fsvg%3E');
  mask-size: 100%;
  -webkit-mask-size: 100%;
}

.share li.s2 a {
  background-color: #000;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="%23fff" d="M18.205 2.25h3.308l-7.227 8.26l8.502 11.24H16.13l-5.214-6.817L4.95 21.75H1.64l7.73-8.835L1.215 2.25H8.04l4.713 6.231zm-1.161 17.52h1.833L7.045 4.126H5.078z"%2F%3E%3C%2Fsvg%3E');
  background-size: 60% 60%;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50%;
}

.share li.s4 a {
  background-color: #d52c2b;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="512" height="512" viewBox="0 0 512 512"%3E%3Cpath fill="%23fff" d="M407 177.6c7.6-24-13.4-46.8-37.4-41.7c-22 4.8-28.8-28.1-7.1-32.8c50.1-10.9 92.3 37.1 76.5 84.8c-6.8 21.2-38.8 10.8-32-10.3M214.8 446.7C108.5 446.7 0 395.3 0 310.4c0-44.3 28-95.4 76.3-143.7C176 67 279.5 65.8 249.9 161c-4 13.1 12.3 5.7 12.3 6c79.5-33.6 140.5-16.8 114 51.4c-3.7 9.4 1.1 10.9 8.3 13.1c135.7 42.3 34.8 215.2-169.7 215.2m143.7-146.3c-5.4-55.7-78.5-94-163.4-85.7c-84.8 8.6-148.8 60.3-143.4 116s78.5 94 163.4 85.7c84.8-8.6 148.8-60.3 143.4-116M347.9 35.1c-25.9 5.6-16.8 43.7 8.3 38.3c72.3-15.2 134.8 52.8 111.7 124c-7.4 24.2 29.1 37 37.4 12c31.9-99.8-55.1-195.9-157.4-174.3m-78.5 311c-17.1 38.8-66.8 60-109.1 46.3c-40.8-13.1-58-53.4-40.3-89.7c17.7-35.4 63.1-55.4 103.4-45.1c42 10.8 63.1 50.2 46 88.5m-86.3-30c-12.9-5.4-30 .3-38 12.9c-8.3 12.9-4.3 28 8.6 34c13.1 6 30.8.3 39.1-12.9c8-13.1 3.7-28.3-9.7-34m32.6-13.4c-5.1-1.7-11.4.6-14.3 5.4c-2.9 5.1-1.4 10.6 3.7 12.9c5.1 2 11.7-.3 14.6-5.4c2.8-5.2 1.1-10.9-4-12.9"%2F%3E%3C%2Fsvg%3E');
  background-size: 65% 65%;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50%;
}

.share li.s6 a {
  background-color: #09bc64;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="%23fff" fill-rule="evenodd" clip-rule="evenodd"%3E%3Cpath d="M8.452 3.5C4.149 3.5.5 6.425.5 10.214c0 1.94.97 3.668 2.484 4.878v1.682a.5.5 0 0 0 .634.482l2.363-.657a9.307 9.307 0 0 0 2.63.329a.202.202 0 0 0 .192-.24a6.457 6.457 0 0 1-.097-1.122c0-3.898 3.405-6.637 7.197-7.01a.198.198 0 0 0 .172-.26C15.088 5.48 12 3.5 8.452 3.5M6.855 7.46a1.065 1.065 0 1 1-2.13 0a1.065 1.065 0 0 1 2.13 0m4.258 1.064a1.065 1.065 0 1 0 0-2.129a1.065 1.065 0 0 0 0 2.13"%2F%3E%3Cpath d="M16.79 9.887c3.617 0 6.71 2.461 6.71 5.679c0 1.632-.81 3.084-2.07 4.104v1.362a.5.5 0 0 1-.634.482l-1.947-.541a7.845 7.845 0 0 1-2.059.271c-3.616 0-6.71-2.46-6.71-5.678s3.094-5.679 6.71-5.679m-2.244 4.758a.932.932 0 1 0 0-1.863a.932.932 0 0 0 0 1.863m5.456-.931a.931.931 0 1 1-1.863 0a.931.931 0 0 1 1.863 0"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
  background-size: 65% 65%;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50%;
}