@keyframes slideInLeft {
    0% {
      transform: translateX(-100%);
    }
    100% {
      transform: translateX(0);
    }
}
@keyframes slideInRight {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(0);
    }
}
@keyframes slideInBottom {
    0% {
      transform: translateY(200%);
    }
    100% {
      transform: translateY(0);
    }
}


.disclaimer {
    display: none !important;
}

/* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;
}
/* Previous button  */
.media-carousel .carousel-control.left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Next button  */
.media-carousel .carousel-control.right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */

.dm-service-banner{
         /*background: #ebf9f9;*/
         background-attachment: fixed;
         background-position: center;
         background-repeat: no-repeat;
         background-size: cover;
         /*padding: 97px 0;*/
         position: relative;
         }
         .dm-banner-title{
         text-align: right;
         padding: 57px 0px;
         }
         /*.dm-banner-title .back-box{
         position: absolute;
         left: 0px;
         top: 0px;
         height: 90%;
         width: 65%;
         background: #fff; 
         box-shadow: 0px 0px 5px 0px #ddd;
         background: url(https://www.hummingwebians.com/public/images/dm-small.jpg);
         background-repeat: no-repeat;
         background-size: cover;
         }*/
         .dm-right-corner{
         width: 25px;
         height: 180px;
         background: #ffc107;
         position: absolute;
         top: 0px;
         right: 0px;
         }
         .dm-banner-title .front-text-box{
         position: relative;
         z-index: 1;
         }
         .dm-banner-title h1 {
         font-size: 57px;
         font-weight: 900;
         letter-spacing: 4px;
         border-bottom: 8px solid #ffc107;
         padding-bottom: 14px;
         text-shadow: 3px 3px 1px #eeeeee26;
         color: #fff;
         }
         .dm-banner-text{
         padding: 90px 0px;
         font-size: 15px;
         font-weight: 300;
         color: #f1f1f1;
         }


.jumbotron{margin-bottom: 0 !important; position: relative;}

.parallax {
  /* Set a specific height */
  height: 650px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.parallax2 {
  /* Set a specific height */
  height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.parallax-testimonial {
  /* Set a specific height */
  height: 700px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



#parallax-bg {
    background-image: url("../../img/bg.jpg");
    padding-top: 100px;
    padding-bottom: 100px;
}
#parallax-bg2 {
    background-image: url("../../img/bgpara.jpg");
    padding-top: 100px;
    padding-bottom: 100px;
}
#parallax-bg-testimonial {
    background-image: url("../../img/testimonial.jpg");
    padding-top: 100px;
    padding-bottom: 100px;
}
#parallax-static {
    background-image: url("../../assets/images/parallex.jpg");
    padding-top: 100px;
    padding-bottom: 100px;
}






.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #20202026 !important;
    background-clip: border-box;
    border: 1pxsolidrgba(0,0,0,.125);
    border-radius: 10px;
}



.navbar {
    position: absolute !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    /*padding-top: 20px;*/
    /*padding-bottom: 20px;*/
    z-index: 9 !important;
}
/*.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link {
    color: #fff !important;
    font-weight: 600 !important;
}*/
.navbar-light .navbar-nav .nav-link {
    color: #fff !important;
}
/*.service-box {
  background-color: #fff;
	border-radius: 18px; 
	box-shadow: 0px 3px 14px #7a7a7a47; 
	padding: 0px;
	margin-top: 40px;
    height: 180px;
}*/
.service-box {
    background-color: #2e2e2e45;
    border-radius: 10px;
    /* box-shadow: 0px 3px 14px #7a7a7a47; */
    padding: 30px;
    margin-top: 40px;
    /* height: 180px; */
    /*animation: 2s ease-out 0s 1 slideInRight;*/
}
a {
    color: unset !important;
    text-decoration: unset !important;
}
.mb-25 {
	margin-bottom: 25px;
}
.form-control {
	line-height: 2 !important
}

