:root {
    --etc-blue: #38a3c2;
    --etc-dark-gray: #464e5a;
    --etc-text-gray: #909090; /* 707070 */
    --etc-med-gray: #909090;
    --etc-light-gray: #f8f9fb;
    --etc-green: #009b4e;
    --etc-main-background: #f5f6fa;
    --etc-chatbutton-selected: #52d36f;
    --frame-color: #cccccc;
    --frame-borderstyle: solid;
    --etc-chat-selected: lemonchiffon;
    --etc-fonts: verdana, arial, helvetica, sans-serif;
    --table-header-fontsize: 12pt;
    --etc-maintitle-size: 18pt;
    --etc-title-size: 16pt;
    --etc-text-size: 14pt;
    --etc-text-size-small: 12pt;
    --etc-text-size-verysmall: 10pt;
    --etc-maintitle-color: #464e5a;
    --etc-title-color: #464e5a;
    --etc-text-color: #707070; /*#203459;*/
    --etc-tab-label-size: 16pt;
}

.mainbody {
    color: var(--etc-text-color);
    background-color: var(--etc-main-background);
    font-family: var(--etc-fonts);
    font-size: var(--etc-text-size);
    line-height: 1.3em;
    text-align: left;
    margin: 0px;
    margin-top: 0px;
    padding: 0px;
    text-align: left;
    background-position: bottom left;
    background-attachment: fixed;
    background-repeat: no-repeat;
}


.bubble {
    text-align: left;
    border: 0px;
    border-radius: 15px;
    background-color: white;
    border-color: white; /* var(--frame-color); */
    /*    border-bottom-style: solid;
    border-right-style: solid;
    border-bottom-width: 1px;
    border-right-width: 1px;
*/
    margin-top: 10px;
}
.bubble2 {
    text-align: left;
    border: 0px;
    border-radius: 15px;
    background-color: white;
    border-color: var(--frame-color);
    border-bottom-style: solid;
    border-right-style: solid;
    border-bottom-width: 3px;
    border-right-width: 3px;
    margin-top: 10px;
}


.toptext {
    text-align: left;
    color: var(--etc-title-color);
    font-size: var(--etc-title-size);
    font-weight: bold;
    margin-top: 10px;
    margin-left: 10px;
    font-family: var(--etc-fonts);
}

.textarea {
    color: var(--etc-text-color);
    margin-left: 10px;
    margin-right: 10px;
    font-size: var(--etc-text-size-small);
    font-family: var(--etc-fonts);
}
.steparea {
    color: var(--etc-text-color);
    margin-left: 30px;
    margin-right: 10px;
    font-size: var(--etc-text-size-small);
    font-family: var(--etc-fonts);
}

.agreecheck {
/*    text-indent: hanging 20px;
*/    color: var(--etc-text-color);
/*    margin-left: 20px;
*/    
/*text-indent: -40px;*/
    /*text-indent: hanging;*/
    margin-right: 10px;
    font-size: var(--etc-text-size-verysmall);
    font-family: var(--etc-fonts);
}

.headerbar {
    background-color: white;
    box-shadow: 1px 1px 4px;
}
.maintitle {
    font-size: var(--etc-maintitle-size);
    color: var(--etc-text-color);
    margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 10px;
}
.mainframe {
    text-align: left;
    border-color: Black;
    border-width: 1px;
    min-width: 950px;
    width: 100%;
    /*background-color: #f2f2f2;*/
}
.bubbletitle {
    font-size: var(--etc-title-size);
    color: var(--etc-title-color);
    text-align: center;
    margin-top: 10px;
}

.bubbletitleleft {
    font-size: var(--etc-title-size);
    color: var(--etc-text-color);
    text-align: left;
    margin-top: 10px;
    margin-bottom: 1px;
}
.inputbox {
    width: 300px;
    box-sizing: border-box;
    font-size: var(--etc-text-size);
    color: #000000;
    font-family: var(--etc-fonts);
    background-color: var(--etc-light-gray);
    border-radius:5px;
    border: outset 1px #EAF8FF;
}
.regbutton {
    width: 300px;
    height: 30px;
    border-radius: 5px;
    color: #FFF;
    background-color: #38A3C2;
    border-color: #38A3C2;
    /*    background-color: #33C3F0;
    border-color: #33C3F0;
*/
}

.regimg {
    height:600px;
    width:400px;
    object-fit:fill;
}