div.waitlist{
    height:98%;
    width:100%;
    background:var(--mainpage_bg);
    /*background:orange;*/
    display:grid;
    grid-template-rows: 98%;
    grid-template-columns: 30% 30% 25%;
    grid-template-areas: "I D L";

    grid-gap:1em;
    padding:1.5vw;

    }

div.join_waitlist{
    background:var(--dialog_bg);
    grid-area: D;
    width:100%;
    height:56%;
}


div.waitlistinstructions{
    background:var(--dialog_bg);
    grid-area: I;
    width:100%;
    height:40%;
}

div.view_waitlist{
    grid-area: L;
    width:100%;
    height:98%;

}

div.view_waitlist_content{
    background:var(--dialog_bg);
    margin-bottom:1vh;
    overflow:auto;
    padding:1%;
    height:94%;

}

div.wlinstructions{
    padding:1vw;
}

table.waitlist{
    line-height:2;
}

p.invalid{
    background-color: crimson;
    color:white;
    padding-left:.5vw;
}



/*div.view_waitlist_dialog{
    height:100%;
    width:100%;
    display:flex;
    flex-direction: row;
    background: orange;

}*/

p.waitlistheader{
    background:var(--header_bg);
    height:4vh;
    margin:0;
    padding:0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color:whitesmoke;
}

p.waitlisterrorheader{
    background:crimson;
    height:4vh;
    margin:0;
    padding:0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color:floralwhite;
}

button.join{
    margin-left:2%;
    width:96%;
    height:4vh;
}


table.waitlist{
    width:100%;
}

div.waitlistcolumn p.label{
    margin: .3vh 0 0;
    font-size:.8vw;
    color:whitesmoke;
}


td.waitlist{
    color:whitesmoke;
    font-size:1.0vw;
}

td.count{
    text-align: right;
}

td.name{
    padding-left:1vw;

}

input.jvid{
    width:4vw;
}

input.phone{
    width:9vw;
}

div.waitlistcolumn{
    width:45%;
    margin-left:1vw;
    //background: orange;

}

div.waitlistrow{
    display:flex;
    margin-top:1.5vh;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    width:100%;
}

div.dialogcontent{
    padding:1vh;

}

p.instructions {
    font-size: 1vw;
    color: whitesmoke;
    margin-bottom: 1vh;
}

span.red,
p.red{
    background-color: crimson;
    color:whitesmoke;
    padding-left:.4rem;
    padding-right: .4rem;
}