.desktop-view {
    display: block;
}
.mobile-view {
    display: none;
}
.bg-heading-position {
    /*position: absolute; top: 35%; left: 5%;*/
    margin-top: 130px;
    text-align: center;
}
.bg-heading-position-parallex {
    /*position: absolute; top: 35%; left: 5%;*/
    /*margin-top: 100px;*/
    text-align: center;
}
.bg-heading-position-testimonial {
    /*position: absolute; top: 35%; left: 5%;*/
    /*margin-top: 100px;*/
    text-align: center;
}

.jumbotron {
    margin-bottom: 0!important;
}

.banner-main-head {
    font-weight: 300; font-size: 55px; /*line-height: 1;*/ color: #fff !important;
    animation: 3s ease-out 0s 1 slideInLeft;
}
.bg-main-head {
    font-weight: 300; font-size: 40px; /*line-height: 1;*/ color: #fff !important;
    animation: 3s ease-out 0s 1 slideInLeft;
}
.bg-main-head-sapn {
    font-weight: 900;
}
.bg-sub-text {
    color: #fff;
    /*width: 50%;*/
    animation: 4s ease-out 0s 1 slideInLeft;
    margin-left: auto;
    margin-right: auto;
    /*padding-top: 20px;*/
    font-weight: 400;
    font-size: 35px;
}
.logo-sec {
    width: 20%;
}
.cv-logo {
    width: 30%;
}
.aboutus-heading {
    font-size: 50px; font-weight: 600; line-height: 1.5; color: #f2c900;
    display: inline-block;
      padding-bottom: 5px;
      position: relative;
}
/*.aboutus-heading:before{
    content: "";
    position: absolute;
    width: 50%;
    height: 1px;
    bottom: 0;
    left: 0%;
    border-bottom: 6px solid #212529;
}*/
.cv-abt-sec {
    padding-top: 100px; padding-bottom: 100px;
}
.abt-head {
    color: #212529;
    /* text-decoration: underline; */
    /* text-decoration: none; */
    /* position: relative; */
    margin: auto;
    padding-bottom: 0px;
    border-bottom-style: solid;
    border-bottom-width: 3.1px;
    border-bottom-color: #f2c900;
    width: fit-content;
}

.abt-text {
    width: 80%; margin: auto;
}
.banner-btn {
    background-color: #000;
      padding: 16px 30px;
      color: #fff !important;
      font-weight: 300;
      border: none;
      animation: 4s ease-out 0s 1 slideInBottom;

}
.banner-btn:hover {
    background-color: transparent;
  border: 1px solid #fff;
  padding: 16px 30px;
  color: #fff !important;
  font-weight: 300;
  box-shadow: 3px 10px 22px -15px #888888;
}

