.cust-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    /* grid-auto-rows: minmax(100px, auto); */
    grid-auto-rows: minmax(min-content, max-content);
    /* grid-gap: 1em; */
    /* border-bottom: 1rem solid rgb(59,57,57);  */
    /*above is hack to mimmick a grid gap in the bottom */
    justify-items: stretch;
    align-items: stretch;
    /* margin-bottom: 2rem; */
    overflow: hidden;
}

.cust-wrapper-border-bottom {
    border-bottom: 2rem solid var(--dark); 
    /* border-bottom: 1rem solid rgb(59,57,57);  */
    /*hack to mimmick a grid gap in the bottom */
}

.header { grid-area: header; }
.menu { grid-area: menu; }
.main { grid-area: main; }
.footer { grid-area: footer; }

.top-grid-container {
    display: grid;
    grid-template-areas:
      'header header header header header header header header header header'
      'menu main main main main main main main main main'
      'footer footer footer footer footer footer footer footer footer footer';
    grid-gap: 5px;
    /* background-color: #2196F3; */
    /* background-color: rgb(70, 63, 63);  */
    /* background-color: rgb(238, 184, 6);  */
    background-color: rgba(255, 255, 255, 1);
    padding: 1px;
}

.top-grid-container > div {
/* background-color: rgba(255, 255, 255, 0.8); */
background-color: rgba(255, 255, 255, 1);
text-align: center;
padding: 1px 0;
font-size: 20px;
}

.marcas-grid-container {
    display: grid;
    grid-template-columns: 1fr;
    background-color: rgba(255, 255, 255, 1);
    /* background-color: #2196F3; */
    /* padding: 3px; */
  }
  
.marcas-grid-item {
    /* background-color: rgba(255, 255, 255, 0.8); */
    background-color: rgba(255, 255, 255, 1);
    /* border: 0.5px solid rgba(0, 0, 0, 0.8); */
    /* padding: 5px; */
    /* font-size: 15px; */
text-align: center;
}

.product-grid-container {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    /* background-color: #2196F3; */
    background-color: rgba(255, 255, 255, 1);
    /* padding: 5px; */
}

.product-grid-item {
    display: grid;
    /* background-color: rgba(255, 255, 255, 0.8); */
    background-color: rgba(255, 255, 255, 1);
    border: 0.5px solid rgba(117, 115, 115, 0.8);

    /* padding: 5px; */
    font-size: 10px;
    text-align: center;
}
.product-grid-item-content {
    display: grid;
    /* background-color: rgba(255, 255, 255, 0.8); */
    background-color: rgba(255, 255, 255, 1);
    border: 0.5px solid rgba(117, 115, 115, 0.8);

    /* padding: 5px; */
    font-size: 15px;
    text-align: center;
}
.product-grid-item-actions {
/* background-color: rgba(255, 255, 255, 0.8); */
background-color: rgba(255, 255, 255, 1);
border: 0.5px solid rgba(117, 115, 115, 0.8);

padding: 5px;
font-size: 10px;
text-align: center;
}


  .product-grid-item-footer {
    /* background-color: rgba(255, 255, 255, 0.8); */
    background-color: rgba(255, 255, 255, 1);
    border: 0.5px solid rgba(117, 115, 115, 0.8);

    padding: 5px;
    font-size: 10px;
    text-align: center;
  }

.product-grid-item>img {
    max-width: 100%;
}

.product-grid-item-content>h3 {
    font-size: 1.5rem;
    padding:0.2em 0;
}


.mr-add-to-cart-btn-overload {
    margin: 0.5rem 0.5rem 1rem 0.5rem;
    text-decoration: none;
    /* width: 15rem; */
    min-width: 8rem;
    font-size: 14px;
  }

.cust-wrapper>div {
    background: #eee;
    padding: 0.5em;
}

.cust-box1 {
    /* align-self:start; */
    grid-column: 1/3;
    grid-row: 1/2;
    font-size: 1.5rem;
}


.cust-box2 {
    /*align-self:start;*/
    grid-column: 3/6;
    grid-row: 1/2;
    font-size: 1.5rem;
}



.add-product-box1 {
    /*align-self:start;*/
    grid-column: 1/7;
    grid-row: 1;
    font-size: 1.5rem;
    min-width: 20rem;
}

