/* CSS Document
   Black branded Performers / Officials theme - refreshed
   Structurally based on the proven Yellowstyle.css layout.
   Designed to replace blackstyle.css without changing ASP/HTML.
*/

body {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    background: #f1f1f1;
    background: linear-gradient(to bottom, #171717 0px, #2a2a2a 58px, #f1f1f1 58px, #fafafa 260px, #ffffff 520px);
    color: #3f3f3f;
}

.pngfix {
    behavior: url(images/iepngfix.htc);
}

p, h1, h2, h3, h4, h5, h6, ul, li {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

div {
    margin: 0px;
    padding: 0px;
}

form {
    margin: 0;
    padding: 0;
}

.cont {
    width: 980px;
    margin: 0px auto;
    padding: 0px;
}

/* General text/editing classes */
.tabrowheader,
.tabrowdata,
.edittitle,
.editlabel,
.editlabel2,
.editnote,
.editor2 {
    font-family: Arial, Helvetica, sans-serif;
    color: #3f3f3f;
}

.tabrowheader {
    font-weight: bold;
    font-size: 14px;
    margin: 5px 2px 5px 5px;
}

.tabrowdata {
    font-weight: normal;
    font-size: 12px;
    margin: 5px 2px 5px 5px;
}

.edittitle {
    font-weight: bold;
    font-size: 14px;
    margin: 5px 2px 5px 2px;
    float: left;
    color: #242424;
}

.editlabel {
    font-weight: normal;
    font-size: 14px;
    margin: 5px 2px 5px 5px;
    float: left;
}

.editlabel2 {
    font-weight: normal;
    font-size: 14px;
    margin: 5px 2px 5px 25px;
    float: left;
}

.editnote {
    font-weight: normal;
    font-size: 12px;
    margin: 5px 0px 5px 15px;
    float: left;
    color: #6b6b6b;
}

.editor2 {
    font-weight: normal;
    font-size: 14px;
    float: left;
}

/* Header */
.header_top {
    height: 58px;
    width: 980px;
    background: #171717;
    background: linear-gradient(to right, #101010, #333333);
}

.logo {
    float: left;
    padding-top: 6px;
}

.top_online_registration_txt {
    float: right;
    padding-top: 6px;
    color: #f5f5f5;
    text-align: right;
    line-height: 22px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
}

.top_online_registration_txt p {
    color: #f5f5f5;
}

.banner_area {
    height: 184px;
    width: 980px;
    background: #d1a62c;
    border-bottom: 4px solid #aa7f10;
}

.banner_area img {
    display: block;
}

/* Top menu */
.top_menu_area {
    height: 36px;
    width: 980px;
    float: left;
    background: #c89d2c;
    border-bottom: 1px solid #9a7413;
}

.top_menu_area ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

.top_menu_area ul li {
    float: left;
}

.top_menu_area ul li a {
    text-decoration: none;
    display: block;
    color: #242424;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding: 9px 9px 0px 9px;
    text-align: center;
    height: 25px;
    float: left;
}

.top_menu_area ul li a:hover,
.active {
    text-decoration: none;
    color: #ffffff;
    background: #242424;
}

/* Main body */
.body_con {
    width: 980px;
}

.body_space {
    width: 980px;
    height: 9px;
}

.body_area_left {
    width: 202px;
    float: left;
}

.body_area_right {
    width: 776px;
    float: left;
}

/* Left area */
.left_top_area {
    width: 188px;
}

.left_area_space {
    width: 188px;
    height: 15px;
}

.left_top_area_top {
    width: 188px;
    height: 43px;
    background: #171717;
    background: linear-gradient(to bottom, #333333, #171717);
    border-radius: 10px 10px 0 0;
    border: 1px solid #080808;
    border-bottom: none;
}

.left_top_area_top h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 15px;
    color: #ffffff;
    padding-top: 14px;
    padding-left: 2px;
    letter-spacing: 0.3px;
}

.left_top_area_top h1 a {
    color: #ffffff !important;
    text-decoration: none;
}

.left_top_area_down {
    width: 184px;
    background: #fafafa;
    border: 1px solid #c9c9c9;
    border-top: none;
    padding: 0 1px 2px 1px;
    box-shadow: 0 2px 8px rgba(20, 56, 101, 0.12);
}

.left_top_area_down h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #242424;
    line-height: 18px;
    padding-bottom: 5px;
}

.left_top_area_down h2,
.left_top_area_down h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #565656;
}

.left_top_area_down h2 {
    font-size: 12px;
}

.left_top_area_down h3 {
    font-size: 12px;
    padding: 0 0 10px 0;
}

/* Left navigation buttons - compact, with icon/text vertically aligned.
   These are also commonly defined in NavStyle.css, so !important helps keep the black theme consistent. */
table.buttons {
    width: 180px !important;
    border-collapse: separate !important;
    border-spacing: 0 2px !important;
}

table.buttons td {
    padding: 0 !important;
}

table.buttons a,
table.buttons a.xBlue,
table.buttons a.xRed,
table.buttons a.xPurple {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    min-height: 25px !important;
    width: 176px !important;
    margin: 1px 2px !important;
    padding: 4px 6px !important;
    color: #242424 !important;
    background: #f3f3f3 !important;
    border: 1px solid #c8c8c8 !important;
    border-radius: 5px !important;
    text-decoration: none !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    font-weight: bold !important;
    line-height: 14px !important;
    white-space: normal !important;
}

table.buttons a:hover,
table.buttons a.xBlue:hover,
table.buttons a.xRed:hover,
table.buttons a.xPurple:hover {
    color: #ffffff !important;
    background: #333333 !important;
    border-color: #171717 !important;
}

table.buttons a.xRed {
    background: #d1a62c !important;
    border-color: #ad8216 !important;
    color: #171717 !important;
}

table.buttons a.xRed:hover {
    color: #ffffff !important;
    background: #333333 !important;
    border-color: #171717 !important;
}

table.buttons img {
    flex: 0 0 auto !important;
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    margin: 0 5px 0 0 !important;
    vertical-align: middle !important;
}

/* Inputs */
.name_input {
    width: 218px;
    background: #ffffff;
    border: 1px solid #aaaaaa;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #3f3f3f;
    padding: 10px;
    text-transform: none;
    margin: 5px 0 5px 0;
}

.sky_input,
.sky_select {
    background: #ffffff;
    border: 1px solid #aaaaaa;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #3f3f3f;
    padding: 3px;
    text-transform: none;
    margin: 5px 0 5px 0;
    float: left;
}

.sky_input:focus,
.sky_select:focus,
.name_input:focus {
    outline: none;
    border-color: #333333;
    box-shadow: 0 0 0 2px rgba(246, 196, 69, 0.45);
}

.sky_radio {
    background: none;
    margin: 5px 5px 5px 0;
    float: left;
}

.sky_check {
    background: #f3f3f3;
    margin: 5px 5px 0px 5px;
    float: left;
}

.sky_table {
    border: 1px solid #d1d1d1;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #3f3f3f;
    padding: 1px;
    text-transform: none;
    margin: 5px 0 5px 0;
    background: #ffffff;
}

/* Full width area */
.full_area_space {
    width: 970px;
    height: 15px;
}

.full_top_area {
    width: 976px;
}

.body_area_full p {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #76570d;
}

.body_area_full h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #242424;
    padding-top: 15px;
    padding-left: 25px;
    font-weight: normal;
}

