/*

Theme Name:  Salient

Description: Styles for the "Clients" page builder element.

*/



.clients.two-cols >div{

  width:49.4%

}

.clients.two-cols.no-carousel >div{

  width:48.4%

}

.clients.two-cols >div:nth-child(2n+2){

  margin-right:0

}

.clients.carousel.two-cols >div{

  margin:0 10px

}

.clients.three-cols >div{

  width:32.6%

}

.clients.three-cols.no-carousel >div{

  width:31.6%

}

.clients.three-cols >div:nth-child(3n+3){

  margin-right:0

}

.clients.carousel.three-cols >div{

  margin:0 10px

}

@media only screen and (min-width: 1000px) {

  .clients.no-carousel.three-cols > div:nth-child(3n+4) {

    clear: both;

  }

}

@media only screen and (min-width: 690px) {

  .clients.no-carousel.four-cols > div:nth-child(4n+5) {

    clear: both;

  }

  .clients.no-carousel.five-cols > div:nth-child(5n+6) {

    clear: both;

  }

  .clients.no-carousel.six-cols > div:nth-child(6n+7) {

    clear: both;

  }

}

.clients.four-cols >div{

  width:24.2%

}

.clients.four-cols.no-carousel >div{

  width:23.2%

}

.clients.four-cols >div:nth-child(4n+4){

  margin-right:0

}

.clients.carousel.four-cols >div{

  margin:0 10px

}

.clients.five-cols >div{

  width:19.2%

}

.clients.five-cols.no-carousel >div{

  width:18.2%

}

.clients.five-cols >div:nth-child(5n+5){

  margin-right:0

}

.clients.carousel.five-cols >div{

  margin:0 10px

}

.clients.six-cols >div{

  width:15.8%

}

.clients.six-cols.no-carousel >div{

  width:14.8%

}

.clients.six-cols >div:nth-child(6n+6){

  margin-right:0

}

.clients.carousel.six-cols >div{

  margin:0 10px

}

.clients >div{

  float:left;

  transition:opacity 0.2s linear;

  -webkit-transition:opacity 0.2s linear;

  margin-right:2%;

  margin-bottom:2%;

  opacity:1

}

.clients.fade-in-animation >div{

  opacity:0;

  -webkit-transition:none;

	transition:none;

}

.clients.fade-in-animation.completed >div{

  -webkit-transition:opacity 0.2s linear;

	transition:opacity 0.2s linear;

  -webkit-backface-visibility:hidden

}

.clients:not(.fade-in-animation) >.no-link:hover,

.clients.fade-in-animation.completed >.no-link:hover{

  opacity:1!important

}

.clients:not(.fade-in-animation) >div:hover,

.clients.fade-in-animation.completed >div:hover{

  opacity:0.7!important

}

.clients >div img{

  display:block;

  max-width:100%;

  margin:0 auto

}

.row.carousel.clients {

    display: flex;

    align-items: center;

}



.clients.no-carousel:after{

  content:"";

  display:block;

  height:0;

  clear:both;

  visibility:hidden

}

.clients.no-carousel {

  display: -ms-flexbox;

  display: flex;

  display: -webkit-flex;

  align-items: center;

  justify-content: center;

  -ms-flex-flow: row wrap;

  flex-wrap: wrap;

}

.clients.no-carousel > div {

  float: none;

}

.clients[data-additional_padding="2"].no-carousel > div,

.clients[data-additional_padding="3"].no-carousel > div,

.clients[data-additional_padding="4"].no-carousel > div,

.clients[data-additional_padding="2"].no-carousel > div img,

.clients[data-additional_padding="3"].no-carousel > div img,

.clients[data-additional_padding="4"].no-carousel > div img {

  margin: 0;

}

.clients[data-additional_padding="2"].no-carousel >div {

  padding: 2%;

}

.clients[data-additional_padding="3"].no-carousel >div {

  padding: 3%;

}

.clients[data-additional_padding="4"].no-carousel >div {

  padding: 3% 5%;

}

.clients[data-he="greyscale_to_color"] > div img{

  transition: filter 0.45s cubic-bezier(0.3, 0.4, 0.1, 1), opacity 0.45s cubic-bezier(0.3, 0.4, 0.1, 1);

  -webkit-filter: grayscale(100%);

  filter: grayscale(100%);

  opacity: 0.55;

}

.clients[data-he="greyscale_to_color"] > div:hover img{

  -webkit-filter: grayscale(0%);

  filter: grayscale(0%);

  opacity: 1;

}

.clients img.nectar-lazy {

	opacity: 0;

	transition: opacity 0.5s ease;

}



.clients img.nectar-lazy.loaded {

	opacity: 1;

}



@media only screen and (min-width : 690px) and (max-width : 999px) {

  body .clients.no-carousel > div,

  body .clients.four-cols.no-carousel >div {

    width: 24.2%;

    margin-right: 1%;

  }



  body .clients.no-carousel.six-cols > div {

    width: 15.8% ;

    margin-right: 1%;

  }



  body .clients.no-carousel.five-cols  > div {

    width: 19.2%;

    margin-right: 1%;

  }



  body .clients.no-carousel > div:nth-child(4n+4) {

    margin-right: 0;

  }



  body .clients.carousel > div {

    margin: 0 5px;

  }

}



@media only screen and (max-width : 690px) {



  body .clients[class*="col"].no-carousel > div {

    margin-right: 1%;

    width: 49.4%;

  }



  body .clients[class*="col"].no-carousel > div:nth-child(2n+2) {

    margin-right: 0;

  }



  body .clients[class*="col"].carousel > div {

    margin: 0 5px;

    width: 150px;

  }



  body .clients.carousel.phone > div {

    width: 150px;

  }



  .clients[data-additional_padding="2"].no-carousel  >div {

    padding: 2% 4% 2% 4%;

  }



  .clients[data-additional_padding="3"].no-carousel  >div {

    padding: 3% 6% 3% 6%;

  }



  .clients[data-additional_padding="4"].no-carousel  >div {

    padding: 5% 10% 5% 10%;

  }



}





@media only screen and (min-width: 1300px) and (max-width: 1600px) {

  .full-width-content .vc_span8 .clients.five-cols.carousel > div,

  .full-width-content .vc_col-sm-8 .clients.five-cols.carousel > div {

    width: 33%;

  }

}



@media only screen and (min-width: 990px) and (max-width: 1300px) {

  .full-width-content .vc_span8 .clients.six-cols > div,

  .full-width-content .vc_col-sm-8 .clients.six-cols > div {

    width: 32.3%;

  }



  .full-width-content .vc_span8 .clients.no-carousel.six-cols > div:nth-child(3n+3),

  .full-width-content .vc_col-sm-8 .clients.no-carousel.six-cols > div:nth-child(3n+3) {

    margin-right: 0;

  }



  .full-width-content .vc_span8 .clients.five-cols.carousel > div,

  .full-width-content .vc_col-sm-8 .clients.five-cols.carousel > div {

    width: 40%;

  }

}

