body{
	--default-border-color:Green;
	--default-header-color:DarkGreen;
	--default-button-color:DarkGreen;
	--default-button-border-color:DarkGreen;
	--default-button-delete-color:#e30613;
	--default-button-background-color:AliceBlue;
}

.center{text-align:center}
.right{text-align:right}
.paddingright5{padding-right:5px}
.breakword{overflow-wrap:anywhere}
.width20{width:20px}
.width50{width:50px}
.width60{width:60px}
.width80{width:80px}
.width100{width:100px}
.width120{width:120px}
.width150{width:150px}
.width180{width:180px}
.width200{width:200px}
.width250{width:250px}
.width270{width:270px}
.width300{width:300px}
.width400{width:400px}
.width500{width:500px}
.flexwrap{flex-wrap:wrap}

dialog{border:2px solid var(--default-border-color);border-radius:7px;box-shadow:silver 5px 5px 5px}
dialog button{background-color:var(--default-button-background-color);border-color:var(--default-button-border-color);color:var(--default-button-color)}
input.currententry{color:red !important}

div.tabbodyentry{padding:10px}
div.tabbodyentry th{color:var(--default-header-color)}
div.tabbodyentry h3{color:var(--default-header-color)}
div.tabbodyentry h4{color:var(--default-header-color);font-style:italic}
div.tabbodyhidden{display:none}
div.tabcontainer{display:inline-block}
/*div.tabbodyentrywider{max-width:none !important;width:max-content}*/

form.standardForm{display:inline}
form.standardForm table{margin-bottom:15px}
form.standardForm table tr td{vertical-align:top}
form.standardForm input[type=text],form.standardForm input[type=email],form.standardForm input[type=tel],form.standardForm input[type=number]{border-radius:4px;margin-bottom:7px}
form.standardForm input[type=submit]{margin-left:150px;background-color:var(--default-button-background-color);border-color:var(--default-button-border-color);color:var(--default-button-color)}
form.standardForm input[type=submit]:hover{background-color:White}

form.standardForm input.loeschen{margin-left:250px;background-color:var(--default-button-background-color);color:var(--default-button-delete-color)}
form.standardForm select{padding-top:3px;padding-bottom:3px;background-color:var(--default-button-background-color);border:1px solid var(--default-button-border-color);border-radius:4px;margin-bottom:7px}
form.standardForm input + select{margin-left:7px;margin-right:7px}
form.standardForm input::file-selector-button{border:1px var(--default-button-border-color) solid;color:var(--default-button-color);background-color:var(--default-button-background-color);border-radius:3px}

