Template:沙盒/TemplateStyles/What7what8/roll.css

.ascii-container {
    background: #000;
    color: #fff;
    position: relative;
    width: 440px;
    height: 360px;
    overflow: hidden;
    font-family: monospace;
}

.ascii-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    white-space: pre;
    font-size: 10px;
    line-height: 1;
    opacity: 0;
    animation: fadeFrames 22.2s infinite;
}

/* Frame delays */
.frame-1 { animation-delay: 0.00s; }
.frame-2 { animation-delay: 0.15s; }
.frame-3 { animation-delay: 0.30s; }
.frame-4 { animation-delay: 0.45s; }
.frame-5 { animation-delay: 0.60s; }
.frame-6 { animation-delay: 0.75s; }
.frame-7 { animation-delay: 0.90s; }
.frame-8 { animation-delay: 1.05s; }
.frame-9 { animation-delay: 1.20s; }
.frame-10 { animation-delay: 1.35s; }
.frame-11 { animation-delay: 1.50s; }
.frame-12 { animation-delay: 1.65s; }
.frame-13 { animation-delay: 1.80s; }
.frame-14 { animation-delay: 1.95s; }
.frame-15 { animation-delay: 2.10s; }
.frame-16 { animation-delay: 2.25s; }
.frame-17 { animation-delay: 2.40s; }
.frame-18 { animation-delay: 2.55s; }
.frame-19 { animation-delay: 2.70s; }
.frame-20 { animation-delay: 2.85s; }
.frame-21 { animation-delay: 3.00s; }
.frame-22 { animation-delay: 3.15s; }
.frame-23 { animation-delay: 3.30s; }
.frame-24 { animation-delay: 3.45s; }
.frame-25 { animation-delay: 3.60s; }
.frame-26 { animation-delay: 3.75s; }
.frame-27 { animation-delay: 3.90s; }
.frame-28 { animation-delay: 4.05s; }
.frame-29 { animation-delay: 4.20s; }
.frame-30 { animation-delay: 4.35s; }
.frame-31 { animation-delay: 4.50s; }
.frame-32 { animation-delay: 4.65s; }
.frame-33 { animation-delay: 4.80s; }
.frame-34 { animation-delay: 4.95s; }
.frame-35 { animation-delay: 5.10s; }
.frame-36 { animation-delay: 5.25s; }
.frame-37 { animation-delay: 5.40s; }
.frame-38 { animation-delay: 5.55s; }
.frame-39 { animation-delay: 5.70s; }
.frame-40 { animation-delay: 5.85s; }
.frame-41 { animation-delay: 6.00s; }
.frame-42 { animation-delay: 6.15s; }
.frame-43 { animation-delay: 6.30s; }
.frame-44 { animation-delay: 6.45s; }
.frame-45 { animation-delay: 6.60s; }
.frame-46 { animation-delay: 6.75s; }
.frame-47 { animation-delay: 6.90s; }
.frame-48 { animation-delay: 7.05s; }
.frame-49 { animation-delay: 7.20s; }
.frame-50 { animation-delay: 7.35s; }
.frame-51 { animation-delay: 7.50s; }
.frame-52 { animation-delay: 7.65s; }
.frame-53 { animation-delay: 7.80s; }
.frame-54 { animation-delay: 7.95s; }
.frame-55 { animation-delay: 8.10s; }
.frame-56 { animation-delay: 8.25s; }
.frame-57 { animation-delay: 8.40s; }
.frame-58 { animation-delay: 8.55s; }
.frame-59 { animation-delay: 8.70s; }
.frame-60 { animation-delay: 8.85s; }
.frame-61 { animation-delay: 9.00s; }
.frame-62 { animation-delay: 9.15s; }
.frame-63 { animation-delay: 9.30s; }
.frame-64 { animation-delay: 9.45s; }
.frame-65 { animation-delay: 9.60s; }
.frame-66 { animation-delay: 9.75s; }
.frame-67 { animation-delay: 9.90s; }
.frame-68 { animation-delay: 10.05s; }
.frame-69 { animation-delay: 10.20s; }
.frame-70 { animation-delay: 10.35s; }
.frame-71 { animation-delay: 10.50s; }
.frame-72 { animation-delay: 10.65s; }
.frame-73 { animation-delay: 10.80s; }
.frame-74 { animation-delay: 10.95s; }
.frame-75 { animation-delay: 11.10s; }
.frame-76 { animation-delay: 11.25s; }
.frame-77 { animation-delay: 11.40s; }
.frame-78 { animation-delay: 11.55s; }
.frame-79 { animation-delay: 11.70s; }
.frame-80 { animation-delay: 11.85s; }
.frame-81 { animation-delay: 12.00s; }
.frame-82 { animation-delay: 12.15s; }
.frame-83 { animation-delay: 12.30s; }
.frame-84 { animation-delay: 12.45s; }
.frame-85 { animation-delay: 12.60s; }
.frame-86 { animation-delay: 12.75s; }
.frame-87 { animation-delay: 12.90s; }
.frame-88 { animation-delay: 13.05s; }
.frame-89 { animation-delay: 13.20s; }
.frame-90 { animation-delay: 13.35s; }
.frame-91 { animation-delay: 13.50s; }
.frame-92 { animation-delay: 13.65s; }
.frame-93 { animation-delay: 13.80s; }
.frame-94 { animation-delay: 13.95s; }
.frame-95 { animation-delay: 14.10s; }
.frame-96 { animation-delay: 14.25s; }
.frame-97 { animation-delay: 14.40s; }
.frame-98 { animation-delay: 14.55s; }
.frame-99 { animation-delay: 14.70s; }
.frame-100 { animation-delay: 14.85s; }
.frame-101 { animation-delay: 15.00s; }
.frame-102 { animation-delay: 15.15s; }
.frame-103 { animation-delay: 15.30s; }
.frame-104 { animation-delay: 15.45s; }
.frame-105 { animation-delay: 15.60s; }
.frame-106 { animation-delay: 15.75s; }
.frame-107 { animation-delay: 15.90s; }
.frame-108 { animation-delay: 16.05s; }
.frame-109 { animation-delay: 16.20s; }
.frame-110 { animation-delay: 16.35s; }
.frame-111 { animation-delay: 16.50s; }
.frame-112 { animation-delay: 16.65s; }
.frame-113 { animation-delay: 16.80s; }
.frame-114 { animation-delay: 16.95s; }
.frame-115 { animation-delay: 17.10s; }
.frame-116 { animation-delay: 17.25s; }
.frame-117 { animation-delay: 17.40s; }
.frame-118 { animation-delay: 17.55s; }
.frame-119 { animation-delay: 17.70s; }
.frame-120 { animation-delay: 17.85s; }
.frame-121 { animation-delay: 18.00s; }
.frame-122 { animation-delay: 18.15s; }
.frame-123 { animation-delay: 18.30s; }
.frame-124 { animation-delay: 18.45s; }
.frame-125 { animation-delay: 18.60s; }
.frame-126 { animation-delay: 18.75s; }
.frame-127 { animation-delay: 18.90s; }
.frame-128 { animation-delay: 19.05s; }
.frame-129 { animation-delay: 19.20s; }
.frame-130 { animation-delay: 19.35s; }
.frame-131 { animation-delay: 19.50s; }
.frame-132 { animation-delay: 19.65s; }
.frame-133 { animation-delay: 19.80s; }
.frame-134 { animation-delay: 19.95s; }
.frame-135 { animation-delay: 20.10s; }
.frame-136 { animation-delay: 20.25s; }
.frame-137 { animation-delay: 20.40s; }
.frame-138 { animation-delay: 20.55s; }
.frame-139 { animation-delay: 20.70s; }
.frame-140 { animation-delay: 20.85s; }
.frame-141 { animation-delay: 21.00s; }
.frame-142 { animation-delay: 21.15s; }
.frame-143 { animation-delay: 21.30s; }
.frame-144 { animation-delay: 21.45s; }
.frame-145 { animation-delay: 21.60s; }
.frame-146 { animation-delay: 21.75s; }
.frame-147 { animation-delay: 21.90s; }
.frame-148 { animation-delay: 22.05s; }

@keyframes fadeFrames {
    0%, 0.675% {
        opacity: 1;
    }
    0.7%, 100% {
        opacity: 0;
    }
}