/* ===================================
    About
====================================== */

/*
    Theme Name: Wexim
    Theme URI:
    Author: Themes Industry
    Author URI:
    Description: One Page Parallax Template
    Tags: one page, multipurpose, parallax, creative, html5

 */

/* ===================================
    Variables
====================================== */

// Colors
@colorPrimary: #f56432;
@colorSecondary: #43026d;
@colorThird: #00bcd4;

// Mixins
.animation(@animation) {
  -webkit-animation: @animation;
          animation: @animation;
}
.transform(@transform) {
  -webkit-transform: @transform;
      -ms-transform: @transform; // IE9 only
          transform: @transform;
}


/* ===================================
    Styling
====================================== */

::-webkit-scrollbar {background-color: @colorPrimary;}
::-webkit-scrollbar-thumb {background: @colorPrimary;}
a:hover, a:active {color: @colorPrimary}


.gradient-bg1,.team-progress .progress-bar,.team-box .overlay:before,
.cube-portfolio1 .cbp-l-grid-mosaic-flat .cbp-caption-activeWrap,.overlay-two:before,.price-two.hvr-gradient:hover,.loader{
  background: @colorPrimary;
  background: -moz-linear-gradient(left, @colorPrimary 2%, @colorSecondary 82%);
  background: -webkit-linear-gradient(left, @colorPrimary 2%,@colorSecondary 82%);
  background: linear-gradient(to right, @colorPrimary 2%,@colorSecondary 82%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@colorPrimary', endColorstr='@colorSecondary',GradientType=1 );
}

.header-appear .navbar-top-default.navbar-gradient{
  background: @colorPrimary;
  background: -moz-linear-gradient(left, @colorSecondary 2%, @colorPrimary 82%);
  background: -webkit-linear-gradient(left, @colorSecondary 2%, @colorPrimary 82%);
  background: linear-gradient(to right, @colorSecondary 2%, @colorPrimary 82%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@colorPrimary', endColorstr='@colorPrimary',GradientType=1 );
}

/* text-color */
.main-color,.cube-portfolio1 .cbp-l-filters-button .cbp-filter-item:hover{color: @colorPrimary;}
.alt-color{color: @colorSecondary;}
.third-color,.header-appear .nav-box-round .navbar-nav .nav-link:hover,.navbar.navbar-right .navbar-nav .nav-link.active,
.button-play:hover i,.parallax-box:hover i{color: @colorThird;}

.gradient-text1,.cube-portfolio1 .cbp-l-filters-button .cbp-filter-item.cbp-filter-item-active,.blog-item-content h4 a:hover{
  background: @colorPrimary;
  background: -moz-linear-gradient(left, @colorPrimary 2%, @colorSecondary 82%);
  background: -webkit-linear-gradient(left, @colorPrimary 2%,@colorSecondary 82%);
  background: linear-gradient(to right, @colorPrimary 2%,@colorSecondary 82%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@colorPrimary', endColorstr='@colorSecondary',GradientType=1 );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.btn.btn-blue,.side-right-social a,.price-item .btn.btn-black:hover,.price-item .btn.btn-black:focus {background: @colorThird; border-color: @colorThird;}
.btn.btn-blue:hover, .btn.btn-blue:focus {background: transparent !important; border-color: @colorThird; color: @colorThird !important}
.btn.btn-gradient,.team-box-two .team-two-block::before,.scroll-top-arrow,.widget .search-btn{background-image: linear-gradient(to right, @colorPrimary 0%, @colorSecondary 51%, @colorPrimary 100%);}


.header-appear .nav-box-round .navbar-nav .nav-link.active,.owl-dots .owl-dot::after,.footer-social li a:hover {
  background-color: @colorThird;
}

.nav-line .navbar-nav .nav-link:before,.button-play,.price-two.hvr-blue:hover,.side-menu,.error-text h2,.blog-pagination li a:hover,.blog-pagination li.active a,.blog-pagination li a:focus,
.wexim .tp-bullet.selected .tp-bullet-inner{
  background: @colorThird;
}

.count-down-form .form-control:focus{
  border-bottom: 2px solid @colorThird !important;
}

.blog-tags li a:hover,.blog-tags li a:focus{
  border:1px solid @colorThird;
  background-color: @colorThird;
}

.price-item .btn.btn-black:hover, .price-item .btn.btn-black:focus {
  background: @colorThird !important;
  border-color: @colorThird;
}

.price-two .btn.btn-blue:hover,.price-two .btn.btn-blue:focus {
  background: transparent !important;
  border-color: #ffffff !important;
  color: #ffffff !important;
}