.background-image {
    position: fixed;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
}
.background-image img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    min-width: 50%;
    min-height: 50%;
}

.body-menu-template{
    background-color:#F3F3F7;
    color: #212529;
    height: 100%;
    margin: 0;
    padding: 0;
}
.container-main{
    position: relative;
}
.img-circle {
    border-radius: 50%;
}

.btn{
    box-shadow: none!important;
}

.btn-flat {
    border-radius: 0;
    border-width: 1px;
    box-shadow: none;
}
.btn-xs {
    padding: .125rem .25rem;
    font-size: .75rem;
    line-height: 1.5;
}
.list-cart, .list-account{
    position: fixed;
    z-index: 1500;
    right: -320px;
    width: 320px;
    transition: right 2s;
}

.show-cart, .show-account{
    right: 0;
}


.input-cant{
    width: 50px!important;
    height: 25px;
    margin-right: 10px;
    border-radius: 0;
    padding: 0 0 0 5px;
}


.card-header>.card-tools {
    float: right;
    margin-right: -.625rem;
}

.btn-default {
    background-color: #f8f9fa;
    border-color: #ddd;
    color: #444;
}

.text-red{
    color: #dc3545;
}

.bg-purple, .bg-purple>a {
    color: #fff!important;
}
.bg-purple {
    background-color: #6f42c1!important;
}

.bg-fuchsia, .bg-fuchsia>a {
    color: #fff!important;
}
.bg-fuchsia {
    background-color: #f012be!important;
}

.bg-pink, .bg-pink>a {
    color: #fff!important;
}
.bg-pink {
    background-color: #e83e8c!important;
}

.bg-lightblue, .bg-lightblue>a {
    color: #fff!important;
}
.bg-lightblue {
    background-color: #3c8dbc!important;
}
.bg-orange, .bg-orange>a {
    color: #fff!important;
}
.bg-orange {
    background-color: #fd7e14!important;
}

.modal-xl {
    max-width: 1140px;
}

.message{
    left: -500px;
    max-width: 500px;
    position: fixed;
    top: 20px;
    z-index: 3000;
    border-radius: 0;
    
}

@media (min-width: 768px) { 

    .card-combos {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
        
        }
    
}

@media (min-width: 992px) { 

    .card-combos {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        
        }
}

@media (min-width: 1200px) { 

    .card-combos {
        -webkit-column-count: 4;
        -moz-column-count: 4;
        column-count: 4;
        
        }

    .card-products {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
        
        }   

    

}