* {
    margin: 0px;
    padding: 0px;
    
}

html, body{
  background-color: rgb(255, 102, 0);
}

.form-box {
  padding-top: 40px;
}

.form-top {
  padding: 25px 25px 15px 25px;
  background: rgb(255, 102, 0);;
  text-align: left;
}

.form-top h3 { margin-top: 0; }

.form-bottom {
  padding: 25px 25px 30px 25px;
  /* background:; */
  text-align: left;
}

.form-bottom form textarea {
  height: 100px;
}

.form-bottom form .input-error {
  border-color: #d05a4e;
}


.bx{
  font-size: 3em;
  color:rgb(255, 102, 0)
}

.hero-text, h1{
  font-family: 'Syne', sans-serif;
    font-size: 3em !important;
    text-transform:uppercase !important;
    font-weight: bold;
    color: white;
}

h1{color:black;}

.title-border{
  border-bottom: solid 15px rgb(255, 102, 0);
}

.title-border-dark{
  border-bottom: solid 15px white;
}

.slider-btn{
    float: left !important;
}

.btn{
  background-color: rgb(255, 102, 0);
  border: none;
  border-radius: 0% !important;
}
.btn:hover
{
  background-color: black;
}

.bottom-border-orange {
  border-bottom: solid 10px rgb(255, 102, 0);

}

.map-container{
  overflow:hidden;
  padding-bottom:56.25%;
  position:relative;
  height:0;
}
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}


* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
  bottom: 3rem;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 75vh;
  background-color: #777;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 75vh;
  object-fit: cover;
}