body { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 95%;
} 

p {
    width: 500px;
}
.preference_profile {
    display: flex;
    justify-content: space-between;
    width: 470px;
    margin: .5rem;
}            
.preference {
    display: flex;
    justify-content: space-between;
    width: 340px;
    margin: .5rem;
}            
.preference_hint {
    margin-left: 90px;
}      
.text_input {
    width: 260px;
}
.text_input_remote {
    width: 165px;
}
.text_input_port {
    width: 60px;
}
.label_bold {
    font-weight: bold;
}
.small_font {
    font-size: smaller;
}
details {
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 0.5em 0.5em 0;
    width: 430px;
}
/* 
    background-color:rgb(193, 229, 252);
*/
summary {
    font-weight: bold;
    margin: -0.5em -0.5em 0;
    padding: 0.5em;
}

details[open] {
    padding: 0.5em;
}

details[open] summary {
    border-bottom: 1px solid #aaa;
    margin-bottom: 0.5em;
}
.output {
    font-weight: bold;
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 0.5em 0.5em 0.5em;
    width: 430px;
    margin-bottom: 0.5em;
    background-color: rgb(241, 238, 238);
}