.add-product-box2 {
    grid-column: 1/7;
    grid-row: 2;
    /* border: 1px solid #333; */
    /* display:grid; */
    align-items: flex-end;
    
    font-size: 1.5rem;
    /* float:right; */
}

.cust-box1to6 {
    /*align-self:start;*/
    grid-column: 1/6;
    grid-row: 1/2;
    font-size: 1.5rem;
}

.cust-box4 {
    grid-column: 6;
    grid-row: 1/2;
    /* border: 1px solid #333; */
    display:grid;
    align-items: flex-end;
    font-size: 1.5rem;
}
.cust-box1-long {
    /* align-self:start; */
    grid-column: 1/4;
    grid-row: 1/1;
    font-size: 1.5rem;
}
.cust-box2-long {
    /*align-self:start;*/
    grid-column: 4/6;
    grid-row: 1/1;
    font-size: 1.5rem;
}
.cust-box4-long {
    grid-column: 6;
    grid-row: 1/1;
    /* border: 1px solid #333; */
    display:grid;
    /* align-items: flex-end; */
    font-size: 1.5rem;
}

.cust-box5 {
    grid-column: 1/6;
    grid-row: 3;
    /* border: 1px solid #333; */
    display:grid;
    /* align-items: flex-end; */
    font-size: 1.5rem;
    float:right;
}



.cust-box4a{
    grid-column: 6;
    /* grid-row: 1/2; */
    /* border: 1px solid #333; */
    display:grid;
    align-items: flex-end;
    font-size: 1.5rem;
}



.cust-flexed {
    display: flex;
    flex-direction: row;
    width: auto;
    display: inline-flex;
    flex-wrap: wrap;
}

.cust-flexed>div {
    border:rgb(170, 166, 165) 1px solid;
    padding: 0.5em;
    background-color: rgb(236, 230, 228);
    border-radius: 4px; /*rounding of the corners  */
    margin: 0.5rem;
}

.cust-flexed-btn {
    display: flex;
    flex-direction: row;
    width: auto;
    display: inline-flex;
    flex-wrap: wrap;
    
}

.prod-flexed-btn {
    display: flex;
    flex-direction: row;
    width: auto;
    display: inline-flex;
    flex-wrap: wrap;
    
}


.cust-flexed-btn>div {
    /* border: #333 1px solid; */
    padding: 0.5em;
    
}

/* ------------------------------------------------ */
/* --------- mobile MEDIA when less than 575 ------ */
/* ------------------------------------------------ */
@media (max-width: 575px) {
    /* body{display: none;} */
    .cust-flexed-btn {
        display: grid;
        align-content:center;
    }

    .cust-box1 {
        /* align-self:start; */
        grid-column: 1/7;
        grid-row: 1/2;
    }

    .cust-box2 {
        /*align-self:start;*/
        grid-column: 1/6;
        grid-row: 2/3;
    }

    .cust-box4 {
        display:grid;
        grid-column: 6;
        grid-row: 2/3;
        /* border: 1px solid #333; */
    }


    .cust-box1-long {
        /* align-self:start; */
        grid-column: 1/7;
        grid-row: 1/1;
        font-size: 1.5rem;
      }
      .cust-box2-long {
        /*align-self:start;*/
        grid-column: 1/6;
        grid-row: 2/2;
        font-size: 1.5rem;
      }
      .cust-box4-long {
        grid-column: 6;
        grid-row: 2/2;
        /* border: 1px solid #333; */
        display:grid;
        align-items: flex-end;
        font-size: 1.5rem;
        padding: 0.5rem 2rem 1rem 0.5rem !important;
      }

      .marcas-grid-container {
        display: grid;
        grid-template-columns: 1fr;
        background-color: rgba(255, 255, 255, 1);
        /* background-color: #2196F3; */
        /* padding: 3px; */
      }

      .product-grid-container {
        display: grid;
        grid-gap: 5px;
        /* grid-template-columns: 1fr 1fr; */
        grid-template-columns: 12rem 12rem;
        background-color: rgba(255, 255, 255, 1);
        /* background-color: #2196F3; */
        /* padding: 3px; */
      }     

      .product-grid-item-content {
        font-size: 10px;
    }
    .mr-add-to-cart-btn-overload {
        font-size: 8px;
      }
}