@charset "UTF-8";
/*!
* Horizon specific styles
*/

/* MAIN STYLES FOR BODY */

body {
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1.125rem;
  font-weight: 300;
  line-height: 1.5;
  color: #444444;
  text-align: left;
  background-color: #fff;
}

a {
    color: #F36907;
}

.text-grey {
  color: #444444;
  font-weight: 400;
}


/* BACKGROUND IMAGES */

/** home **/
.home-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-1.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

 .home-page .masthead .masthead-subtitle {
  font-weight: 600;
  line-height: 1;
  font-size: 1.5rem;
 }

.hero-text {
  margin: 0 auto;
  min-width: 40%;
  max-width: 80%;
  background-color: #F36907;
  background-color: rgba(243, 105, 7, 0.6);
  padding: 20px 20px 20px 20px;
}

.carousel-text {
  margin: 0 auto;
  min-width: 100%;
  max-width: 100%;
  background-color: rgba(255, 255, 255, 0.6);
  padding: 20px 20px 20px 20px;
}

hr.primary {
    border-color: #F36907;
}

.slick-arrow {
    background-color: #F36907;
}

.btn-outline-light {
    color: #F36907;
    border-color: #F36907;
}


/** marine cargo **/
.marine-cargo-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-marine-cargo.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

 /** goods in transit **/
.goods-in-transit-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-goods-in-transit.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

 /** small craft **/
.small-craft-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-small-craft.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

 /** stock throughput **/
.stock-throughput-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-stock-throughput.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

 /** commercial hull **/
.commercial-hull-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-commercial-hull.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

  /** partners **/
.our-partners-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-partners.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

   /** documents **/
.documents-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-documents.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }


  /** compliance **/
.compliance-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-compliance-2.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }

   /** contact us **/
.contact-us-page .masthead {
  background: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-contact-us.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
 }


 /** footer **/

.footer {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* Carousel BG Images */

.carousel-portfolio .first-item {
  background-image: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-marine-cargo.jpg");
}
.carousel-portfolio .second-item {
  background-image:linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-goods-in-transit.jpg");
}
.carousel-portfolio .third-item {
  background-image: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-small-craft.jpg");
}
.carousel-portfolio .fourth-item {
  background-image: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-stock-throughput.jpg");
}
.carousel-portfolio .fifth-item {
  background-image: linear-gradient(rgba(255, 255, 255, 0.0), rgba(255, 255, 255, 0.0)), url("../assets/img/bg-masthead-commercial-hull.jpg");
}

/* Carousel BG Images - MODAL (Fixed Popup) */

#portfolio-modal-1 {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("../assets/img/portfolio/carousel/item-1-bg-2.jpg");
}

#portfolio-modal-2 {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("../assets/img/portfolio/carousel/item-2-bg.jpg");
}

#portfolio-modal-3 {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("../assets/img/portfolio/carousel/item-3-bg.jpg");
}

#portfolio-modal-4 {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("../assets/img/portfolio/carousel/item-4-bg-2.jpg");
}

#portfolio-modal-5 {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url("../assets/img/portfolio/carousel/item-5-bg-2.jpg");
}

/* FONTS AND HEADERS */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  margin-bottom: 0.5rem;
  font-family: "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 900;
  line-height: 1.2;
}

h1, .h1 {
  font-size: 2rem;
  font-weight: 800;
}

h2, .h2 {
  font-size: 2.25rem;
}

.page-section-heading {
    font-size: 1.8rem;
    text-transform: capitalize !important;
    font-weight: 800;
}

h3, .h3 {
  font-size: 1.96875rem;
}

.h3-text-grey {
  color: #F36907;
  font-size: 1.75rem !important;
}

h4, .h4 {
  font-size: 1.6875rem;
}

h5, .h5 {
  font-size: 1.0rem;
  font-weight: 800;
}

h6, .h6 {
  font-size: 1.125rem;
}

h5.text-uppercase {
  text-transform: none !important;

}

/* NAVIGATION */

#navbar-main {
  min-height: 66px;
  background: #fff;
}

#navbar-main .navbar-toggler {
  border: 0;
  color: #000;
}
#navbar-main .navbar-toggler:active {
  color: rgba(0, 0, 0, 0.5);
}

#navbar-main .nav-item .nav-link {
  font-size: 1rem;
  color: #000;
}

#navbar-main .nav-item .nav-link:active {
  color: rgba(0, 0, 0, 0.5);
}

#navbar-main .nav-item .nav-link.active {
  color: #ef4035;
}

#navbar-main .nav-item .dropdown-menu .dropdown-item:hover {
  background: inherit;
  color: #ef4035;
}
#navbar-main .nav-item .dropdown-menu .dropdown-item.active:hover {
  background: #ef4035;
  color: #fff;
}

@media (min-width: 992px) {
  
  #navbar-main .nav-item .nav-link.active {
    border-bottom: 0.3125rem solid #ef4035;
  }
  #navbar-main .nav-item .nav-link:hover {
    color: #ef4035;
  }
  #navbar-main.collapsed {
    padding: 0;
    background: #fff;
  }
}

/* 5 COLUMNS */
@media (min-width: 992px) {
.ColRow5Col .col-lg-4, .ColRow5Col .col-xl-3 {
    flex: 0 0 20% !important;
    max-width: 20% !important;
 }
}

 /* Small element adjustments */

 .icon-spacer {
 	padding-left: 0.5rem;
 	padding-right: 0.5rem;
 }

 /** SPECIFIC CONTENT **/

 .map-pic {
    width: 100%;
    max-width:  1024px;
    min-width: 465px;
 }