:root {
    --table-hover-background: #e6eae8;
    --table-border-color: #e6eae8;
}

body { display: flex; flex-direction: column; min-height: 100vh; background-color: #f8f8f8; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; }

#header { box-shadow: none; height: 60px; border: none; }
#headerContent { height: 50px; }

#headerMenu { height: 50px; width: 50px; }
#headerMenuHead { height: 50px; width: 50px; border-radius: 25px; transition: none; }
#headerMenuHead:focus { background-color: white; transition: none;  }
#headerMenuHead:hover { background-color: white; transition: none; }
#headerMenuHead > i { margin: 9px 11px; }
#headerMenuMenu { top: 55px; width: 220px; padding: 0; position: absolute; z-index: 1; display: none; opacity: 1; box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2); background: white; overflow: hidden; }
#subMenuMain > li:last-child {
    margin-bottom: 30px;
}
#headerMenuMenu.open { display: block; }

#headerMenuUser { top: 50px; }

#headerMenu { height: 50px; width: 50px; }

#header_links_dashboard:focus { color:white; }

i.header { font-size: 32px; }

#headerLogo { padding: 5px; margin-left: 5px; margin-right: -15px; }
#headerLogo img { height: 40px; }
div.headerSection { margin: 15px 5px; }

div.headerSection.left.mobile { left: 110px; }

div.headerShift { margin: 5px 0px 0px 10px; }
div.headerShift select { float: left; padding: 10px; }

#clubName { position: relative; }
#menu_head_chevron_down { width: 15px; display: block; }
#header_menu_club_list { top: 50px; box-shadow: none; }

#headerRightSection { height: 60px; padding: 10px 10px 10px 15px; background: unset; }
#headerSearchBar { margin: 0 0 0 10px; }

#main_container { flex: 1 1 auto; }

