/*als het een class is die uit casemaster komt, of een class is die werkelijk elk project heeft, dan hoort het hier thuis
ook styling is als <table width="100%"> dan halen we dat in deze css file weg
stel dat je afwijkt vanuit je eigen pageflow dan worden html-attributen gewoon toegepast bijv. <table width="99%">*/


.hide {
    display: none;
}
.hideImportant {
    display: none!important;
}

[type="text"]{
    padding-bottom: 8px;
	/*width: 88vw;*/
    width: 100%;
	font-size: 17px;
	font-weight: 400;
}

tr>td.zxLabelPlain[width="20%"] {
    display: none;
}

table tr[width], table tr td[width]  {
    width: unset;
}
table[width="90%"] {
    width: 100%;
}

[align="left"], [align="right"] {
    padding-left: 10px;
    padding-right: 10px;
}

.zXFormTitle>img {
    display: none;
}
.zxLookupButton {
    display: none;
}

.zXFormLabel{
    display: block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 600;
}

[src="../images/unlock.gif"] { /*lock icoontje van fk entity size medium? ALS veld GEVULD is*/
    display: none;
}

[src="../images/search_icon.gif"] { /*search icoontje van fk entity size medium? ALS veld LEEG is*/
    display: none;
}

.zXRowClass {
    display: block;
    border-bottom: 1px solid lightgray;
}

.notify:hover{
    cursor: pointer;
}

.align-row-left > .list-title, .align-row-left > .list-attr{
    text-align: left;
}

.align-row-right > .list-title, .align-row-right > .list-attr{
    text-align: right;
}

.list1-row{
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    margin-bottom: 1rem;
    height: fit-content;
    border-radius: 10px;
    max-width: 90vw;
}

.list1-row > .list-title{
    text-align: center;
    border-radius: 10px;
    grid-row-end: 1;
}

.list1-row > .list-attr{
    max-width: 100%;
    text-align: center;
    border-radius: 10px;
}

.list-attr, list-title{
    height: fit-content !important;
}

.list-attr::before, list-title::before{
    white-space: pre;
    content: attr(data-title);
}

.list2-row{
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto;
    margin-bottom: 1rem;
    height: fit-content;
    border-radius: 10px;
    max-width: 90vw;
}

.list2-row > .list-title{
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-end: 1;
    text-align: center;
    border-radius: 10px;
}

.list2-row > .list-attr{
    max-width: 100%;
    text-align: center;
    border-radius: 10px;
    height: fit-content;
    margin-bottom: .5rem;
}

.list3-row{
    display: grid;
    grid-template-columns: 33% 33% 33%;
    grid-template-rows: auto;
    margin-bottom: 1rem;
    height: fit-content;
    border-radius: 10px;
    max-width: 90vw;
}

.list3-row > .list-title{
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row-end: 1;
    text-align: center;
    border-radius: 10px;
}

.list3-row > .list-attr{
    max-width: 100%;
    text-align: center;
    border-radius: 10px;
    height: fit-content;
    margin-bottom: .5rem;
}