@font-face {
    font-family: 'Pixelarri';
    src: url('Pixellari.ttf') format('truetype');
}
body{
background-color: #181425; 
}


.input {
 background-color: #262b44; 
 color: #ffffff;
}
 .backup {
    background-color: #262b44; /* Named color */
    font-family: 'Pixellari', monospace;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100px;
    text-shadow:  1px 1px #aeafb5;
 }
 .backup {
    background-color: #262b44;
    font-family: 'Pixellari', monospace;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100px;
    text-shadow:  1px 1px #aeafb5;
 }
 .fancyBackup {
    background-color: #262b44;
    font-family: 'Pixellari', monospace;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 300px;
    text-shadow:  1px 1px #aeafb5;
 }
.top {
 border-radius: 40px;
    margin: 20px;
    justify-content: center;
    align-items: center;
    font-family: 'Pixellari', monospace;
    color: #ffffff;
    display: flex;
    text-shadow:  1px 1px #aeafb5;
    height: 600px;
    background: #3a4466;
    overflow: hidden;
}
.topText{
padding: 20px;
 border-radius: 20px;
    margin: 20px;
    justify-content: center;
    align-items: center;
    font-family: 'Pixellari', monospace;
    color: #ffffff;
    text-shadow:  1px 1px #aeafb5;
    width: 65%;
    height: 200px;
    background: #3a4466;
    overflow: hidden;
}
.icon {
  display: flex;
  justify-content: center; /* Horizontal center */
  align-items: flex-start; /* Top alignment */
  height: 100vh; /* Or any height */
}