.bf_contenedor .mySlides {
    display:none
}

.bf_contenedor{
    width:100%;
    overflow:hidden;
    position:relative;
    min-width: 319px !important;
    overflow-y: auto;
    overflow-x: hidden;
}

.bf_contenedor a{
    text-decoration: none;
    display: block;
}
.bf_contenedor img{
    width:100%;
    /*height: auto;*/
}
/*BANNERS */
.bf_contenedor .bf_banner1{
    padding:10px;
}
.bf_contenedor .bf_banner_contenedor{
    display:flex;
    padding:10px;
}
.bf_contenedor .bf_banner2{ 
    width: 40%;
    /* position: relative; */
    /* float: left; */
    display: flex;
    
}
.bf_contenedor .bf_banner_contenedor2{ 
    width:60%;
    display:flex;
    flex-direction:column;
    padding-left: 10px;
    justify-content: space-between;
    /*float: right;
    position: relative;*/
}
.bf_contenedor .bf_banner3{
    /*padding-top:10px;*/
}
.bf_contenedor .bf_banner4{
   /* padding:10px;
   padding-top: 28px;*/
   
}

/* MARCAS*/
.bf_contenedor .bf_titulo{
    position:relative;
    padding: 20px;
    display: flex;
    flex-direction: column;
}
.bf_contenedor .bf_titulo h3{
    text-align:center;
}
.bf_contenedor .bf_marcas{
    display:grid;
    grid-template-columns:repeat(13,1fr);
    grid-gap: 10px;
    width: 80%;
    padding-bottom: 20px;
    margin-left: 10%;
}
.bf_contenedor .bf_marcas img{
        filter: grayscale(100%);
}
.bf_contenedor .bf_marcas > div:hover img {
    filter: grayscale(0%);
}
.bf_contenedor .bf_marcas > div:hover{
    cursor: pointer;
    transition: transform .3s;
    transform: scale(1.05);
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5);
}
.bf_contenedor .item{
display:grid;
border-radius: 10px;
/*padding-top: 10px;
padding-bottom: 10px;*/
}
.bf_contenedor .item a{
    display: flex;
    flex-direction: column;
}
.bf_contenedor .item a{
    display: flex;
    flex-direction: none;
}
.bf_contenedor .marcas .item{
    display:grid;
    padding-top: 0px;
    padding-bottom: 0px;
}
.bf_contenedor .marcas .item a{
    display: flex;
    flex-direction: row;
}

.bf_contenedor .marcas .item a picture{
    align-self: center;
}
.bf_contenedor .item a img{
    display:relative;
}
.bf_contenedor .item picture{
    padding: 10px;
}
/*SLIDER*/

.bf_contenedor .bf-content{margin-left:auto;margin-right:auto}
.bf_contenedor .bf-content{width:80%}

.bf_contenedor .bf-display-container{position:relative}

.bf_contenedor .bf-display-container:hover .bf-display-hover{display:block}
.bf_contenedor .bf-display-container:hover span.bf-display-hover{display:inline-block}


.bf_contenedor .bf-section{margin-top:16px!important;margin-bottom:16px!important}

.bf_contenedor .bf-animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.bf_contenedor .bf-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.bf_contenedor .bf-animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.bf_contenedor .bf-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.bf_contenedor .bf-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.bf_contenedor .bf-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.bf_contenedor .bf-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.bf_contenedor .bf-animate-input{transition:width 0.4s ease-in-out}.bf-animate-input:focus{width:100%!important}

.bf_contenedor .bf-center{text-align:center!important}

.bf_contenedor .bf-container:after,
.bf_contenedor .bf-container:before{content:"";display:table;clear:both}


.bf_contenedor .bf-tiny{font-size:10px!important}
.bf_contenedor .bf-small{font-size:12px!important}
.bf_contenedor .bf-medium{font-size:15px!important}
.bf_contenedor .bf-large{font-size:18px!important}

.bf_contenedor .bf-text-white{color:#fff!important}

.bf_contenedor .bf-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}