.full_top_area_top_imgL,
.full_top_area_top_imgM,
.full_top_area_top_imgR {
    width: 976px;
    height: 39px;
    background: #d1a62c;
    background: linear-gradient(to bottom, #444444, #c89d2c);
    border-radius: 10px 10px 0 0;
    border: 1px solid #111111;
    border-bottom: none;
}

.full_top_area_top_imgL p,
.full_top_area_top_imgM p,
.full_top_area_top_imgR p {
    padding-top: 12px;
    padding-left: 18px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #242424;
}

.full_top_area_top_tab {
    width: 300px;
    padding-top: 0px;
    padding-left: 18px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #242424;
}

.full_top_area_down_img {
    width: 936px;
    background: #ffffff;
    border: 1px solid #d1d1d1;
    border-top: none;
    padding: 15px 20px;
    box-shadow: 0 2px 10px rgba(20, 56, 101, 0.08);
}

.full_top_area_down_img h1 span {
    font-size: 18px;
}

.full_top_area_down_img h1 {
    padding-top: 9px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #242424;
}

.full_top_area_down_img p {
    padding-top: 9px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #565656;
}

.full_top_area_down_img ul {
    width: 816px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.full_top_area_down_img ul li,
.full_top_area_down_img ul li.sky {
    width: auto;
    list-style: none;
    margin: 0;
    padding: 1px 0 10px 25px;
    background: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #565656;
}

.full_top_area_down_img ul li:before,
.full_top_area_down_img ul li.sky:before {
    content: "\2605";
    color: #aa7f10;
    margin-left: -20px;
    padding-right: 7px;
}

.full_down_txt_bg_img {
    width: 856px;
    background: #f1f1f1;
    border: 1px solid #d1d1d1;
    float: left;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

.full_down_txt_bg_img h1 {
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    margin-left: 18px;
    margin-top: 20px;
    color: #242424;
}

.full_down_txt_bg_img h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    margin-left: 28px;
    margin-right: 20px;
    margin-top: 20px;
    color: #333333;
}

.full_down_txt_bg_img h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 12px;
    margin-left: 28px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #3f3f3f;
}

.full_down_txt_bg_img h3 span {
    color: #000000;
}

/* Right content area */
.right_area_space {
    width: 770px;
    height: 15px;
}

.right_top_area {
    width: 776px;
}

.body_area_right p {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #76570d;
}

.body_area_right h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #242424;
    padding-top: 15px;
    font-weight: normal;
}

