body{
  background-color: black;
  background-image: url(Imagens/Icons/FlagIcon_2.png);
  background-size: 200px 200px;
}

.navbar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1050;
  transition: transform 0.3s ease, opacity 0.3s ease;
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

.navbar.visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.header{
  background-color: black;
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 100%;
  display: flex;
  justify-content: center; 
  align-items: center;
  position: relative;     
}

.contentHolder{
  overflow-wrap: break-word;
}

@media (max-width: 575.98px) {
  .header {
    max-height: 50vh;
  }
}

@keyframes floatUpDown {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

@keyframes swell {
  0%, 100% {
    scale: 1;
    rotate: 0deg;
  }
  50% {
    scale: 0.95;
    rotate: -2deg;
  }
}

.img-fluid:hover{
  animation: swell 3s ease-in-out infinite;
}

.floating-text {
  animation: floatUpDown 3s ease-in-out infinite;
  display: inline-block;
}


.bottom-right {
  position: absolute;
  bottom: 5%;
  right: 5%;
}
.fade-in-section {
  opacity: 0;
  transform: translateY(20px);
  transition:  0.1s ease-out 0.1s, transform 0.1s ease-out 0.1s;
  will-change: opacity, transform;
}

.fade-in-section.is-visible {
  opacity: 1;
  transform: none;
}

@font-face {
  font-family: Pixel;
  src: url(Fonts/Pixellari.ttf);
}
@font-face {
  font-family: Spooky;
  src: url(Fonts/EspenHalloween.ttf);
}
@font-face {
  font-family: Factory;
  src: url(Fonts/robotaur.ttf);
}
@font-face {
  font-family: Fancy;
  src: url(Fonts/Chomsky.otf);
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #121314;
  color: #ffffff;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: #121314;
  color: #ffffff;
}

.projectDisplay {
position: relative;
width: 60%;
height: auto;                     
margin: 0 auto;
display: flex;
flex-wrap: wrap;                 
border-radius: 12px;
box-shadow: 10px 10px 15px rgba(255, 255, 255, 0.2);
background-size: cover;
background-position: margin-top;
background-repeat: no-repeat;
margin-top: 30px;
}