:root {
  --huf-orange: #ef7f1a;
  --huf-orange-lighter: #f09532;
  --huf-grey: #5b5b5b;
  --huf-grey-darker: #212529;

  --huf-white: #ffe9d0;
  --huf-red: #eb585c;
  --huf-rose: #c15085;
  --huf-violet: #815692;
  --huf-blue: #46547e;
  --huf-blue-darker: #2f4858;
}

.bg-dark {
  background-color: var(--huf-grey) !important;
}

.bg-dark {
  background-color: var(--huf-grey) !important;
}

body {
  font-family: "Manrope", sans-serif;
}

nav {
  background-color: var(--huf-grey-darker);
  color: var(--huf-orange);
}

nav a,
nav a:visited,
.footer a,
.footer a:visited {
  color: var(--huf-grey-darker);
}

nav a:hover,
footer a:hover {
  color: var(--huf-grey);
}

.text-orange {
  color: var(--huf-orange);
}

.border-orange {
  border-color: var(--huf-orange);
}

.bg-lighter-grey {
  background-color: var(--huf-grey);
}

.bg-grey {
  background-color: var(--huf-grey-darker);
}

.bg-orange {
  background-color: var(--huf-orange);
  color: #fff;
}

.standard-img {
    border-radius: 5px;
  }

.btn-outline-light {
  color: var(--huf-orange);
  border-color: var(--huf-orange);
}
.fa-angle-left,
.fa-angle-right {
    color: var(--huf-orange);
}
.btn-primary,
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active,
.btn-primary .badge {
  color: #fff;
  background-color: var(--huf-orange);
  border-color: var(--huf-orange);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: var(--huf-orange-lighter);
  border-color: var(--huf-orange-lighter);
}
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  background-color: var(--huf-orange-lighter);
}

.text-shadow {
  text-shadow: 2px 2px 2px #000000;
}
.anchor {
  scroll-margin-top: 80px;
}


#navbarNav1 {
  transition: height 0.5s ease;
}

.header-40-years{
  padding-left: 10px;
  padding-top: 3px;
  padding-bottom: 3px;
  letter-spacing: 2px;


}

.slider {
  margin-bottom: 30px;
  position: relative;
}
.slider .owl-item.active.center .slider-card {
  transform: scale(1.15);
  opacity: 1;


}
.slider-card {
  background: #fff;
  padding: 0px 0px;
  margin: 50px 15px 90px 15px;
  border-radius: 5px;
  box-shadow: 0 15px 45px -20px rgb(0 0 0 / 73%);
  transform: scale(0.9);
  opacity: 0.5;
  transition: all 0.3s;
}
.slider-card img {
  border-radius: 5px 5px 0px 0px;
}
.owl-nav .owl-prev {
  position: absolute;
  top: calc(50% - 25px);
  left: 0;
  opacity: 1;
  font-size: 30px !important;
  z-index: 1;
}
.owl-nav .owl-next {
  position: absolute;
  top: calc(50% - 25px);
  right: 0;
  opacity: 1;
  font-size: 30px !important;
  z-index: 1;
}
.owl-dots {
  text-align: center;
}
.owl-dots .owl-dot {
  height: 10px;
  width: 10px;
  border-radius: 10px;
  background: #ccc !important;
  margin-left: 3px;
  margin-right: 3px;
  outline: none;
}
.owl-dots .owl-dot.active {
  background: var(--huf-orange) !important;
}

.icon,
.icon:active,
.icon:visited{
    position: absolute;
    z-index: 999;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 30%; /* Adjust this value to move the positioned div up and down */
    text-align: center;
    text-decoration: none;
    color: rgba(0, 0, 0, 0.2);
}

.icon:hover{
    color: rgba(0, 0, 0, 0.5);
}

.text-outline{
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}


.offcanvas-top {
  transition: transform 0.3s ease;
  height:auto!important;
}