html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;  /* Prevent horizontal scrolling */
  width: 100%;         /* Ensure the page width is 100% of the viewport */
}

.bg-danger {
  --bs-bg-opacity: 1;
  background-color: #C12D2D !important;
}

/* *, *::before, *::after {
  box-sizing:content-box;
} */

.floating {
  position: relative;
  animation: float 3s ease-in-out infinite;
}

@keyframes float {
  0% {
      transform: translateY(0);
  }

  50% {
      transform: translateY(-20px);
  }

  100% {
      transform: translateY(0);
  }
}


#mainNav {
  background-color: #1E1F1F !important;
}

.navbar-toggler {
  background-color: #C32C2E !important;
}

.masthead {
  background-color: #C32C2E !important;
}

h2 {
  padding-bottom: 8px;
}

#portfolio, #portfolio-2, #package {
  padding-top: 90px;
  background-color: #1E1F1F;
  color: white;
}

h5 {
  text-align: center;
  padding-bottom: 16px;
}

a:hover {
  color: #C32C2E !important;
}

@media (min-width: 992px) {
  #mainNav .navbar-nav > li.nav-item > a.nav-link.active {
    color: #fff;
    background: #C32C2E !important;
  }
}


strong {
  color: #dc3545;
  font-weight: 600;
}

.highlight {
  border: dotted #b43435;
  margin-bottom: 1em;
}

.packagerow {
  margin-top: 1em;
}

.btn-style {
  display: block;
  align-items: center;
  margin: 2em 0em;
}

.insidebutton {
  margin-bottom: 2em;
}

.portfolio .portfolio-item .portfolio-item-caption {
  background-color: #dc3545b3 !important;
}



a {
  color: #dc3545;
}

a:focus, a:hover, a:active {
  color: #7d7d7d;
}

#mainNav .navbar-nav li.nav-item a.nav-link.active {
  color: #cfcfcf;
}

.bgheader {
  background-image: url(../img/header.png);
  background-size:cover;          /* Ensures the image covers the entire section */
  background-position: center;      /* Centers the image within the section */
  background-repeat: no-repeat;     /* Prevents the image from repeating */
  width: 100%;                      /* Ensure the section width covers the full screen or container */
  height: 100vh;                    /* Adjust height to the full viewport height */
}

.text-filter{
  text-shadow: -1px -1px 0 #ffffffa3, 1px -1px 0 #ffffffa3, 1px 1px 0 white, 1px 1px 0 #ffffffa3;
  filter: drop-shadow(2px 4px 6px white);
}


@media (max-width: 768px) {
  .hide-on-mobile {
    display: none !important;  /* For screens wider than 768px (tablets and desktops), the element will be visible */
  }
}

@media (min-width: 768px) {
  .hide-on-pc {
    display: none !important;  /* For screens wider than 768px (tablets and desktops), the element will be visible */
  }
}

.carousel {
  position: inherit !important;
  margin-top: -1px;
}
