body {
  background-color: #000000;
  margin: 0;
  /*overflow: hidden;*/
  cursor: none;
}

/* Scrollbar on Firefox */
* {
  scrollbar-width: 0;
}

/* Scrollbar on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 0;
}

#booting-logo {
    margin: 0px;
    background-image: url(https://devcrew.com.pl/images/DevCrew.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    background-color: #000000 !important;
    background-position-y: 25%;
    background-size: 1400px;
    height: 100vh;
    position: relative;
    opacity: 0 ;
    animation-name: fadeIn;
    animation-duration: 1000ms;
    animation-fill-mode: forwards;
    animation-delay: 2000ms;
    overflow: hidden;
    z-index: 200;
}

@media screen and (max-width: 600px) {
 #booting-logo {
    background-size: 900px;
 }
}

@media screen and (max-width: 1024px) and (min-width: 600px) {
  #booting-logo {
    background-size: 1200px;
 }
}  

h1{
  text-align: center;
  opacity: 0 ;
  color: white;
  font-family:sans-serif;
  animation-name: fadeIn;
  animation-duration: 1000ms;
  animation-fill-mode: forwards;
  animation-delay: 2000ms;
}

#booting-terminal p  {
    display: inline;
    animation-name: writeText;
 }

.statusSuccess{
	color: #00e657;
  margin-right: 5px;
}

.statusError{
  color: red;
  margin-right: 5px;
}

#booting-terminal{
  position: absolute;
  animation-name: fadeOut;
  animation-duration: 1ms;
  animation-fill-mode: forwards;
  animation-delay: 2000ms;
  width: 100%;
  height: 100%;
  z-index: 200;
  padding: 10px;
}

.components {
  display: block;
  width: 100%;
  margin: 0;
  font-size:1.1rem;
  color: #dbdbdb;
  overflow: hidden;
  font-family: monospace;
  white-space: nowrap;
  animation-name: writeText;
  animation-duration: 2000ms;
  animation-fill-mode: forwards;
  visibility: hidden;
}

.delayed-header {
  animation-delay: 500ms;
}
.delayed-topbar {
  animation-delay: 600ms;
}
.delayed-dock {
  animation-delay: 700ms;
}
.delayed-others {
  animation-delay: 1200ms;
}
.delayed-success {
  animation-delay: 1200ms;
}

/* Standard syntax */
@keyframes writeText {
  from {
    /*opacity: 0;*/
    visibility: hidden;
  }
  to {
    /*opacity: 1;*/
    visibility: visible;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}