.home-carousel-banner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center; }

.carousel-home-banner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  width: 100%; }
  .carousel-home-banner p {
    z-index: 1;
    position: absolute;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    font-weight: 200;
    font-size: 1.3rem;
    color: white;
    left: 15%;
    font-family: "avenir"; }

.carousel-banner-images {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: end;
      align-items: flex-end;
  margin-bottom: 20px; }
  @media (max-width: 992px) {
    .carousel-banner-images .slick-next, .carousel-banner-images .slick-prev {
      display: none !important; } }
  .carousel-banner-images :hover {
    cursor: pointer; }
  .carousel-banner-images .banner-home {
    width: 100vw !important;
    height: auto;
    object-fit: cover;
    object-position: center; }
  .carousel-banner-images .slick-prev {
    position: absolute;
    left: 0;
    z-index: 1;
    border: none;
    background-color: transparent;
    outline: none !important;
    background-image: url("../images/prev-arrow.png");
    background-repeat: no-repeat;
    padding: 15px;
    margin-left: 5rem;
    bottom: 45%; }
  .carousel-banner-images .slick-next {
    position: absolute;
    right: 0;
    border: none;
    background-color: transparent;
    outline: none !important;
    background-image: url("../images/next-arrow.png");
    background-repeat: no-repeat;
    padding: 15px;
    margin-right: 5rem;
    bottom: 45%; }
  .carousel-banner-images .slick-dots {
    position: absolute;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    bottom: 14px; }
    .carousel-banner-images .slick-dots li {
      margin: 0 0.25rem; }
    .carousel-banner-images .slick-dots button {
      background-color: transparent;
      border: solid 1px white;
      width: 15px;
      height: 15px;
      border-radius: 50%;
      color: transparent;
      font-size: 0px; }
  .carousel-banner-images li.slick-active button {
    background-color: white;
    outline: none; }

.container-homeMainBanner {
  position: relative; }

.clockdiv {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  position: absolute;
  right: 55px;
  top: 27%; }
  @media (max-width: 992px) {
    .clockdiv {
      right: 16px;
      top: 19%; } }
  .clockdiv .container-countdown-banner {
    text-align: center; }
    .clockdiv .container-countdown-banner .countdown-title-banner {
      font-size: 1.5rem;
      margin-bottom: 1rem; }
    .clockdiv .container-countdown-banner .container-countdown {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
          justify-content: center;
      -ms-flex-align: center;
          align-items: center; }
      .clockdiv .container-countdown-banner .container-countdown .countdown-one {
        background-color: #fff;
        border-radius: 5px; }
        .clockdiv .container-countdown-banner .container-countdown .countdown-one .smalltext {
          font-size: 1.25rem;
          font-weight: 600; }
      @media (max-width: 992px) {
        .clockdiv .container-countdown-banner .container-countdown .time-countdown {
          width: 52px !important;
          height: 30px !important; }
          .clockdiv .container-countdown-banner .container-countdown .time-countdown span {
            font-size: 1.875rem; }
        .clockdiv .container-countdown-banner .container-countdown .smalltext {
          font-size: .625rem !important; } }
      .clockdiv .container-countdown-banner .container-countdown .time-countdown {
        position: relative;
        width: 112px;
        height: 80px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
            justify-content: center;
        -ms-flex-align: center;
            align-items: center;
        font-size: 3.75rem;
        font-weight: bold;
        overflow: hidden;
        border-radius: 5px;
        background: #dadada;
        perspective: 1000px; }
        .clockdiv .container-countdown-banner .container-countdown .time-countdown span {
          display: block;
          transform-style: preserve-3d;
          transition: transform 1s; }
        .clockdiv .container-countdown-banner .container-countdown .time-countdown .flip {
          position: absolute;
          width: 100%;
          height: 100%;
          -webkit-backface-visibility: visible;
                  backface-visibility: visible;
          transform-origin: bottom; }
        .clockdiv .container-countdown-banner .container-countdown .time-countdown .front {
          width: 100%;
          background: #dadada;
          height: 50%;
          border-bottom: solid 0.5px #c3c3c3;
          border-radius: 0px !important;
          top: 0;
          overflow: hidden;
          display: -ms-flexbox;
          display: flex;
          -ms-flex-align: start;
              align-items: flex-start;
          -ms-flex-pack: center;
              justify-content: center;
          border-radius: 5px;
          z-index: 1;
          transform: rotateX(0deg); }
          @media (max-width: 992px) {
            .clockdiv .container-countdown-banner .container-countdown .time-countdown .front {
              line-height: 1; } }
        .clockdiv .container-countdown-banner .container-countdown .time-countdown .back {
          text-align: center;
          display: -ms-flexbox;
          display: flex;
          -ms-flex-align: center;
              align-items: center;
          -ms-flex-pack: center;
              justify-content: center;
          width: 100%;
          padding-top: 10px;
          background-image: linear-gradient(to bottom, #dadada 50%, white 50%);
          border-radius: 5px; }
          @media (max-width: 992px) {
            .clockdiv .container-countdown-banner .container-countdown .time-countdown .back {
              padding: 1px; } }
      .clockdiv .container-countdown-banner .container-countdown .time-separate {
        font-weight: 700;
        font-size: 5rem;
        margin-bottom: 40px; }
        @media (max-width: 992px) {
          .clockdiv .container-countdown-banner .container-countdown .time-separate {
            font-size: 2rem;
            margin-bottom: 0px; } }

@keyframes flip {
  0% {
    transform: rotateX(0deg); }
  100% {
    transform: rotateX(180deg);
    height: 100%; } }

/*# sourceMappingURL=homePrincipalBanner.css.map*/