/**
 * @package Jms Brands
 * @version 1.0
 * @Copyright (C) 2009 - 2014 Joommasters.
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
 * @Website: http://www.joommasters.com
**/

.brand-item {
	text-align:center;
}

.brand-carousel .owl-stage-outer {
    float: left;
}

.owl-carousel .owl-item .brand-item a{
	display: block;
}

.owl-carousel .owl-item .brand-item img {
    width: auto;
    display: inline;
    transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
}

.brand-item a img {
    max-width: 100%;
}

.owl-carousel .owl-item .brand-item:hover img {
	transform: scale(1.1);
	-o-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
}

.brand-carousel-2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap; /* Safari 6.1+ */
    -moz-flex-wrap: wrap;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
}

.brand-carousel-2 .brand-item {
    flex: 0 0 calc(25% - 20px);
    -ms-flex: 0 0 calc(25% - 20px);
    -webkit-flex: 0 0 calc(25% - 20px);
    -moz-flex: 0 0 calc(25% - 20px);
    max-width: calc(25% - 20px);
    height: 138px;
    border: 1px solid #e9e7e7;
    border-radius: 6px;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: calc(25% - 20px);

    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;

    justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
}

.brand-carousel-2 .brand-item:hover{
    border-color: #2879fe;
}

.brand-carousel-2 .brand-item img {
    max-width: 138px;
    width: 100%;
}

@media (max-width: 1230px){
    .brand-carousel-2 .brand-item {
        min-height: 180px;
    }
}

@media (max-width: 1199px){
    .brand-carousel-2 .brand-item {
        min-height: initial !important;
        height: 150px;
        padding: 0 20px;
    }
}

@media (max-width: 991px){

    .brand-carousel-2 {
        justify-content: flex-start;
        -webkit-justify-content: flex-start;
        -moz-justify-content: flex-start;
        margin: 0 -20px 0 0;
    }

    .brand-carousel-2 .brand-item a{
        padding-left: 15px;
        padding-right: 15px;
    }

    .brand-carousel-2 .brand-item {
        border: 0;
        min-height: initial !important;
        height: 160px;
        padding: 0 20px;
        max-width: calc(33.333% - 20px);

        flex: 0 0 calc(33.333% - 20px);
        -moz-flex: 0 0 calc(33.333% - 20px);
        -webkit-flex: 0 0 calc(33.333% - 20px);
        -ms-flex: 0 0 calc(33.333% - 20px);
        -moz-box-flex: 0 0 calc(33.333% - 20px);
        -webkit-box-flex: 0 0 calc(33.333% - 20px);
        width: calc(33.333% - 20px);

        margin-right: 20px;
    }

}

@media (max-width:767px){

    .brand-carousel-2{
        justify-content: flex-start;
        -moz-justify-content: flex-start;
        -webkit-justify-content: flex-start;
        margin: 0 -20px 0 0;
    }

    .brand-carousel-2 .brand-item {
        flex: 0 0 calc(33.3333% - 20px);
        -ms-flex: 0 0 calc(33.3333% - 20px);
        -moz-flex: 0 0 calc(33.3333% - 20px);
        -webkit-flex: 0 0 calc(33.3333% - 20px);
        max-width: 33.3333%;
        margin-right: 20px;
        margin-bottom: 20px;
        padding: 0 20px;
        height: 110px;
        width: calc(33.3333% - 20px);
    }

}

@media (max-width: 575px){
    .brand-carousel-2 .brand-item {
        height: 155px;
        flex: 0 0 calc(50% - 20px);
        -ms-flex: 0 0 calc(50% - 20px);
        -webkit-flex: 0 0 calc(50% - 20px);
        -moz-flex: 0 0 calc(50% - 20px);
        max-width: calc(50% - 20px);
        width: calc(50% - 20px);
    }
}



@media (max-width: 480px){

    .brand-carousel-2 .brand-item {
        height: auto;
        flex: 0 0 calc(50% - 20px);
        -ms-flex: 0 0 calc(50% - 20px);
        -moz-flex: 0 0 calc(50% - 20px);
        -webkit-flex: 0 0 calc(50% - 20px);
        max-width: calc(50% - 20px);
        padding: 25px 20px;
        width: calc(50% - 20px);
    }

    .brand-carousel-2 .brand-item a {
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 9px;
        padding-bottom: 6px;
    }
}