.right_top_area_top_img {
    width: 776px;
    height: 39px;
    background: #d1a62c;
    background: linear-gradient(to bottom, #444444, #c89d2c);
    border-radius: 10px 10px 0 0;
    border: 1px solid #111111;
    border-bottom: none;
}

.right_top_area_top_img p,
.right_top_area_top_img h1 {
    padding-top: 12px;
    padding-left: 18px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #242424;
}

.right_top_area_down_img {
    width: 736px;
    background: #ffffff;
    border: 1px solid #d1d1d1;
    border-top: none;
    padding: 15px 20px;
    box-shadow: 0 2px 10px rgba(20, 56, 101, 0.08);
}

.right_top_area_down_img h1 span {
    font-size: 18px;
}

.right_top_area_down_img h1 {
    padding-top: 9px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #242424;
}

.right_top_area_down_img h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #242424;
    padding: 6px 0;
}

.right_top_area_down_img h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #242424;
    padding: 6px 0 2px 0;
}

.right_top_area_down_img p {
    padding-top: 9px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #565656;
}

.right_top_area_down_img table {
    color: #3f3f3f;
}

.right_top_area_down_img td {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #3f3f3f;
}

.right_top_area_down_img hr {
    border: none;
    border-top: 1px solid #d1d1d1;
    height: 1px;
}

.right_top_area_down_img ul {
    width: 616px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.right_top_area_down_img ul li,
.right_top_area_down_img ul li.sky {
    width: auto;
    list-style: none;
    margin: 0;
    padding: 1px 0 10px 25px;
    background: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #565656;
}

.right_top_area_down_img ul li:before,
.right_top_area_down_img ul li.sky:before {
    content: "\2605";
    color: #aa7f10;
    margin-left: -20px;
    padding-right: 7px;
}

.right_down_txt_bg_img {
    width: 656px;
    background: #f1f1f1;
    border: 1px solid #d1d1d1;
    float: left;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

.right_down_txt_bg_img h1 {
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    margin-left: 18px;
    margin-top: 20px;
    color: #242424;
}

.right_down_txt_bg_img h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    margin-left: 28px;
    margin-right: 20px;
    margin-top: 20px;
    color: #333333;
}

.right_down_txt_bg_img h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 12px;
    margin-left: 28px;
    margin-right: 20px;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #3f3f3f;
}

.right_down_txt_bg_img h3 span {
    color: #000000;
}

/* Register online body right */
.reg_online_right_top_area_down_img {
    width: 716px;
    background: #ffffff;
    border: 1px solid #d1d1d1;
    border-top: solid 4px #d1a62c;
    padding: 15px 20px;
    float: left;
    margin: 0 0 15px 0;
    box-shadow: 0 2px 10px rgba(20, 56, 101, 0.08);
}

.reg_online_right_top_area_down_img h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #242424;
    padding: 0 0 10px 0;
}

