/*#banner-slider .mobile{display:none}*/
#banner-slider .desktop {position: relative;}
#banner-slider .desktop .title {position: absolute; color: #fff; font-size: 30px; font-weight: bold; left: 20px; top: 20px; animation-duration: 3s; -webkit-animation-duration: 3s; -moz-animation-duration: 3s; -ms-animation-duration: 3s; transition: 0.3s; -wbe -ms-transition: 0.3s; -moz-transition: 0.3s; -webkit-animation-name: fadeInUp;  animation-name: fadeInUp;}
#banner-slider .desktop .description {position: absolute; bottom: 20px; right: 20px; color: #fff; text-transform: capitalize; font-size: 18px; font-weight: 500;}
#banner-slider .owl-nav button span {color: #fff; font-size: 40px;}
#banner-slider .owl-nav button {position: absolute; top: 50%; transform: translateY(-50%); left:20px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); box-shadow:none; border-radius:0;}
#banner-slider .owl-nav button.owl-next {left: inherit; right: 20px;}
#banner-slider .owl-dots {position: absolute; bottom: 20px; text-align: center; left: 0; right: 0;}
#banner-slider .owl-dots button {margin: 0 2px; width: 10px;  height: 10px;  border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%;  background-color: #000;  box-shadow: none;  display: inline-block;}


@media(max-width:767px){
/*#banner-slider .mobile{display:block}
#banner-slider .mobile .title {position: absolute; color: #fff; font-size:20px; font-weight: bold; left: 20px; top: 20px;}
#banner-slider .mobile .description {position: absolute; bottom: 20px; right: 20px; color: #fff; text-transform: capitalize; font-size: 16px; font-weight: 500;}
#banner-slider .desktop{ display:none}*/
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}