@font-face {
  font-family: SohoGothicPro-Regular;
  src: url(/fonts/SohoGothicPro-Regular.otf);
}

@font-face {
  font-family: SohoGothicPro-light;
  src: url(/fonts/SohoGothicPro-Light.otf);
}

@font-face {
  font-family: SohoGothicPro-LightItalic;
  src: url(/fonts/SohoGothicPro-LightItalic.otf);
}

@font-face {
  font-family: SohoGothicPro-Bold;
  src: url(/fonts/SohoGothicPro-Bold.otf);
}
/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */
/* */
body {
  padding-top: 3rem;
  padding-bottom: 3rem;
  color: #5a5a5a;
}


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

/* Carousel base class */

/* Since positioning the image, we need to help out the caption */

/* Declare heights because of positioning of img element */

.carousel-item > img {
  position: absolute; 
  top: 5rem;
 
  min-width: 100%!important;

}

.carousel-item {
  min-height: 950px;
}

.carousel-item img {
    position: absolute;
    object-fit:cover;
    top: 0;
   
    max-height: 950px;
}





/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */



 /* @Media index */

 @media (max-width: 575px) { 
  .carousel-item h1  {
   
   font-family: SohoGothicPro-Bold; 
     letter-spacing: 5px; 
    font-size: 2em!important;

    color: red !important;
    }

    .carousel-item {
      min-height: 550px;
    }

    .carousel-item img{
      min-height: 550px;
    }
  }

  
@media (min-width: 576px) 
{ 
  .carousel-item h1 {
    margin-top: 320px!important;
    font-family: SohoGothicPro-Bold;;
    letter-spacing: 5px;
    font-size: 1em!important;
    
  }

  .carousel-item {
    min-height: 650px;
  }

  .carousel-item img{
    min-height: 650px;
  }

}


@media (min-width: 768px) 
{
  .carousel-item h1 {
    margin-bottom: 250px!important;
    font-family: SohoGothicPro-Bold;;
    letter-spacing: 5px;
    font-size: 4em!important;
  }
  .carousel-item {
    min-height: 700px;
  }

  .carousel-item img{
    min-height: 700px;
  }
}


 
@media (min-width: 992px) 
{ 
  .carousel-item h1 {
    margin-bottom: 250px!important;
    font-family: SohoGothicPro-Bold;;
    letter-spacing: 5px;
    font-size: 4em!important;
  }

  .carousel-item {
    min-height: 750px;
  }

  .carousel-item img{
    min-height: 750px;
  }

  
}

 @media (min-width: 1200px) 
 {  
  .carousel-caption h1 {
    margin-bottom: 350px!important;
    font-family: SohoGothicPro-Bold;;
    letter-spacing: 5px;
    font-size: 4em!important;;
  }

  
  .carousel-item {
    min-height: 850px;
  }

  .carousel-item img{
    min-height: 850px;
  }
   
 }