
.contact {
    margin-bottom: 10px;
}

.contact .data {
    display: flex;
    gap: 5px;
}

.contact .data > div:first-child {
    display: grid;
    grid-template-columns: 5px 50px 96px 25px 42px 20px;
    column-gap: 4px;
}

.contact .data.selectC > div:first-child {
    grid-template-columns: 5px 45px 200px;
    row-gap: 3px;
}

.contact .data.staticC > div:first-child {
    grid-template-columns: 50px 150px;
    row-gap: 3px;
}

.contact .data .email     {  grid-column: 3 / span 4;  }
.contact .data .lastName  {  grid-column: 4 / span 3;  }
.contact .data .ext       {  grid-column: 4 / span 3;   display: flex; gap: 5px; }

.contact .data .caption           {  grid-column: 1 / span 2;  }
.contact .data.selectC .caption   {  grid-column: 2 / span 1;  }
.contact .data.selectC .selectorC {  grid-column: 1 / span 3;  }

.contact input, .contact select {
    width: 100%;
}

.contact .data > div:nth-child(2) {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding-top: 4px;
}

.contact .data > div div {
    align-self: center;
}