div.scoi_split { margin-top: 10px; }
div.scoi_section { border: solid #e6eae8 2px; border-radius: 6px; box-shadow: none; }
div.scoi_section h3 { background: #e6eae8; background-image: unset; }
div.scoi_section div.information { margin: 15px 20px; padding: 20px; width: calc(100% - 40px); border: none; border-radius: 6px; }
div.scoi_section div.information p { margin: 0; }

div.scoi_section div.information.red { background-color: #eaa9a9; }

div.scoi_section code { margin: 15px 20px; padding: 20px; width: calc(100% - 40px); border: none; border-radius: 6px; }

div.input6 input, div.input6 select, div.input6 textarea {border: 2px solid #e6eae8; background: white; }
div.input6 input[type=button]:hover, div.input6 input[type=button]:focus { box-shadow: none; }
div.input6 input[type=submit]:hover, div.input6 input[type=submit]:focus { box-shadow: none; }
div.input6.label input { margin: 21px 0 0 0; }

div.input6 > div.chosen-container > ul.chosen-choices { border: 2px solid #e6eae8; background: white; }

div.input6 > div.selections > span {
    padding: 3px;
    margin: 2px;
    float: left;
}
div.input6 > div.selections > span:hover {
    cursor: default;
    border: 1px solid;
}

.button-tiny { border: 1px solid #e6eae8; color: #2f6e7f; background: white; border-radius: 4px; }

.button-green:hover, .button-green:focus { border-color: black !important; }
.button-red:hover, .button-red:focus { border-color: black !important; }
.button-black:hover, .button-black:focus { border-color: black !important; }
.button-orange:hover, .button-orange:focus { border-color: #FF9900 !important; }
.button-blue:hover, .button-blue:focus { border-color: #3883fd !important; }
.button-disabled { border-color: #f5f5f5 !important; }

.button-bg-red { background: red !important; color: white !important; }
.button-bg-green { background-color: green !important; color: white !important; }


table { margin: 5px 0 10px 0; border-spacing: 0; }
table td { padding: 4px; }
table th:first-child, table td:first-child { padding-left: 10px;}
table th:last-child, table td:last-child { padding-right: 10px;}
table .button-tiny:not(.hidden) { float: unset; display: inline; margin: 2px; }
table select { float: unset; }

table select, table input {
    border: 1px solid #e6eae8;
    border-radius: 4px;
    background: #ffffff;
    padding: 2px;
    cursor: pointer;
    height: 26px;
    box-sizing: border-box;
}

table input[type='number'] {
    text-align: right;
}

table select:disabled, table input:disabled{
    background: transparent;
    border: transparent;
    cursor: default;
}

table input[type='number'] {
    text-align: right;
    padding-right: 0;
}

table input[type='number']::-webkit-inner-spin-button {
    margin-left: 5px;
    margin-top: -4px;
    margin-bottom: -4px;
}

table select:not(:disabled):hover, table select:not(:disabled):focus {
    background: #2f6e7f;
    outline: none;
    color: #eeeeee;
    border-color: #2f6e7f;
}

table input:not(:disabled):hover, table input:not(:disabled):focus {
    background: #2f6e7f;
    color: #eeeeee;
    outline: none;
    border-color: #6698FF;
    box-shadow: 0 0 10px #6698FF;
}


/*table.hover tbody tr:hover, table.hover tbody tr:focus-within, table :is(thead, tfoot) tr:has( :is(th, td).row-hover:hover ) { background-color: #e6eae8; }*/

/* Table Row Hovering
Highlights row if hovered on, ignores table header and footer rows if column hovering is enabled
  - Enabled with .hover or .hover-row on table
  - Disabled single cell hover with .no-hover or .no-hover-row
  - Disabled highlighting on single cell with .no-highlight or .no-highlight-row
*/
table.hover :is(thead, tfoot):hover tr { background-color: unset; }
table.hover tbody tr:hover { background-color: unset; }

table:is(.hover, .hover-row) tbody tr:has( :is(th, td):not(.no-hover, .no-hover-row):is(:hover, :focus-within)) :is(th,td):not(.no-highlight, .no-highlight-row) { background-color: var(--table-hover-background); }
table.hover-row :is(thead, tfoot) tr:has( :is(th, td):not(.no-hover, .no-hover-row):is(:hover, :focus-within)) :is(th,td):not(.no-highlight, .no-highlight-row) { background-color: var(--table-hover-background); }
table.hover :is(thead, tfoot) tr:has( :is(th, td):not(.no-hover).hover-row:hover) :is(th, td):not(.no-highlight, .no-highlight-row) { background-color: var(--table-hover-background); }


/* Table Column Hovering
Highlights column if hovered on cell in table header or footer.
  - Enable with .hover or .hover-col on table
  - Disable single cell hover with .no-hover or .no-hover-col
  - Disabled highlighting on single cell with .no-highlight or .no-highlight-col
*/
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(1),  .merged.col-1:hover):hover)  :is(:is(th, td):not(.merged):nth-child(1),  .merged.col-1):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(2),  .merged.col-2:hover):hover)  :is(:is(th, td):not(.merged):nth-child(2),  .merged.col-2):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(3),  .merged.col-3:hover):hover)  :is(:is(th, td):not(.merged):nth-child(3),  .merged.col-3):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(4),  .merged.col-4:hover):hover)  :is(:is(th, td):not(.merged):nth-child(4),  .merged.col-4):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(5),  .merged.col-5:hover):hover)  :is(:is(th, td):not(.merged):nth-child(5),  .merged.col-5):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(6),  .merged.col-6:hover):hover)  :is(:is(th, td):not(.merged):nth-child(6),  .merged.col-6):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(7),  .merged.col-7:hover):hover)  :is(:is(th, td):not(.merged):nth-child(7),  .merged.col-7):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(8),  .merged.col-8:hover):hover)  :is(:is(th, td):not(.merged):nth-child(8),  .merged.col-8):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(9),  .merged.col-9:hover):hover)  :is(:is(th, td):not(.merged):nth-child(9),  .merged.col-9):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(10), .merged.col-10:hover):hover) :is(:is(th, td):not(.merged):nth-child(10), .merged.col-10):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(11), .merged.col-11:hover):hover) :is(:is(th, td):not(.merged):nth-child(11), .merged.col-11):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(12), .merged.col-12:hover):hover) :is(:is(th, td):not(.merged):nth-child(12), .merged.col-12):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(13), .merged.col-13:hover):hover) :is(:is(th, td):not(.merged):nth-child(13), .merged.col-13):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(14), .merged.col-14:hover):hover) :is(:is(th, td):not(.merged):nth-child(14), .merged.col-14):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(15), .merged.col-15:hover):hover) :is(:is(th, td):not(.merged):nth-child(15), .merged.col-15):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(16), .merged.col-16:hover):hover) :is(:is(th, td):not(.merged):nth-child(16), .merged.col-16):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(17), .merged.col-17:hover):hover) :is(:is(th, td):not(.merged):nth-child(17), .merged.col-17):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(18), .merged.col-18:hover):hover) :is(:is(th, td):not(.merged):nth-child(18), .merged.col-18):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(19), .merged.col-19:hover):hover) :is(:is(th, td):not(.merged):nth-child(19), .merged.col-19):not(.no-highlight, .no-highlight-col),
table:is(.hover, .hover-col):has( :is(thead, tfoot) :is(th, td):is(:not(.merged, .no-hover, .no-hover-col):nth-child(20), .merged.col-20:hover):hover) :is(:is(th, td):not(.merged):nth-child(20), .merged.col-20):not(.no-highlight, .no-highlight-col)
{
    background-color: var(--table-hover-background);
}

table.chunky tr { height: 50px; }

table.styled:first-child { margin-top: 0 }
table.styled:first-child :is(thead, tbody, tfoot):first-child tr:first-child :is(th, td) { padding-top: 9px; }

table.styled:not(:first-child) { border-top: solid 2px var(--table-border-color); }
table.styled:not(:last-child) { border-bottom: solid 2px var(--table-border-color); }
table.styled thead tr:last-child th { border-bottom: 2px solid var(--table-border-color); }
table.styled tfoot tr:first-child th { border-top: 2px solid var(--table-border-color); padding-top: 16px;}

