body {
  color: darkslategrey;
  background-color: var(--bs-gray-300);
}

a {
  text-decoration: none;
  color: inherit;
}

img {
  width: 250px;
  max-width: 100%;
  height: auto;
  transition: 100ms linear;
}

img:hover {
  transform: scale(1.2);
}

.rounded {
  border-radius: 50%;
}

.navbar {
  padding: 0;
  text-align: center;
  background-color: darkslategrey !important;
  box-shadow: 5px 0 10px var(--bs-black);
  --bs-navbar-toggler-border-color: var(--bs-white);
}

.navbar-brand{
  color: var(--bs-white);
  transition: 100ms linear;
  cursor: default;
}

.navbar-brand:hover{
  color: var(--bs-white);
  transform: scale(1.1);
}

.navbar-brand:visited{
  color: var(--bs-white);
}

.dw {
  font-family: 'The Nautigal', cursive;
  font-size: 30px;
}

.navbar-brand span:not(.dw){
  display: none;
}

.nav-item {
  cursor: pointer;
}

.nav-link{
  color: var(--bs-white);
}

.nav-link:hover {
  background-color: var(--bs-white);
  color: darkslategrey;
  box-shadow: 0 0 10px var(--bs-black);
}

.navbar-toggler {
  color: var(--bs-white) !important
}

#search {
  margin: 0 0 10px 0;
}

main {
  transition: all 400ms;
  height: 110vh;
}

#pages {
  height: 100%;
}

.carousel-item:not(about-page) {
  padding-top: 50px;
  height: 100%;
  overflow: scroll;
}

.carousel-inner {
  text-align: center;
  height: 100%;
}

.card-group {
  display: flex;
  justify-content: center;
  flex-flow: column;
  align-items: center;
}

.card .spinner-border {
  margin: 25%;
}

.display-1 {
  font-family: 'The Nautigal', cursive;
}

#project-links,
#credential-links {
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
  align-items: center;
}

.nav-tabs {
  background-color: var(--bs-white);
  margin: 0 0 30px 0;
  border: 1px solid;
  width: 100%;
}

repo-tab {
  width: 95%;
}

.repo-name {
  color: var(--bs-white);
  background-color: darkslategray;
  text-align: left;
}

code {
  width: 200px;
  height: 850px;
  text-align: left;
  overflow: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

code::-webkit-scrollbar {
  display: none;
}

#resume {
  width: 100%;
  height: 800px;
}

#fs-web {
  height: 300px;
  width: 300px;
}

/* @keyframes fadeIn {
  0% {
    transform: translateX(-300px);
    opacity: 0%;
  }
  100% {
    transform: translateX(0px);
    opacity: 100%;
  }
} */

@media (min-width: 768px) {
  code {
    width: 500px;
  }
}

@media (min-width: 992px) {
  .navbar-brand span:not(.dw){
    display: initial;
  }

  .nav-link{
    padding: 15px 0 0 0;
    margin: 0 0 15px 0;
    height: 115%;
  }

  #search {
    margin: 0;
  }

  .carousel-item {
    padding-top: initial;
    height: initial;
    overflow: initial;
  }

  .card-group {
    flex-flow: row;
    justify-content: initial;
    overflow: scroll;
  }

  #projects {
    margin-top: 5%
  }

  #project-links,
  #credential-links {
    flex-flow: row wrap;
  }

  .project-img {
    height: 150px;
    width: auto;
    max-width: 100%;
  }

  repo-tab {
    width: 100%;
  }

  .repo-name{
    font-weight: bolder;
  }

  code {
    width: 100%;
    height: 400px;
  }

  #resume-page {
    padding-top: 75px;
  }

  #resume {
    height: 700px;
    width: 65%;
  }

  #fs-web {
    height: 600px;
    width: 900px;
  }
}