CSS ASCII-арт в блоке Div ⇐ Html

[Anonymous]

Использование наследования классов CSS для создания нескольких текстовых полей, которые можно позиционировать и выравнивать с помощью CSS.
По какой-то причине мой CSS не читается, и мое ascii-изображение не отображается так, как было до внесения изменений.
Опытному человеку не потребуется много времени, чтобы разобраться. Я уверен, что это что-то простое. Это самый общий код, который веб-дизайнер видел за всю неделю.
INDEX.HTML

Код: Выделить всё

▼ Rocket Attacks From ▼
[*]



ul {
text-align: left;
}






:..:::.:.::............ .:.:. ......:..:.:.

*--**#+%-%+ ++.=-+=-*:= +#=%=.*+=-*-*++*-*=

*--**+=#:#- == =-*+-*+= * -#::= =+*-=++=-*-

*=-**::==*. ++.+-++-++= #.-+..+.=++-+.+-.+.

=*.++.-#:= .==-+:--:=:= -#-- .=+-:=:: =..+=

.++===-=*===.

.............

.. .  .

...::----::..    ..

.......:-=++-.

..:--===========+++...  .  .

....::...    ...:--=====:... .. ..

.::-==--:.  . .=-:::..::.. ..

..:=-. ...   .....-**+++**+=:-:..

:.        .  .  ..*=.  .... .-**=.

.       .. ...:::=*.... .......-**..

.       ......:..=*...............+:.

. .. ....**=:............-

. .... .+*=:::::...... :              .

. . .....:-===++****=:..            .+.++.

. ... ... ......-+.-=.      ----.-=##-.

..   ....... ....   .=-.::   ..=##-+**##-.:=-

....:......     .-: :..-*#*::-**###**=

.........        =. .***+-. .-*###=-.

.....          .:.=++-:     .-::

.-=.::

-#...

:-

.:

:-

:

.+

..



▼ ANTIFADA MAIN MENU ▼


[list]
MAIN MENUE
[*][b]1[/b] - The American Revolution
[*][b]2[/b] - Flotilla Smugglers
[*][b]3[/b] - Infinite House Hack
[*][b]4[/b] - Discord Day Trader
[*][b]5[/b] - The Illuminatti
[*][b]0[/b] - All Other Options
[/list]

STYLE.CSS

Код: Выделить всё

body {
background-color: #050505;
color: white;
font-family: 'Ubuntu Mono';          /* requires "https://fonts.googleapis.com/css?family=Ubuntu Mono" */
font-size: 16px;
}

.box {
position: absolute;
left: 50%;
transform: translateX(-50%);
background-color: rgba(0, 0, 0, 0);
color: white;

}

.ascii {
top: 180px;
text-align: left;
line-height: 0.5;
width: 800px;
height: 800px;
white-space: pre;
overflow: hidden;
}

.numpad {
top: 380px;
text-align: left;
line-height: 0.5;
width: 800px;
height: 1600px;
white-space: pre;
overflow: hidden;
}

@extend .box
Не сработало

Подробнее здесь: https://stackoverflow.com/questions/797 ... -a-div-box