@import 'fonts.css';
@import 'bootstrap-grid.css';
@import 'root.css';
@import 'button.css';
@import 'banner.css';
@import 'about.css';
@import 'principal.css';
@import 'card.css';
@import 'footer.css';
@import 'menu.css';
@import 'business.css';
@import 'blog.css';
@import 'connect.css';
@import 'accordion.css';
@import 'team.css';

.detailTeam{
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, .5);
    position: fixed;
    z-index: 20;
    top: 0;
    opacity: 0;
    visibility: hidden;
    left: 0;
}

.detailTeam__info{
    width: 100%;
    height: 100vh;
    right: 0;
    position: fixed;
    background-color: var(--color-secundary);
    display: flex;
    flex-direction: column;
    /*right: -100%;*/
}

.detailTeam__img{
    width: 100%;
    height: 35.5rem;
    object-fit: cover;
}

.detailTeam__detail{
    padding: 2rem;
    overflow: auto;
}

.detailTeam__person{
    font-size: 1.8rem;
    font-family: var(--font-medium);
    color: var(--color-primary);
    margin-bottom: 2.4rem;
}

.detailTeam__attr{
    font-size: 1.4rem;
    font-family: var(--font-medium);
    color: var(--color-primary);
    margin-bottom: .8rem;
}

.detailTeam__dscp{
    font-size: 1.4rem;
    font-family: var(--font-regular);
    color: var(--color-primary);
    line-height: 2.4rem;
    margin-bottom: .8rem;
}

.detailTeam__det{
    margin-bottom: 2.4rem;
}

.detailTeam__close{
    width: 4rem;
    height: 4rem;
    display: block;
    position: fixed;
    z-index: 22;
    right: 1.6rem;
    top: 1.6rem;
}

.detailTeam__social{
    display: flex;
    position: fixed;
    z-index: 22;
    right: 0;
    background-color: var(--color-primary);
    bottom: 0;
}

.detailTeam__rd{
    padding: 0.4rem;
}






.team--activate .detailTeam{
    opacity: 1;
    visibility: visible;
}