/* ==========================================================================
# Clients style - begin
========================================================================== */
.qodef-clients {
	overflow:hidden;
	position:relative;
	
	.qodef-client-holder {
		float: left;
		text-align: inherit;
		margin-bottom: 0;
		height: 150px;
		display: table;
		box-shadow: 1px 1px 0 0 #dadada;

		.qodef-client-holder-inner {
			position: relative;
			margin: 0;
			display:table-cell;
			vertical-align:middle;
			text-align: center;
		}
		a,
        .qodef-client-image-nolink{
			display: inline-block;
			vertical-align: middle;
			max-width: 100%;
			line-height: 0;
			@include qodefTransition(opacity 0.15s ease-out);
			position: relative;
			overflow: hidden;
		}

		&.qodef-hover-opacity a:hover {
			opacity: 0.4;
		}
		.qodef-client-image{
			position: relative;
			display: block;
			box-sizing: border-box;
			padding: 10px 0;
		}
		.qodef-client-hover-image{
			position: absolute;
			top: 0;
			left: 0;
			display: block;
			box-sizing: border-box;
			padding: 10px 0;
		}

		&.qodef-clients-roll-over {
			.qodef-client-hover-image,
			.qodef-client-image {
				-webkit-transition: -webkit-transform .4s ease;
				transition: transform .4s ease;
			}
			.qodef-client-hover-image{
				@include qodefTransform(translateY(-100%));
			}
			a:hover .qodef-client-hover-image,
            .qodef-client-image-nolink:hover .qodef-client-hover-image{
				@include qodefTransform(translateY(0%));
				-webkit-transition: -webkit-transform .5s $aux-easing-1;
				transition: transform .5s $aux-easing-1;
			}
			a:hover .qodef-client-image,
            .qodef-client-image-nolink:hover .qodef-client-image{
				@include qodefTransform(translateY(100%));
				-webkit-transition: -webkit-transform .5s $aux-easing-1;
				transition: transform .5s $aux-easing-1;
			}
		}

		&.qodef-clients-fade {
			.qodef-client-hover-image,
			.qodef-client-image {
				@include qodefTransition(opacity .4s $aux-easing-1);
			}
			.qodef-client-hover-image{
				opacity: 0;
			}
			a:hover .qodef-client-hover-image,
			.qodef-client-image-nolink:hover .qodef-client-hover-image{
				opacity: 1;
			}
			a:hover .qodef-client-image,
            .qodef-client-image-nolink:hover .qodef-client-image{
				opacity: 0;
			}
		}
	}

	&.qodef-clients-two-columns {

		.qodef-client-holder {
			width: 50%;

			&:nth-of-type(2n+0) {
				box-shadow: 0px 1px 0 0 #dadada;
			}
		}
	}
	&.qodef-clients-three-columns {
		.qodef-client-holder {
			width: 33.33%;

			&:nth-of-type(3n+0) {
				box-shadow: 0px 1px 0 0 #dadada;
			}
		}

	}

	&.qodef-clients-four-columns {
		.qodef-client-holder {
			width: 25%;

			&:nth-of-type(4n+0) {
				box-shadow: 0px 1px 0 0 #dadada;
			}
		}

	}
	&.qodef-clients-five-columns {
		.qodef-client-holder {
			width: 20%;

			&:nth-of-type(5n+0) {
				box-shadow: 0px 1px 0 0 #dadada;
			}
		}

	}

	&.qodef-clients-six-columns {
		.qodef-client-holder {
			width: 16.66%;

			&:nth-of-type(6n+0) {
				box-shadow: 0px 1px 0 0 #dadada;
			}
		}

	}

}
/* ==========================================================================
# Clients style - end
========================================================================== */