.bf_contenedor .bf-button:hover{color:#000!important;background-color:#ccc!important}
.bf_contenedor .bf-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.bf_contenedor .bf-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}   
.bf_contenedor .bf-button:disabled{cursor:not-allowed;opacity:0.3}.bf-disabled *,:disabled *{pointer-events:none}
.bf-dropdown-hover:hover > .bf-button:first-child,.bf-dropdown-click:hover > .bf-button:first-child{background-color:#ccc;color:#000}
.bf-bar-block .bf-dropdown-hover .bf_contenedor .bf-button,.bf-bar-block .bf-dropdown-click .bf-button{width:100%;text-align:left;padding:8px 16px}
.bf_contenedor .bf-button{white-space:normal}
.bf_contenedor.bf-button{width:100%}

.bf_contenedor .bf-display-left{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)}
.bf_contenedor .bf-display-right{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)}
.bf_contenedor .bf-black{color:#fff!important;background-color:#00000024!important}

.bf_contenedor .bf-badge{background-color:#000;color:#fff;display:inline-block;text-align:center;}


.bf_contenedor .bf-border-0{border:0!important}
.bf_contenedor .bf-border-top{border-top:1px solid #ccc!important}.bf-border-bottom{border-bottom:1px solid #ccc!important}
.bf_contenedor .bf-border-left{border-left:1px solid #ccc!important}.bf-border-right{border-right:1px solid #ccc!important}
.bf_contenedor .bf-border-amber,.bf-hover-border-amber:hover{border-color:#ffc107!important}
.bf_contenedor .bf-border-aqua,.bf-hover-border-aqua:hover{border-color:#00ffff!important}
.bf_contenedor .bf-border-blue,.bf-hover-border-blue:hover{border-color:#2196F3!important}
.bf_contenedor .bf-border-light-blue,.bf-hover-border-light-blue:hover{border-color:#87CEEB!important}
.bf_contenedor .bf-border-brown,.bf-hover-border-brown:hover{border-color:#795548!important}
.bf_contenedor .bf-border-cyan,.bf-hover-border-cyan:hover{border-color:#00bcd4!important}
.bf_contenedor .bf-border-blue-grey,.bf-hover-border-blue-grey:hover,.bf-border-blue-gray,.bf-hover-border-blue-gray:hover{border-color:#607d8b!important}
.bf_contenedor .bf-border-green,.bf-hover-border-green:hover{border-color:#4CAF50!important}
.bf_contenedor .bf-border-light-green,.bf-hover-border-light-green:hover{border-color:#8bc34a!important}
.bf_contenedor .bf-border-indigo,.bf-hover-border-indigo:hover{border-color:#3f51b5!important}
.bf_contenedor .bf-border-khaki,.bf-hover-border-khaki:hover{border-color:#f0e68c!important}
.bf_contenedor .bf-border-lime,.bf-hover-border-lime:hover{border-color:#cddc39!important}
.bf_contenedor .bf-border-orange,.bf-hover-border-orange:hover{border-color:#ff9800!important}
.bf_contenedor .bf-border-deep-orange,.bf-hover-border-deep-orange:hover{border-color:#ff5722!important}
.bf_contenedor .bf-border-pink,.bf-hover-border-pink:hover{border-color:#e91e63!important}
.bf_contenedor .bf-border-purple,.bf-hover-border-purple:hover{border-color:#9c27b0!important}
.bf_contenedor .bf-border-deep-purple,.bf-hover-border-deep-purple:hover{border-color:#673ab7!important}
.bf_contenedor .bf-border-red,.bf-hover-border-red:hover{border-color:#f44336!important}
.bf_contenedor .bf-border-sand,.bf-hover-border-sand:hover{border-color:#fdf5e6!important}
.bf_contenedor .bf-border-teal,.bf-hover-border-teal:hover{border-color:#009688!important}
.bf_contenedor .bf-border-yellow,.bf-hover-border-yellow:hover{border-color:#ffeb3b!important}
.bf_contenedor .bf-border-white,.bf-hover-border-white:hover{border-color:#fff!important}
.bf_contenedor .bf-border-black,.bf-hover-border-black:hover{border-color:#000!important}
.bf_contenedor .bf-border-grey,.bf-hover-border-grey:hover,.bf-border-gray,.bf-hover-border-gray:hover{border-color:#9e9e9e!important}
.bf_contenedor .bf-border-light-grey,.bf-hover-border-light-grey:hover,.bf-border-light-gray,.bf-hover-border-light-gray:hover{border-color:#f1f1f1!important}
.bf_contenedor .bf-border-dark-grey,.bf-hover-border-dark-grey:hover,.bf-border-dark-gray,.bf-hover-border-dark-gray:hover{border-color:#616161!important}
.bf_contenedor .bf-border-pale-red,.bf-hover-border-pale-red:hover{border-color:#ffe7e7!important}.bf-border-pale-green,.bf-hover-border-pale-green:hover{border-color:#e7ffe7!important}
.bf_contenedor .bf-border-pale-yellow,.bf-hover-border-pale-yellow:hover{border-color:#ffffcc!important}.bf-border-pale-blue,.bf-hover-border-pale-blue:hover{border-color:#e7ffff!important}


/*Botones*/

.bf_contenedor .bf-badge{
    border-radius:50%;
    height: 13px;
    width: 13px;
    padding: 0;
    cursor: pointer;
}

.bf-transparent, .bf-hover-none:hover {
    background-color: transparent!important;
}
.bf-white, .bf-hover-white:hover {
    color: #000!important;
    background-color: #fff!important;
}
.bf-border {
    border: 1px solid #ccc!important;
}
.bf-badge {
    background-color: #000;
    color: #fff;
    display: inline-block;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    /*ELIMINAR bf-TAG*/
}
/**, *:before, *:after {
    box-sizing: inherit;
}*/

/**/
.bf-text-khaki, .bf-hover-text-khaki:hover {
    color: #b4aa50!important;
}
.bf-left, .bf-right, .bf-badge {
    cursor: pointer;
}
.bf-left {
    float: left!important;
}


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

    .bf_contenedor .bf_marcas{
        width: 80%;
         margin-left: 10%;

    }
    .bf_contenedor .bf_marcas {

        display: grid;
        grid-template-columns: repeat(3,1fr);
    }
}
@media  screen and (min-width: 768px) and (max-width: 1024px) {
    .bf_contenedor .bf_marcas {
        display: grid;
        grid-template-columns: repeat(7,1fr);
        grid-gap: 10px;
        width: 90%;
        padding-bottom: 20px;
        margin-left: 5%;
    }
}