form.inlineForm input[type=submit]{background-color:var(--default-button-background-color);color:darkgreen}
form.inlineForm input.loeschen{background-color:var(--default-button-background-color);color:#e30613}
form.crosslist input[type=submit]{border:none;color:var(--default-button-delete-color);background-color:transparent}
form.filterForm select{border:1px DarkGreen solid;background-color:LemonChiffon;border-radius:3px}
form.filterForm > div{display:flex;margin-bottom:15px}
form.filterForm > div > div{margin-right:15px}

table.anchorTable{anchor-name: --tab-width-anchor}

table.standardList tr:first-child{line-height:1.8em;font-style:italic}
table.standardList tr:not(:first-child){line-height:1.5em}
table.standardList tr:nth-child(odd){background-color:LemonChiffon;color:DarkGreen}
table.standardList tr th{text-align:left;font-weight:normal}
table.standardList tr th form{display:inline;margin-left:7px}
table.standardList tr:nth-child(even) td:first-child input[type=submit]{color:Black}
table.standardList tr:nth-child(even) input[type=submit]:hover{color:red}
table.standardList tr:nth-child(odd) td:first-child input[type=submit]{color:DarkGreen}
table.standardList tr:nth-child(odd) input[type=submit]:hover{color:red}
table.standardList button[type=submit]:hover{color:red}
table.standardList input[type=submit]{border:none;background-color:transparent;cursor:pointer;padding-left:0;font-size:1em;vertical-align:top}
table.standardList button[type=submit]{border:none;background-color:transparent;cursor:pointer;padding-left:0;font-size:1em;vertical-align:top;text-align:left}
table.standardList tr td{vertical-align:top}
table.guestList th{text-align:left;font-weight:normal;font-style:italic}
table.guestList tr:nth-child(odd){background-color:AliceBlue;color:navy}
table.guestList input[type=submit]{border:none;background-color:transparent;cursor:pointer;padding-left:0;font-size:1em;vertical-align:top}

table.historyList{font-size:.8em}

table.standardDetails{table-layout:fixed}
table.standardDetails tr td{padding:5px}
table.standardDetails tr td:first-child{vertical-align:top;text-align:right;font-style:italic}

div.guestDetails > div{border-top:1px solid AliceBlue;background-image:linear-gradient(AliceBlue, white)}
div.guestDetails > div select {border:1px Navy solid;color:navy;background-color:AliceBlue;border-radius:3px}
div.guestDetails + input[type=submit],form.guestDetails input[type=submit]{border:1px Navy solid;color:navy;background-color:AliceBlue;border-radius:3px}
div.guestDetails + input::file-selector-button,form.guestDetails input::file-selector-button{border:1px Navy solid;color:navy;background-color:AliceBlue;border-radius:3px}
#personenSucheTeam button{border:1px Navy solid;color:navy;background-color:AliceBlue;border-radius:3px}

div.adminDetails > div{border-top:1px solid LemonChiffon;background-image:linear-gradient(LemonChiffon, white)}
div.adminDetails > div select {border:1px DarkGreen solid;background-color:AliceBlue;border-radius:3px}
div.adminDetails + input[type=submit]{color:DarkGreen;background-color:AliceBlue}
div.standardDetails > div{display:flex;flex-wrap:wrap;border-radius:5px 5px 0 0}
div.standardDetails > div > div{margin:7px}
div.standardDetails > div > div:first-child{vertical-align:top;text-align:right;font-style:italic}
div.guestDetails > div{margin-bottom:25px}
/* first col width of div form */
div.firstColWidth100 > div > div:first-child{width:100px}

table.standardDetails textarea.standardTextArea{width:500px;height:100px}
@media only screen and (max-width:500px){
	div.standardDetails > div{width:min-content}
	div.standardDetails > div > div:first-child{width:250px} 
	div.standardDetails > div > div textarea.standardTextArea{width:450px;height:300px} 
	div.standardDetails > div > div textarea.changedTextArea{width:450px} 
	div.guestDetails > div{min-width:90%}
	div.tabcontainer{}
	div.listHeader{}
}	
@media only screen and (min-width:501px) and (max-width:800px){
	div.standardDetails > div{width:min-content}
	div.standardDetails > div > div:first-child{width:250px} 
	div.standardDetails > div > div textarea.standardTextArea{width:700px;height:300px} 
	div.standardDetails > div > div textarea.changedTextArea{width:700px}
	div.guestDetails > div{min-width:90%}
	div.tabcontainer{}
	div.listHeader{}
}	
@media only screen and (min-width:801px) and (max-width:1000px){
	div.standardDetails > div{width:max-content}
	div.standardDetails:not(div.firstColWidth100) > div > div:first-child{width:150px} 
	div.standardDetails > div > div textarea.standardTextArea{width:700px;height:200px} 
	div.standardDetails > div > div textarea.changedTextArea{width:700px} 
	div.tabcontainer{}
}	
@media only screen and (min-width:1001px){
	div.standardDetails > div{width:max-content}
	div.standardDetails:not(div.firstColWidth100) > div > div:first-child{width:200px} 
	div.standardDetails > div > div textarea.standardTextArea{width:700px;height:200px} 
	div.standardDetails > div > div textarea.changedTextArea{width:700px} 
	div.tabcontainer{}
	div.tabbody{}
	div.listHeader{max-width:1000px}
}	

@media only screen{
	div.tabheader{display:flex}
	div.tabheader div{border-top:1px solid green;border-right:1px solid green;padding:3px 8px 3px 8px;border-radius:0 9px 0 0}
	div.tabheaderentry{display:inline;cursor:pointer;color:black;background-color:LemonChiffon;border-bottom:1px solid green}
	div.tabheaderentry:first-child{border-left:1px solid green}
	div.tabheaderselect{color:white;background-color:green}
	div.tabbody{border:2px solid green;border-radius:0 9px 9px 7px;padding:0px 5px 0px 5px}
	div.tabbody details summary.h3{color:var(--default-header-color);font-weight:bold}
	div.tabbody details{margin-top:15px}
	div.tabbody details summary{color:var(--default-button-color);cursor:pointer}
	div.tabbody > div > p{width:70%}
	div.tabbody > div > div.listHeader{width:80%}
	div.tabbody > div > div.listHeader > div:first-child{max-width:50%}
	div.tabbodyentry > div.elementList{display:flex;flex-wrap:wrap}
	div.tabbodyentry > div.elementList > div{border:1px solid green;border-radius:3px;padding:0 15px 15px 15px;margin-right:15px;margin-top:15px}
	div.tabbodyentry > div.elementList > div > h3{font-weight:normal;font-style:italic}

	div.tabcontainer{padding-bottom:7px}
}
@media only print{
	div.tabheader{display:none}
}

div.listHeader{margin-left:10px;margin-bottom:15px;display:flex;justify-content:space-between}
div.listHeader > div > form > div{width:max-content;font-size:.8em;max-width:500px}
div.listHeader > div > form > div > div{display:flex;flex-wrap:wrap;justify-content:flex-end;column-gap:7px;padding-bottom:3px}
div.listHeader > div > form > div > div > div:first-child{width:max-content;text-align:right;padding-top:2px}
div.listHeader > div > form > div > div > div:nth-child(2){text-align:right}
div.listHeader > div > form select{border:1px DarkGreen solid;background-color:LemonChiffon;border-radius:3px}
div.listHeader > div:nth-child(2) > div{display:flex;justify-content:flex-end;column-gap:7px;padding-bottom:3px}