/*
 * SyncIt Group
 *
 * This source file is subject to the SyncIt Software License, which is available at https://syncitgroup.com/.
 * Do not edit or add to this file if you wish to upgrade to the newer versions in the future.
 * If you wish to customize this module for your needs.
 * Please refer to http://www.magentocommerce.com for more information.
 *
 * @category  Syncitgroup
 * @package   Syncitgroup_Brands
 * @author    SyncitGroup
 * @copyright Copyright (C) 2024 SyncIt (https://syncitgroup.com/)
 * @license   http://opensource.org/licenses/gpl-license.php GNU Public License
 * @link      https://syncitgroup.com/
 */

.sub-brands {
    float: left;
    width: 100%;
    margin: 15px 0;
}
.sub-brand-logo-wrapper {
    min-height: 80px;
    max-height: 150px;
    vertical-align: middle;
    padding: 0 15px;
    position: relative;
    margin-bottom: 10px;
    width: 100%;
}
.sub-brands .sub-brand img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    position: relative;
    top: unset;
    bottom: unset;
    margin: auto;
    max-height: 76px;
}
.sub-brands a {
    text-decoration: none;
}
.sub-brands .sub-brand {
    width: calc(100%/4 - 10px);
    display: inline-block;
    background-color: #f2f4f3;
    padding: 20px;
    float: left;
    margin: 5px;
    min-height: 264px;
    max-height: 264px;
    position: relative;
    height: auto;
}
.sub-brands .sub-brand p.desc-abs {
    color: #494a4a;
}

.sub-brands .sub-brand p.desc-abs.btn-more {
    text-align: center;
    margin-top: 20px;
}

.sub-brands .sub-brand button:hover {
    cursor: pointer;
    color: #494a4a;
}
@media (max-width: 1160px) {
    .sub-brands .sub-brand {
        min-height: 290px;
        max-height: 290px;
    }
}
@media (max-width:  965px) {
    .sub-brands .sub-brand {
        width: calc(100%/3 - 10px);
        min-height: 275px;
    }
}
@media (max-width: 768px) {
    .sub-brands .sub-brand {
        width: calc(50% - 10px);
        min-height: 260px;
        max-height: 260px;
    }
    .sub-brands {
        float: left;
        width: 100%;
        margin: 15px 0;
    }
    .sub-brand-logo-wrapper {
        min-height: 80px;
        max-height: 150px;
        vertical-align: middle;
        padding: 0 15px;
        position: relative;
        margin-bottom: 10px;
        width: 100%;
    }
    .sub-brands .sub-brand img {
        object-fit: contain;
        width: 100%;
        height: 100%;
        position: relative;
        top: unset;
        bottom: unset;
        margin: auto;
        max-height: 76px;
    }
}
@media (max-width: 640px) {
    .sub-brands .sub-brand {
        width: calc(50% - 10px);
        min-height: 280px;
        max-height: 280px;
    }
}
@media (max-width: 570px) {
    .sub-brands .sub-brand {
        width: calc(100% - 10px);
        min-height: unset;
        max-height: unset;
        height: auto;
    }
}

.sub-brands a {
    text-decoration: none;
}

.sub-brands .sub-brand p.desc-abs {
    color: #494a4a;
}

.sub-brands .sub-brand p.desc-abs.btn-more {
    text-align: center;
    margin-top: 20px;
}

.sub-brands .sub-brand button:hover {
    cursor: pointer;
    color: #494a4a;
}
.sub-brand-motto {
    text-align: center;
    margin-bottom: 15px;
    color: #b4b4b4;
    /*color: #adadad;*/
    font: 13px Arial, Helvetica, sans-serif;
}

.sub-brand-name {
    font-family: 'BebasNeueRegular', sans-serif;
    text-align: center;
    font-size: 25px;
    padding: 20px 0 15px;
}