table.styled :is(th, td).col-section-start{ border-left: 1px solid var(--table-border-color); }
table.styled :is(th.left, td:not(.right)).col-section-start { padding-left: 10px; }
table.styled :is(th,td).right:has( + :is(th, td).col-section-start) { padding-right: 10px; }

table.styled :is(th, td).col-section-end{ border-right: 1px solid var(--table-border-color); }
table.styled :is(th, td).col-section-end.right { padding-right: 10px; }
table.styled td.col-section-end + :is(th.left, td:not(.right)) { padding-left: 10px; }

table.styled tr.row-section-head :is(th, td) { padding-top: 24px; border-bottom: 1px solid var(--table-border-color); border-top: 1px solid transparent;}
table.styled tr.row-section-head:not(:first-child) :is(th, td) {border-top: 1px solid var(--table-border-color); }
table.styled tr.row-section-foot :is(th, td) { padding-top: 10px; border-top: 1px solid var(--table-border-color); }
table.styled tr.row-section-foot:not(:last-child) :is(th, td) { padding-top: 10px; border-bottom: 2px solid var(--table-border-color); }

table.styled tr.row-section-head:has(> th:first-child:last-child) { display: block; margin-bottom: 45px; }
table.styled tr.row-section-head th:first-child:last-child { position: absolute; left: 0; right: 0; z-index: 2; }
table.styled:first-child tbody:first-child tr.row-section-head:first-child:has(> th:first-child:last-child) { margin-bottom: 30px; }


.txt-center { text-align: center;}

div.form_section { overflow: visible; display: flow-root; }
div.form_section:not(:last-child) { border-bottom: solid 2px #e6eae8; }

footer { padding: 20px; color: white; }
footer .details { display: flex; flex-direction: row-reverse; align-items: center; padding: 0 10px; border-bottom: solid 1px white;}
footer .details .contact { flex: 0 1 auto; font-size: 15px; line-height: 1.7; }
footer .details .logo { flex: 0 1 auto; padding: 5px 30px; }
footer .details .logo img { height: 80px; }
footer .smallprint { display: flex; padding: 0 10px; align-items: center}
footer .smallprint .logo { padding-right: 20px; }
footer .smallprint .logo img { height: 60px; }
footer .smallprint .company { flex: 1 1 auto; line-height: 1.7; }
footer .smallprint .copyright { flex: 1 1 auto; line-height: 1.7; text-align: right; }

footer a { color: white; flex: 0 1 auto; }
footer a.email:not(:last-child) { border-right: solid 1px white; padding-right: 10px; }
footer a.email + a.web { padding-left: 10px; }
footer a:hover, footer a:focus { text-decoration: underline; color: white; }

@media (max-width: 649px) {
    footer { padding-bottom: 100px; }
}

#cookiesBox { box-shadow: none; }
#cookiesBox button:hover, #cookiesBox button:focus { box-shadow: none; }

/*input,select,textarea { border-color: #423f8f; }*/
div.noborder { border: none; }

div.input6 div.scoi_item_boxes {
    float: right;
    align-content: start;
    width: calc(100% - 10px);
    padding: 5px;
}

div.input6 div.scoi_item_box {
    border: 1px solid grey;
    font-size: 11px;
    float: left;
    padding: 5px;
    margin: 2px;
    width: fit-content;
    clear: none;
}

div.scoi_item_boxes div.scoi_item_box:hover {
    color: grey;
    cursor: pointer;
}

div.scoi_item_boxes span.remove {
    padding-left: 2px;
}

div.scoi_section_corner.topleft {
    position: absolute;
    text-align: right;
    width: calc(100% - 20px);
    margin: 10px;
}

div.scoi_section_corner.topright {
    position: absolute;
    text-align: right;
    width: calc(100% - 20px);
    margin: 10px;
}

div.scoi_section_corner.bottomleft {
    position: absolute;
    bottom: 0;
    text-align: left;
    width: calc(100% - 20px);
    margin: 10px;
}

div.scoi_section_corner.bottomright {
    position: absolute;
    bottom: 0;
    text-align: right;
    width: calc(100% - 20px);
    margin: 10px;
}

div.scoi_account_row {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    min-height: 35px;
}

div.scoi_account_row:hover {
    background-color: var(--table-hover-background);
}

div.scoi_account_row div.details {
    width: calc(100% - 100px);
    padding: 5px;
}

div.scoi_account_row div.details p {
    padding: 0 0 5px 0;
    margin: 0;
}

div.scoi_account_row div.amount {
    width: 100px;
    text-align: right;
}

div.scoi_account_row div.amount p {
    padding: 5px;
    margin: 0;
    font-size: 16px;
}

#scoiFramerCAWI {
    border-style: none;
    width: 100%;
}

#SampleJsonGroup {
    margin: 10px;
    border: 2px solid rgb(230, 234, 232);
    float: left;
    border-radius: 4px;
    width: calc(100% - 24px);
    display: block;
}
#SampleJsonGroup > p {
    margin: 10px;
    font-size: 14px;
    font-weight: 600;
    user-select: none;
    color: #333;
}

div.scoi_section .content.tab_content > p { margin-top: 12px; margin-bottom: 12px; }