.seller{
    position: relative;
    overflow: hidden;
    transition: transform .5s ease;
    background: #FFF;
    color: #fff;  
    height: 107%; 
    border-radius: 23px;
}


.seller:hover > p{
    transition: transform .5s ease !important;
    transform: scale(5) !important;
}

.div-trabalhe-conosco{
    text-align: center !important;
}

.btn-tm{
    padding: 15px 15px;
    text-align: left;
    width: 94%;
    text-decoration: none;
    color: #7F7F7F !important;
    background: #F4F4F4 ;
    border-radius: 5px !important;
    transition: color .25s, background-color .25s, border-color .25s, box-shadow .25s;
    border: 1px solid #F4F4F4 !important;
    margin: 5px;
}

.btn-tm.is-enabled{
    color: #fff !important;
    background-color: #00CF76 !important;
}

.btn-tm:hover{
    color: #fff !important;
    background-color: #00CF76 !important;
    text-decoration: none !important;
}


.btn-tm .ui-commandlink{
    color: #7F7F7F !important;
}

.btn-tm.is-enabled{
    color: #fff !important;
    background-color: #00CF76 !important;
}


.seller:hover::after, .seller:active::after {
    border-color: #00CF76;
    border-radius: 36px;
}
.wrap > a > h2{
    text-decoration: none !important;
}
/* //////////////////////////////////////////////////////////////////////////////////////// RESET */
body > .wrap > .wrap {
    padding: 60px 20px 40px;
}
@media (max-width: 587px) {
    .seller:hover::after, .seller:active::after {
        border-color: #00CF76;
        border-radius: 22px!important;
    }

}
@media (min-width: 800px) {
    body > .wrap > .wrap {
        padding: 60px 0 40px;
    }
}


.colaborador-nome{
    font-size: 18px !important;
}

.colaborador-telefone{
    font-weight: normal;
    font-size: 15px !important;
    text-color: white !important;
    color: white  !important;
}

/* ////////////////////////////////////////////////////////////////////////////////////// MODULES */
/* SELLER */


.seller::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3;
    content: '';
    border: 2px solid transparent;
    pointer-events: none;
}

.seller > .img, .seller > .wrap {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}

.seller > .img {
    transition: transform .5s ease;
    top: 0;
    z-index: 1;
}

.seller > .wrap {
    z-index: 2;
    padding: 18px 4px 1px;
    bottom: -150px;
    transition: bottom .25s;
}

.seller > .wrap > .title {
    margin-bottom: 10px;
}

.seller > .wrap > .button {
    opacity: 0;
    transition: opacity .25s;
}


.seller:hover > .wrap, .seller:active > .wrap {
    bottom: 0;

}

.seller:hover > .wrap > .button, .seller:active > .wrap > .button {
    opacity: 1;
}

/* /////////////////////////////////////////////////////////////////////////////////// COMPONENTS */
/* SALES */
.sales > .title {
    margin-bottom: 20px;
}

.sales-menu {
    margin-bottom: 20px;
}

.sales-menu > .grid {
    margin: -5px;
}

.sales-menu > .grid > .grid-item {
    padding: 5px;
}

.sales-menu > .grid > .grid-item > .button {
    padding: 15px !important;
    font-weight: 400 !important;
    text-align: left !important;
    text-decoration: none !important;
    color: #7F7F7F ;
}

.sales > .wrap > .grid {
    margin: -10px;
}

.sales > .wrap > .grid > .grid-item {
    width: 50%;
    padding: 10px;
}

.tit-pag{
    color: #7F7F7F !important;
    font-size: 25px !important;
    font-weight: 700  !important;
}

.line{
    border-bottom: 4px solid #00CF76;
    width: 100%;
    margin-top: -10px;
    margin-bottom: 10px;
    border-radius: 41px;
}

.tamanho-seller{
    height: 143px;

}

@media(min-width: 450px){
     .tamanho-seller{
        height: 222px;
    }
    .seller{

        height: 95%;
    }
    .seller > .wrap{
        padding: 18px 15px 1px;

    }
}

@media (min-width: 600px) {
    .sales > .wrap > .grid > .grid-item {
        width: 33.33333%;
    }
    .tamanho-seller{
        height: 295px;
    }
    .seller{

        height: 95%;
    }
    .seller > .wrap{
        padding: 18px 15px 1px;

    }

}


@media(min-width: 768px){
    
    .tamanho-seller{
        height: 143px;
    }
    .seller{

        height: 95%;
    }
    .seller > .wrap{
        padding: 18px 15px 1px;

    }
    
}

@media (min-width: 800px) {

    .div-trabalhe-conosco{
        text-align: left;
    }

    .seller {
        height: 100%;
    }
    .sales > .wrap {
        position: relative;
        padding-left: 280px;
    }
    .sales-menu {
        position: absolute;
        top: 10px;
        left: 0;
    }
    .sales-menu > .grid {
        margin: 0;
    }
    .sales-menu > .grid > .grid-item {
        width: 100%;
        padding: 0;
    }
    .sales-menu > .grid > .grid-item:not(:last-child) {
        margin-bottom: 10px;
    }
    .sales-menu > .grid > .grid-item > .button {
        width: 250px;
    }
    .sales > .wrap > .grid > .grid-item {
        width: 50%;
    }
    .tamanho-seller{
        height: 142px;
    }
    
    .seller > .wrap{
        padding: 18px 15px 1px;

    }
    
    
}

@media (min-width: 1000px) {
    .colaborador-nome{
        font-size: 18px !important;
    }

    .colaborador-telefone{
        font-weight: normal;
        font-size: 15px !important;
        text-color: white !important;
        color: white  !important;
    }


    .sales > .wrap > .grid > .grid-item {
        width: 33.33333%;
    }
}
@media (min-width: 1150px) {

    .tamanho-seller{
    }
    .seller > .wrap {
        padding: 18px 15px 1px;
    }
}



@media (min-width: 1199px) {
    .sales > .wrap > .grid > .grid-item {
        width: 25%;
    }

    .tamanho-seller{
        height: 289px;
    }
}
