.lgx-logo-slider-wp {

  .lgx-logo-wrapper {
    padding: 25px 0;
    .owl-theme {
      .owl-controls {
        .owl-nav [class*=owl-]{
          background: transparent;
        }
        .owl-next,.owl-prev {
          img {
            width: 30px;
          }
        }
      }
    }

  }
  .wp-logo-border {
    .lgx-logo-img {
      border-style: solid;
      border-width: 1px;
    }
  }

  .lgx-logo-item {
    cursor: pointer;
    .logo-company-name {
      background-color: #f9f9f9;
      text-align: center;
      padding: 5px 10px;
      display: block;
    }
  }

  .nav-position-v-mid {
    position: relative;
    .owl-controls {
      .owl-next,.owl-prev {
        position: absolute;
        top: 10%;
        z-index: 2;
      }
      .owl-next {
        right: 1%;
      }
      .owl-prev {
        left: 1%;
      }
    }
  }

  .nav-position-v-mid-hover {
    position: relative;
    .owl-controls {
      .owl-next,.owl-prev {
        position: absolute;
        top: 10%;
        z-index: 2;
      }
      .owl-nav {
        visibility: hidden;
        -webkit-transition: all .2s ease-in-out 0s;
        -moz-transition: all .2s ease-in-out 0s;
        -ms-transition: all .2s ease-in-out 0s;
        -o-transition: all .2s ease-in-out 0s;
        transition: all .2s ease-in-out 0s;
      }
      .owl-next {
        right: 1%;
      }
      .owl-prev {
        left: 1%;
      }
    }

    &:hover {
      .owl-controls {
        .owl-nav{
          visibility: visible;
        }
      }
    }
  }




  .lgx-logo-item {
    .lgx-logo-img {
      -webkit-transition: all .2s ease-in-out 0s;
      -moz-transition: all .2s ease-in-out 0s;
      -ms-transition: all .2s ease-in-out 0s;
      -o-transition: all .2s ease-in-out 0s;
      transition: all .2s ease-in-out 0s;
    }
  }

  // Hover style
  .hover-default {
    .lgx-logo-item {
      .lgx-logo-img {
        .opacity(1);
        filter: none;
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
        filter: grayscale(0);
      }
      &:hover {
        .lgx-logo-img {
          .opacity(1);
          filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
          filter: grayscale(100%);
          -webkit-filter: grayscale(100%);
          -moz-filter: grayscale(100%);
          -o-filter: grayscale(100%);
          -ms-filter: grayscale(100%);
          filter: grayscale(100%);
        }
      }

    }
  }
  .hover-grayscale {
    .lgx-logo-item {
      .lgx-logo-img {
        .opacity(1);
        filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
        filter: grayscale(100%);
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        filter: grayscale(100%);
      }
      &:hover {
        .lgx-logo-img {
          .opacity(1);
          filter: none;
          -webkit-filter: grayscale(0);
          -moz-filter: grayscale(0);
          -o-filter: grayscale(0);
          -ms-filter: grayscale(0);
          filter: grayscale(0);
        }
      }

    }
  }

  .hover-zoomin {
    .lgx-logo-item {
      .lgx-logo-img {
        -webkit-transform: scale(.5);
        -moz-transform: scale(.5);
        -o-transform: scale(.5);
        -ms-transform: scale(.5);
        transform: scale(.5);
      }
      &:hover {
        .lgx-logo-img {
          -webkit-transform: scale(1);
          -moz-transform: scale(1);
          -o-transform: scale(1);
          -ms-transform: scale(1);
          transform: scale(1);
        }
      }
    }
  }

  .hover-hblur {
    .lgx-logo-item {
      &:hover {
        .lgx-logo-img{
          -webkit-filter: blur(2px);
          -moz-filter: blur(2px);
          -o-filter: blur(2px);
          -ms-filter: blur(2px);
          filter: blur(2px);
        }
      }
    }
  }
}