1
body {
2
    background-color: black;
3
    color: white;
4
  }
5
  
6
  @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
7
  .credit {
8
    font-family: "Montserrat", sans-serif;
9
    text-align: center;
10
  }
11
  a {
12
    color: #4287f5;
13
  }
14
  input {
15
    background: rgba(0, 0, 0, 0);
16
    border: none;
17
    outline: none;
18
    width: 100%;
19
    border-bottom: 1px solid #63de00;
20
    color: #63de00;
21
    font-family: "Montserrat", sans-serif;
22
    font-size: inherit;
23
  }
24
  
25
  ::placeholder {
26
    /* Chrome, Firefox, Opera, Safari 10.1+ */
27
    font-style: italic;
28
    color: white;
29
    opacity: 1; /* Firefox */
30
  }
31
  
32
  :-ms-input-placeholder {
33
    /* Internet Explorer 10-11 */
34
    color: white;
35
  }
36
  
37
  ::-ms-input-placeholder {
38
    /* Microsoft Edge */
39
    color: white;
40
  }
41
  
42
  .console-container {
43
    margin: auto;
44
    font-family: "Montserrat", sans-serif;
45
    height: 40vh;
46
    margin-bottom: 10vh;
47
  }
48
  
49
  .console {
50
    width: 100%;
51
    box-sizing: border-box;
52
    margin: auto;
53
    overflow: hidden;
54
    font-family: "Montserrat", sans-serif;
55
  }
56
  
57
  .console-input {
58
    padding-bottom: 15%;
59
    font-family: "Montserrat", sans-serif;
60
  }
61
  
62
  .console h1 {
63
    font-family: "Montserrat", sans-serif;
64
    text-align: center;
65
    color: #fff;
66
  }
67
  
68
  .console .consolebody {
69
    box-sizing: border-box;
70
    font-family: "Montserrat", sans-serif;
71
    padding: 20px;
72
    background-color: #3b3b3b;
73
    color: #63de00;
74
    border-radius: 15px;
75
  }
76
  
77
  .consolebody {
78
    font-family: "Montserrat", sans-serif;
79
  }
80
  
81
  .console .consolebody p {
82
    line-height: 1.5rem;
83
  }
84
  
85
  .button-wrapper {
86
    padding-top: 2%;
87
    text-align: center;
88
    font-family: "Montserrat", sans-serif;
89
  }
90
  
91
  .console-button {
92
    font-family: "Montserrat", sans-serif;
93
    font-weight: bold;
94
    text-transform: uppercase;
95
    padding: 0.6em 2em;
96
    margin-right: 2em;
97
    border: none;
98
    outline: none;
99
    color: rgb(0, 0, 0);
100
    background: white;
101
    cursor: pointer;
102
    position: relative;
103
    border-radius: 10px;
104
    font-size: 20px;
105
  }
106
  
107
  .console-button:before {
108
    content: "";
109
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
110
    position: absolute;
111
    top: -2px;
112
    left: -2px;
113
    background-size: 400%;
114
    z-index: -1;
115
    filter: blur(5px);
116
    width: calc(100% + 4px);
117
    height: calc(100% + 4px);
118
    animation: glowingbn5 20s linear infinite;
119
    opacity: 0;
120
    transition: opacity 0.3s ease-in-out;
121
    border-radius: 10px;
122
    font-family: "Montserrat", sans-serif;
123
  }
124
  
125
  @keyframes glowingbn5 {
126
    0% {
127
      background-position: 0 0;
128
    }
129
    50% {
130
      background-position: 400% 0;
131
    }
132
    100% {
133
      background-position: 0 0;
134
    }
135
  }
136
  
137
  .console-button:active {
138
    color: black;
139
  }
140
  
141
  .console-button:active:after {
142
    background: transparent;
143
  }
144
  
145
  .console-button:hover:before {
146
    opacity: 1;
147
  }
148
  
149
  .console-button:after {
150
    z-index: -1;
151
    content: "";
152
    position: absolute;
153
    width: 100%;
154
    height: 100%;
155
    background: black;
156
    left: 0;
157
    top: 0;
158
    border-radius: 10px;
159
  }
160