
html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  background-color: #bfbf86;
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: large;
  overflow-x: hidden;
}

h1 {
  color: #bfbf86;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  margin-left: 2vw;
}

h2 {
  font-size: 5vw;
  padding: 1vw;
  color: whitesmoke;
}

h3 {
  font-size: 10vh;
  color: #660000;
}

h4 {
  font-size: 50px;
} 

h5 {
  font-size: 20px;
  padding: 2vh;
}

/* Navigation bar */

.navbar-items {
  align-items: right;
  color: #bfbf86;
}

.navbar {
  background-color: #660000;
  width: 100vw;
  color: #bfbf86;
}

.navbar-logo {
  height: 10vh;
  background-color: #bfbf86;
}

.nav-link {
  color: #bfbf86 !important;
}


/* Equipment */

.trailer-pic {
  width: 50vw;
  border: solid #660000;
  border-radius: 20px;
  margin: 2vw;
}

.trailer-dis {
  margin-top: 2vw;
  margin-bottom: 2vw;
  height: max-content;
  border: solid black;
  border-radius: 10px;
  background-color: #660000;
  color: whitesmoke;
}

.truck-pic {
  width: 50vw;
  border: solid #660000;
  border-radius: 20px;
  margin: 2vw;
}

.truck-dis {
  margin-top: 2vw;
  margin-bottom: 2vw;
  height: max-content;
  border: solid black;
  border-radius: 10px;
  background-color: #660000;
  color: whitesmoke;
}

/* Footer */

footer {
  background-color: #660000;
  height: max-content;
}

.footer-top {
  border-top: solid;
  border-bottom: solid;
  border-color: #bfbf86;
  width: 100vw;
  padding-bottom: 10vh;
}

.nav-bottom {
  margin-top: 3vh;
  float: center;
  width: max-content;
}

.nav-link {
  color: #bfbf86;
}

.footer-logo-1 {
  width: 20vw;
}

.more-info-text {
  color: whitesmoke;
  text-shadow: none;
  margin-top: 2vh;
  font-size: 8vh;
}

.more-info-text-2 {
  color: whitesmoke;
  text-shadow: none;
  font-size: 3vh;
}

.contact-button {
  color: #660000;
  background-color: #bfbf86;
  font-size: 2vw;
  border: solid whitesmoke;
}

p :hover {
  background-color: transparent !important;
  color: whitesmoke !important;
}

hr {
  width: 30vw;
  color: #bfbf86;
}

.license {
  color: #bfbf86;
  display: flex;
  justify-content: center;
  margin-top: 1vh;
}

/* Carousel */

.carousel-img {
  height: 50vh;
  max-width: fit-content;
  display: flex;
  justify-content: center;
  margin: 2vw;
  border-radius: 10px;
}

/* Social Links */

.social {
  display: flex;
  justify-content: center;
  width: max-content;
  border-radius: 20px;
}

.socials-link {
  fill: #bfbf86;
  height: 4vh;
  margin-right: 1vw;
}

.linkedIn {
  fill: #bfbf86;
  height: 5vh;
  margin-right: 1vw;
}

.facebook {
  color: #bfbf86;
  height: 5vh;
}

#myBtn {
  display: flex; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: whitesmoke; /* Set a background color */
  color: #660000; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
  float: right;
  width: max-content;
}

#myBtn:hover {
  background-color: #bfbf86; /* Add a dark-grey background on hover */
  color: whitesmoke;
}