.reg_online_right_top_area_down_img h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 14px;
    color: #3f3f3f;
    width: 148px;
    float: left;
}

.reg_online_right_top_area_down_img label {
    margin: 0 0 5px 0;
}

.reg_online_right_box_sm {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #3f3f3f;
    width: 50px;
    float: left;
}

.reg_online_right_big {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #3f3f3f;
    width: 590px;
    float: left;
}

.reg_online_down_btn {
    width: 650px;
}

/* Tabs used by MyMusic.asp etc. The matching tabs stylesheet may load after this, so these use !important */
ol#toc li.current a,
ol#toc li.current a span {
    background-color: #d1a62c !important;
    color: #242424 !important;
    font-weight: bold !important;
}

ol#toc li a,
ol#toc li a span {
    color: #242424 !important;
}

/* Buttons */
.submit_btn,
input[type="submit"].submit_btn,
button.submit_btn {
    background: #333333;
    background: linear-gradient(to bottom, #444444, #171717);
    padding: 5px 12px;
    margin: 0;
    font: bold 12px/16px Arial, Helvetica, sans-serif;
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid #080808;
    border-radius: 5px;
}

.submit_btn:hover,
input[type="submit"].submit_btn:hover,
button.submit_btn:hover {
    background: #c89d2c;
    color: #242424;
    border-color: #9a7413;
}

/* Footer */
.foot_con {
    width: 100%;
    height: 42px;
    background: #171717;
}

.foot_area {
    width: 980px;
    height: 42px;
    background: #171717;
    margin: 0 auto;
}

.foot_wraper {
    width: 100%;
    height: 42px;
    background: #171717;
    float: left;
    border-top: 4px solid #c89d2c;
}

.foot_txt {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding: 10px 0px 0px 34px;
    line-height: 22px;
    color: #f5f5f5;
    text-align: center;
}

.foot_txt p {
    color: #f5f5f5;
    font-size: 12px;
}

.foot_txt a {
    text-decoration: none;
    color: #ffffff;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
}

.foot_txt a:hover {
    text-decoration: underline;
    color: #444444;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
}

/* ------------------------------------------------------------------
   Performer portal nested menu fix
   Some Performer pages have a two-cell nested table inside table.buttons
   for expandable sections such as Family Members. The generic button rule
   above deliberately makes normal menu buttons 176px wide, but that is too
   wide when two anchors sit on the same row. These overrides keep the row
   inside the left menu and align the icon/text neatly.
------------------------------------------------------------------ */
.left_top_area_down {
    overflow: hidden !important;
}

/* Keep nested menu tables contained inside the 180px menu column */
table.buttons table {
    width: 100% !important;
    max-width: 180px !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
}

/* Small expand/collapse button cell */
table.buttons table td:first-child {
    width: 34px !important;
    max-width: 34px !important;
}

/* Text part of the expandable heading row */
table.buttons table td:last-child {
    width: 142px !important;
    max-width: 142px !important;
}

/* The + / - expandable button */
table.buttons table td:first-child a {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    margin: 1px 1px !important;
    padding: 3px 2px !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: hidden !important;
    white-space: nowrap !important;
}

/* The text link beside the expand/collapse button */
table.buttons table td:last-child a {
    width: 140px !important;
    min-width: 0 !important;
    max-width: 140px !important;
    margin: 1px 1px !important;
    padding: 3px 5px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

/* Include grey/green states used by the Performer portal */
table.buttons a.xGrey,
table.buttons a.xGreen {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    min-height: 25px !important;
    width: 176px !important;
    margin: 1px 2px !important;
    padding: 4px 6px !important;
    border-radius: 5px !important;
    text-decoration: none !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    font-weight: bold !important;
    line-height: 14px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

table.buttons a.xGrey {
    color: #4d4d4d !important;
    background: #eeeeee !important;
    border: 1px solid #c8c8c8 !important;
}

table.buttons a.xGreen {
    color: #242424 !important;
    background: #e6f4d8 !important;
    border: 1px solid #90b96f !important;
}

table.buttons a.xGrey:hover,
table.buttons a.xGreen:hover {
    color: #ffffff !important;
    background: #333333 !important;
    border-color: #171717 !important;
}

/* ------------------------------------------------------------------
   Performer portal: family member status colours
   The Performer menu uses xRed for two different meanings:
   1) top-level selected/important menu items such as MY Schedule / Log Out
   2) non-current family members inside #PlayerDetailsMenu
   Keep top-level xRed as the gold highlight, but make non-current
   family members a soft red/pink button.
------------------------------------------------------------------ */
#PlayerDetailsMenu a.xRed,
tbody#PlayerDetailsMenu a.xRed {
    color: #7a1f1f !important;
    background: #fde2e2 !important;
    border: 1px solid #e29a9a !important;
}

#PlayerDetailsMenu a.xRed:hover,
tbody#PlayerDetailsMenu a.xRed:hover {
    color: #ffffff !important;
    background: #b42323 !important;
    border-color: #8f1d1d !important;
}

#PlayerDetailsMenu a.xGreen,
tbody#PlayerDetailsMenu a.xGreen {
    color: #1f4f25 !important;
    background: #e6f4d8 !important;
    border: 1px solid #90b96f !important;
}