.abt-btn {
  background-color: #000;
  padding: 16px 30px;
  color: #fff !important;
  font-weight: 300;
}
.abt-btn:hover {
  background-color: transparent;
  border: 1px solid #212529;
  padding: 16px 30px;
  color: #212529 !important;
  font-weight: 300;
  box-shadow: 3px 10px 22px -15px #888888;
}
.cv-service-sec {
    /*margin-top: 100px; */
    /*margin-bottom: 100px;*/
    /*background-color: #f7f7f7; */
    padding-top: 100px;
    padding-bottom: 100px;
}
.cv-service-sec-inner {
    padding-top: 100px;
    padding-bottom: 100px;
}
.our-service-heading {
    /*font-size: 40px;*/ font-weight: 600; line-height: 1.5; color: #f2c900; text-decoration: underline; text-underline-offset: 0.8rem;
}
.our-service-heading-inner {
    font-size: 40px; font-weight: 600; line-height: 1.5; color: #f2c900; text-align: center;
}
.servicehead-mb {
    margin-bottom: 0;
}
.service-no {
  font-size: 30px; color: #565656;
}
.service-head {
  font-size: 15px; color: #a7a7a7;
}
.service-text {
  font-size: 12px; color: #a3a3a3;
}
.service-btn {
  background-color: #212529;
  padding: 16px 30px;
  color: #fff !important;
  font-weight: 300;
}
.service-btn:hover {
  background-color: transparent;
  border: 1px solid #212529;
  padding: 16px 30px;
  color: #ffffff9c !important;
  font-weight: 300;
  box-shadow: 3px 10px 22px -15px #888888;
}
.cv-develop-bar-sec {
    background-color: #f2c900; padding: 70px;
}
.cv-contact-sec-heading {
    font-size: 50px; font-weight: 600; margin-bottom: 20px;
}
.cv-bar-heading {
    color: #fff; font-size: 45px;
}
.cv-contact-sub-text {
    width: 70%; margin: auto;
}
.contact-form-width {
    width: 50%; margin: auto
}
.contact-submit-btn {
  background-color: #fff;
  padding: 10px 45px;
  color: #565656 !important;
  font-weight: 400;
  border: none;
}
.contact-submit-btn:hover {
  background-color: transparent;
  border: 1px solid #fff;
  padding: 10px 45px;
  color: #fff !important;
  font-weight: 400;
  box-shadow: 3px 10px 22px -15px #888888;
}
.enquire-submit-btn {
  background-color: #565656;
  padding: 10px 45px;
  color: #fff !important;
  font-weight: 400;
  border: none;
}
.enquire-submit-btn:hover {
  background-color: transparent;
  border: 1px solid #565656;
  padding: 10px 45px;
  color: #565656 !important;
  font-weight: 300;
  box-shadow: 3px 10px 22px -15px #888888;
}


.services-text {
    font-size: 15px; font-weight: 300; color: #f1f1f1; margin: auto;
}


.footer-sec {
    padding-top: 10px; /*padding-bottom: 10px;*/ /*border-top: 1px solid #eee;*/ /*box-shadow: 13px 20px 25px 5px #888888;*/
    background-color: #0e0e0e;
}
.copyright-text {
    text-align: center; margin: 0;
    color: #a3a3a3;
    font-size: 15px;
    font-weight: 300;
}
.footer-logo {
    width: 20%;
}


.abt-ani {
    animation: 1s ease-out 0s 1 slideInLeft;
}
.abt-text-ani {
    animation: 1s ease-out 0s 1 slideInRight;
}

.right-ani {
    animation: 2s ease-out 0s 1 slideInRight;
}
.left-ani {
    animation: 2s ease-out 0s 1 slideInLeft;
}



.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 100px;
}

.sidenav a {
  padding: 8px 8px 8px 8px;
  text-decoration: none;
  font-size: 25px;
  color: #fff !important;
  display: block;
  transition: 0.3s;
  text-align: center;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

#main {
  transition: margin-left .5s;
    padding: 22px 0px;
    margin-left: auto;
}

.side-btn {
    font-size: 16px;
    cursor: pointer;
    position: fixed;
    top: 50%;
    right: -55px;
    padding: 8px 25px;
    background-color: #000;
    color: #fff;
    z-index: 9999;
    transform: rotate(-90deg);
}
.service-explore-btn-div {
  margin-top: 60px; text-align: center;
}
.dev-bus-online {
  margin: auto; padding-top: 0px;
}

.foot-pad {
  padding-top: 100px; padding-bottom: 100px;
}

.quick-link-align {
    text-align: center;
    margin-top: 50px;
  }
.reach-link-align {
  text-align: center;
  margin-top: 50px;
}
.contact-form-align {
    margin: auto; padding-right: 80px;
  }
.contact-des {
    padding-top: 0px;
  }

.nav-bg {
    background-color: #0000006b;
    width: 100%;
}
.contactus-logo {
    width: 33%;
}

.carlogo {
    width: 16%;
}
@media only screen and (max-width: 768px) {
    .carlogo {
        width: 42%;
    }
    .parallax2 {
        height: 740px;
    }
}

