/* You can add custom CSS and extend Boostrap styles in this file. Remember, Bootstrap is just CSS at the end of the day! */
body {
  position: relative;
}
.oswald-<uniquifier > {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.profile {
  text-align: center;
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.7)),
    url(img/Black\ Mesa.jpeg);
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-position: center;
  width: auto;
  height: 98vh;
}
.navbarNavAltMarkup::before {
  color: azure;
}
.navbarNavAltMarkup:hover::after {
  color: #fca311;
}
.navbar-brand::before {
  font-family: "Contrail One", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  font-style: italic;
}
.navbar-brand:hover {
  color: #fca311;
}
.CoomerQ {
  color: white;
  padding-top: 150px;
}

.display-1 {
  color: #fca311;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.Avatar {
  border: solid;
  box-sizing: border-box;
  border-radius: 100px;
  border-width: 4px;
}
.Coomer {
  margin: auto;
  padding: 0 -150px 90px 100px;
  box-sizing: border-box;
  border-radius: 130px;
  font-size: 60px;
  text-decoration: underline;
}
.display-2 {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.parag {
  font-size: 26px;
  text-align: center;
}
.Mission {
  padding-top: 100px;
  padding-bottom: 150px;
  background-color: #fca311;
  text-align: center;
  font-size: 20px;
}
.col-12 col-md-6 {
  display: flex;
  justify content: space-evenly;
  margin: auto;
  margin-right: 40px;
  text-align: center;
  font-size: 25px;
}
.col-12 img {
  width: 300px;
  margin: 20px;
  padding: 10px;
}
/* .image-gallery {
  width: 50%;
  background-color: black;
} */
/* .carousel-item {
  background-position: center;
  width: 50vh;
} */
.carousel > .carousel-inner > .carousel-item > img {
  width: 200px; /* Yeap you can change the width and height*/
  height: 800px;
}
/* .carousel-inner {
  margin-top: -16px;
  border: solid;
  border-color: black;
  border-width: 10px; */
/* width: clamp(200px, 40%, 400px); */
/* height: "800px";
  width: "300"; */
/* } */
/* .carousel-item {
  max-width: 65vh;
} */
/* .carousel-inner img,
.carousel slide {
  margin: auto;
} */
.contacts {
  text-align: center;
  font-size: 50px;
}
.p1 {
  color: #fca311;
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.row-1 {
  background-color: black;
  display: absolute;
  justify-content: center;
  background-size: 1000px;
  margin: auto;
  margin-bottom: 10px;
}
.container-1 {
  background-color: black;
}
.col {
  font-size: 500px;
  text-decoration: underline;
  color: #fca311;
}
h3 {
  color: white;
}
.col-4 {
  text-align: center;
  margin: auto;
  display: flex;
}
.p1 {
  text-align: center;
}
gallery {
  object-position: center;
  margin-botom: -30px;
}
.skill-section{
  padding-top: 100px;
}
.sets {
  margin: 10px;
  display: flex;
  justify-content: space-around;
}
.lists {
  display: flex;
  text-align: center;
  justify-content: space-around;
  padding-left: 20px;
}
.icons {
  color: black;
}
.bi::before {
  font-size: 100px;
  fill: black;
}
.bi:hover {
  color: #fca311;
}
footer {
  background-image: url(img/Black\ mesa.png);
  background-size: 300px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: black;
  padding: 0 30px 500px 0;
  font-size: 20px;
  color: white;
  margin: auto;
  text-align: center;
}
#contact-section-target,
#skill-section-target,
#gallery-target,
#missionsection-target{
  position: relative;
  top: -500px;
}