#PlayerDetailsMenu a.xGreen:hover,
tbody#PlayerDetailsMenu a.xGreen:hover {
    color: #ffffff !important;
    background: #2f7d32 !important;
    border-color: #256628 !important;
}


/* ==================================================================
   Black palette refinements
   The layout above is intentionally the same as the proven Yellow theme.
   These final rules provide the black/silver treatment and strong menu
   overrides required by the Performer and Dance Officials portals.
================================================================== */

body {
    background: #f1f1f1;
    background: linear-gradient(to bottom, #101010 0px, #292929 58px, #f1f1f1 58px, #fafafa 260px, #ffffff 520px);
    color: #3f3f3f;
}

.header_top {
    background: #151515;
    background: linear-gradient(to right, #0d0d0d, #292929);
}

.top_online_registration_txt,
.top_online_registration_txt p {
    color: #f5f5f5;
}

.banner_area {
    background: #101010;
    border-bottom-color: #a77d12;
}

.top_menu_area {
    background: #242424;
    border-bottom-color: #111111;
}

.top_menu_area ul li a {
    color: #ffffff;
}

.top_menu_area ul li a:hover,
.active {
    color: #151515;
    background: #c89d2c;
}

.left_top_area_top,
.full_top_area_top_imgL,
.full_top_area_top_imgM,
.full_top_area_top_imgR,
.right_top_area_top_img {
    background: #252525;
    background: linear-gradient(to bottom, #333333, #181818);
    border-color: #111111;
}

.left_top_area_top h1,
.left_top_area_top h1 a,
.full_top_area_top_imgL p,
.full_top_area_top_imgM p,
.full_top_area_top_imgR p,
.full_top_area_top_tab,
.right_top_area_top_img p,
.right_top_area_top_img h1 {
    color: #ffffff !important;
}

.left_top_area_down {
    background: #fafafa;
    border-color: #c9c9c9;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
}

/* Normal menu items */
table.buttons a,
table.buttons a.xBlue,
table.buttons a.xPurple {
    color: #252525 !important;
    background: #f2f2f2 !important;
    border-color: #c6c6c6 !important;
}

table.buttons a:hover,
table.buttons a.xBlue:hover,
table.buttons a.xPurple:hover {
    color: #ffffff !important;
    background: #2b2b2b !important;
    border-color: #111111 !important;
}

/* Selected / important top-level menu item */
table.buttons a.xRed {
    color: #171717 !important;
    background: #dfb638 !important;
    border-color: #b28716 !important;
}

table.buttons a.xRed:hover {
    color: #ffffff !important;
    background: #2b2b2b !important;
    border-color: #111111 !important;
}

/* Neutral and current-family states */
table.buttons a.xGrey {
    color: #4d4d4d !important;
    background: #eeeeee !important;
    border-color: #c8c8c8 !important;
}

table.buttons a.xGreen {
    color: #1f4f25 !important;
    background: #e6f4d8 !important;
    border-color: #90b96f !important;
}

table.buttons a.xGrey:hover,
table.buttons a.xGreen:hover {
    color: #ffffff !important;
    background: #2b2b2b !important;
    border-color: #111111 !important;
}

.full_top_area_down_img,
.right_top_area_down_img,
.reg_online_right_top_area_down_img {
    background: #ffffff;
    border-color: #d1d1d1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.full_down_txt_bg_img,
.right_down_txt_bg_img {
    background: #f4f4f4;
    border-color: #d1d1d1;
}

.full_top_area_down_img h1,
.right_top_area_down_img h1,
.right_top_area_down_img h2,
.right_top_area_down_img h3,
.full_down_txt_bg_img h1,
.right_down_txt_bg_img h1,
.reg_online_right_top_area_down_img h1,
.body_area_full h1,
.body_area_right h1,
.edittitle {
    color: #242424;
}

.full_down_txt_bg_img h2,
.right_down_txt_bg_img h2,
.body_area_full p,
.body_area_right p {
    color: #76570d;
}

.full_top_area_down_img ul li:before,
.full_top_area_down_img ul li.sky:before,
.right_top_area_down_img ul li:before,
.right_top_area_down_img ul li.sky:before {
    color: #b88917;
}

.name_input,
.sky_input,
.sky_select {
    border-color: #aaaaaa;
}

.sky_input:focus,
.sky_select:focus,
.name_input:focus {
    border-color: #8d6810;
    box-shadow: 0 0 0 2px rgba(200, 157, 44, 0.30);
}

.sky_check {
    background: #f2f2f2;
}

ol#toc li.current a,
ol#toc li.current a span {
    background-color: #292929 !important;
    color: #ffffff !important;
}

ol#toc li a,
ol#toc li a span {
    color: #292929 !important;
}

.submit_btn,
input[type="submit"].submit_btn,
button.submit_btn {
    background: #292929;
    background: linear-gradient(to bottom, #3a3a3a, #171717);
    color: #ffffff;
    border-color: #0b0b0b;
}

.submit_btn:hover,
input[type="submit"].submit_btn:hover,
button.submit_btn:hover {
    background: #c89d2c;
    color: #171717;
    border-color: #9a7413;
}

.foot_con,
.foot_area,
.foot_wraper {
    background: #171717;
}

.foot_wraper {
    border-top-color: #c89d2c;
}

.foot_txt,
.foot_txt p,
.foot_txt a {
    color: #f0f0f0;
}

.foot_txt a:hover {
    color: #e1ba4c;
}

/* NewFamily.asp reusable headings after removing inline colours */
.formPageHeading {
    color: #242424 !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 1.25;
    margin: 0 0 14px 0 !important;
    padding: 0 0 6px 0 !important;
    text-align: left;
}

.formSectionHeading {
    color: #76570d !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px !important;
    font-weight: bold !important;
    line-height: 1.3;
    margin: 12px 0 4px 0 !important;
    padding: 0 !important;
    text-align: left;
}

.formPageHeading b,
.formSectionHeading b {
    color: inherit !important;
}

/* Schedule colours shared by both portal themes */
.ScheduleDateFuture {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #1f5fbf;
    margin: 5px 2px 5px 5px;
}

.ScheduleDateToday {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #2f8a2f;
    margin: 5px 2px 5px 5px;
}

.ScheduleDatePast {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 20px;
    color: #8a8a8a;
    margin: 5px 2px 5px 5px;
}

.ScheduleRowNormal,
.ScheduleRowPast,
.ScheduleRowInProgress,
.ScheduleRowComingUp,
.ScheduleRowSemis,
.ScheduleRowFinals,
.ScheduleRowWinner {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    margin: 5px 2px 5px 5px;
}

.ScheduleRowNormal,
.ScheduleRowFinals { color: #1f5fbf; }
.ScheduleRowPast { color: #8a8a8a; }
.ScheduleRowInProgress,
.ScheduleRowSemis { color: #2f8a2f; }
.ScheduleRowComingUp,
.ScheduleRowWinner { color: #c53030; }
.ScheduleRowInProgress,
.ScheduleRowComingUp,
.ScheduleRowWinner { font-weight: bold; }
.ScheduleRowNormal,
.ScheduleRowPast,
.ScheduleRowSemis,
.ScheduleRowFinals { font-weight: normal; }

/* Override legacy blue form-label styling */
.editlabel,
.editlabel2,
.edittitle,
.editor2,
.full_top_area_down_img .editlabel,
.right_top_area_down_img .editlabel,
.reg_online_right_top_area_down_img .editlabel {
    color:#303030 !important;
}