@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {
      padding-right: 1.5rem !important;
      padding-left: 1.5rem !important;
  }
}
@media only screen and (max-width: 992px) {
  .desktop-view {
    display: block;
  }
  .mobile-view {
      display: none;
  }
  .bg-heading-position {
    position: absolute;
    top: 10%;
    left: 5%;
  }
}
@media only screen and (max-width: 768px) {
    .desktop-view {
        display: none;
    }
    .mobile-view {
        display: block;
    }
    .services-text {
        font-size: 15px; font-weight: 300; color: #f1f1f1; width: 100%; margin: auto; text-align: left;
    }
    .nav-bg {
        background-color: transparent;
        width: 100%;
    }
    .contactus-logo {
        width: 60%;
    }
    .dm-banner-title h1 {
        font-size: 40px;
        font-weight: 900;
        letter-spacing: 4px;
        border-bottom: 8px solid #ffc107;
        padding-bottom: 14px;
        text-shadow: 3px 3px 1px #eeeeee26;
        color: #fff;
    }
    .dm-banner-text {
        padding: 0;
        font-size: 15px;
        font-weight: 300;
        color: #a3a3a3;
    }
    .dm-banner-title {
        text-align: right;
        padding: 45px 0px;
    }
    .bg-heading-position {
        position: absolute;
        top: 10%;
        left: 5%;
        right: 5%;
    }
    .banner-main-head {
        font-weight: 300;
        font-size: 40px;
        line-height: 1.4;
        color: #fff;
    }
    .bg-main-head {
        font-weight: 300;
        font-size: 23px;
        line-height: 1.4;
        color: #fff;
    }
    .bg-sub-text {
        color: #fff;
        font-size: 23px;
        width: 100%;
    }
    .logo-sec {
        width: 50%;
    }
    .cv-logo {
        /*width: 77%;
        margin-top: 10px;*/
        width: 45%;
        margin-top: 10px;
        background-color: #ffff;
        padding: 13px;
        border-radius: 10px;
    }
    .aboutus-heading {
        font-size: 35px;
        font-weight: 600;
        line-height: 1.5;
    }
    .cv-abt-sec {
        padding-top: 50px; padding-bottom: 50px;
    }
    .abt-text {
        width: 100%; margin: auto;
    }
    .cv-service-sec {
        margin-top: 0; margin-bottom: 0;
        padding-top: 50px; padding-bottom: 50px;
    }
    .our-service-heading {
        font-size: 35px; font-weight: 600; line-height: 1.5; text-align: left; margin-bottom: 0;
    }
    .servicehead-mb {
        margin-bottom: 0px;
    }
    .service-explore-btn-div {
      margin-top: 50px; text-align: center;
    }
    .cv-develop-bar-sec {
        background-color: #f2c900;
        padding: 75px 0;
        /*margin-top: 100px;
        margin-bottom: 100px;*/
    }
    .dev-bus-online {
      margin: auto; padding-top: 50px;
    }
    .cv-contact-sec-heading {
        font-size: 35px; font-weight: 600; margin-bottom: 20px;
    }
    .cv-bar-heading {
        color: #fff; font-size: 27px;
    }
    .cv-contact-sub-text {
        width: 100%; margin: auto;
    }
    .contact-form-width {
        width: 100%; margin: auto
    }
    .copyright-text {
        text-align: right; margin: 0; font-size: 13px; text-align: center;
    }
    .footer-logo-center {
        text-align: center;
        margin: 20px 0;
    }
    .footer-logo {
        width: 60%;
    }
    #enquire-main {
      display: none;
    }
    .sidenav {
      height: 100%;
      width: 0;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: #e7b62a;
      overflow-x: hidden;
      transition: 0.5s;
      padding-top: 200px;
  }
  .foot-pad {
    padding-top: 50px; padding-bottom: 50px;
  }
  .quick-link-align {
    text-align: left;
    margin-top: 10px;
  }
  .reach-link-align {
    text-align: left;
    margin-top: 10px;
  }
  .contact-form-align {
    margin: auto; padding-right: 0px;
  }
  .contact-des {
    padding-top: 60px;
  }


}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

@media only screen and (max-width: 280px) {
  .bg-main-head {
      font-weight: 300;
      font-size: 30px;
      line-height: 1.4;
      color: #565656;
  }
}