/******************************************
    uxmalsoft.css
*******************************************/

body{
  font-size: 15px;
}


.uxmal-blue{color:#0056F0;}
.uxmal-grey{color:#2D2D2D;}
.uxmal-lightblue{color:#36a9e1;}
.uxmal-bold{font-weight: 500;}
.uxmal-bolder{font-weight: 800;}

.bg-uxmal-blue{background-color:#0056F0;}
.bg-uxmal-grey{background-color:#2D2D2D;}
.bg-uxmal-lightblue{background-color:#36a9e1;}

/****************** HEADER **********************/
/*Logo*/
.mega-menu .menu-logo img {
    height: 48px;
}

/****************** SLIDER REVOLUTION **********************/
.index-revolution-logo{
  height: 90px !important;
  width: auto !important;
}

.index-revolution-product{
  margin-top: 30px !important;
  height: 50px !important;
  width: auto !important;
}

.index-by{
  color:#2D2D2D !important;
  font-size: 22px !important;
  font-family: 'Montserrat, sans-serif' !important;
  margin-left: 60px !important;
  font-weight: bold !important;
}

/****************** HEADERS **********************/
.page-title {
  padding-top: 60px !important;
  padding-bottom: 30px !important;
}


/****************** MENU **********************/

/*Hide Cross effect on mobile menu when active*/
.mega-menu .menu-mobile-collapse-trigger.active span { opacity: 1; }
.mega-menu .menu-mobile-collapse-trigger.active:before {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}
.mega-menu .menu-mobile-collapse-trigger.active:after {
    -webkit-transform: rotate(-0deg);
    -ms-transform: rotate(-0deg);
    transform: rotate(-0deg);
}

/****************** LANGUAGE **********************/
.lang-selector-title{
  text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}
.dropdown-item.active, .dropdown-item:active {
    background-color: #007bff !important;
    color: #fff !important;
}



/****************** SERVICES **********************/
@keyframes promo-dance {
  from, 49% { transform-origin: -50% 100%; }
  50%, 75%, to { transform-origin: 150% 100%; }
  25% { transform: rotate(-5deg); }
  50% { transform: rotate(0deg); }
  75% { transform: rotate(5deg); }
}

.img-service-promo{
  height: 120px;
}

.img-service-promo:hover {
	animation: promo-dance 1.5s infinite alternate ease-in-out;
}

.service-blog {
  padding-top: 0px;
}

.feature-box:hover:before, .feature-box.active:before {
  background: rgba(32, 35, 192, 0.3) none repeat scroll 0 0;
}

.feature-box:hover img, .feature-box.active img {
  filter: brightness(0) invert(1);
}






/****************** FOOTER **********************/

/*Custom Line from old page*/
footer .widget-title {border-bottom:3px solid #2D2D2D;position:relative;padding-bottom:12px;margin-bottom:25px;color:#eef1f4;}
footer .widget-title .small-line {background-color: #36A9E1;width:100px; display:block; height:3px; position:absolute; left:0; margin:12px 0px 0px 0px; }
footer .widget-title .wlast { font-weight:400; }

/*Footer image list*/
.footer .footer-gallery ul li {
    float: left;
    width: 160px;
    margin: 2px;
    list-style: none;
}

.footer-gallery .grey-image{
  transition: 0.5s ease;
  -webkit-transition: 0.5s ease;
  -moz-transition: 0.5s ease;
  -o-transition: 0.5s ease;

  /*filter: grayscale(90%);*/
}

.footer-gallery .grey-image:hover{
  /*-webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);*/

  filter: grayscale(0%);
}

/****************** INDEX **********************/
.index-service{
  padding-top: 0px;
  padding-bottom: 15px;
}
.index-service h4{
  padding-top: 0px;
  padding-bottom: 15px;
}
.index-service .index-service-bottom{
  text-align: center;
  width: 100%;
  position: absolute;
  bottom: 0;
}
/****************** ABOUT **********************/
.testimonial.bottom_pos.partner{
    padding: 60px 0px 0px 0px;
    margin-bottom: 20px;
    background: inherit !important;
}

.testimonial-info:before{
  content: "" !important;
}

.title-partners{
  margin-top: -30px;
  margin-bottom: 30px;
}

/****************** CONTACT **********************/
.button.gray.disabled{
  color: #777;
}
.button.gray.disabled:hover{
  background: #e0e0e0;
  color: #777;
  border: 2px solid #e0e0e0;
}

label.is-invalid {
  margin-top: -1rem;
  margin-bottom: 1rem;
  display: block;
  color: #ef5350;
  position: relative;
  /*padding-left: 1.625rem;*/
}

/****************** UXSMAP **********************/
.uxsmap-logo-small{
    height: 70px;
}

#features{
  background: url(../images/uxsmap/features_bg.jpg) 50% 0 no-repeat fixed;
  height: auto;
  padding: 55px 0px 45px 0px;
  background-color: #0056F0;;
}

#features .feature-info{
  color:#eee !important;
}

#features .feature-info h5, #features .feature-info p{
  color:#eee !important;
}


/****************** ERROR **********************/
.error-04 h1 {font-size: 180px !important;}
.error-403 {background: #299be8 !important;}
.error-404 {background: #041438 !important;}
.error-404 h2{color:#a4a8bb !important;}
.error-500 {background: #fff !important;}
.error-500 h1,.error-500 h2,.error-500 p{color: #222 !important;}


/*Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
    /*Logo*/
    .mega-menu .menu-logo img {
        margin-top: -2px;
    }

    /*Slider Revolution*/
    .index-revolution-logo{
      height: 60px !important;
      width: auto !important;
      margin-top: -50px !important;
    }


    /*Features*/
    .highlights-phone.wht .hgi {
      top: 22px !important;
      height: 82% !important;
    }

    .index-revolution-product{
      margin-top: 20px !important;
      height: 35px !important;
      width: auto !important;
    }
    
    .index-by{
      font-size: 18px !important;
      margin-left: 30px !important;
    }
}

/*Small devices (landscape phones, less than 768px)*/
@media (max-width: 767.98px) {
    /*Logo*/
    .mega-menu .menu-logo img {
        margin-top: -2px;
    }

}

/*Medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) {
    /*Logo*/
    .mega-menu .menu-logo img {
        margin-top: -2px;
    }
}

/*Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {

}